Bug 1450070 - WIP: Add update button to application panel UI
MozReview-Commit-ID: LUQU3gTx5QI
--- a/devtools/client/application/src/components/Worker.css
+++ b/devtools/client/application/src/components/Worker.css
@@ -11,22 +11,26 @@
* | | "Source" | script name | debug link |
* | |----------+-------------+----------------|
* | | "Status" | status | start link |
* +---+----------+-------------+----------------|
*/
.service-worker-container {
margin-bottom: 20px;
width: 100%;
- max-width: 600px;
+ max-width: 800px;
position: relative;
line-height: 1.5;
font-size: 13px;
}
+.service-worker-actions {
+ display: flex;
+}
+
.service-worker-container > .service-worker-scope {
padding-inline-start: 30px;
}
.service-worker-container > :not(.service-worker-scope) {
padding-inline-start: 70px;
}
--- a/devtools/client/application/src/components/Worker.js
+++ b/devtools/client/application/src/components/Worker.js
@@ -41,16 +41,17 @@ class Worker extends Component {
}
constructor(props) {
super(props);
this.debug = this.debug.bind(this);
this.start = this.start.bind(this);
this.unregister = this.unregister.bind(this);
+ this.update = this.update.bind(this);
}
debug() {
if (!this.isRunning()) {
console.log("Service workers cannot be debugged if they are not running");
return;
}
@@ -74,16 +75,24 @@ class Worker extends Component {
unregister() {
let { client, worker } = this.props;
client.request({
to: worker.registrationActor,
type: "unregister"
});
}
+ update() {
+ let { client, worker } = this.props;
+ client.request({
+ to: worker.registrationActor,
+ type: "update"
+ });
+ }
+
isRunning() {
// We know the worker is running if it has a worker actor.
return !!this.props.worker.workerActor;
}
isActive() {
return this.props.worker.active;
}
@@ -123,16 +132,25 @@ class Worker extends Component {
button({
onClick: this.unregister,
className: "devtools-button unregister-button",
"data-standalone": true
},
Strings.GetStringFromName("unregister"))
: null;
+ const updateButton = this.isActive() ?
+ button({
+ onClick: this.update,
+ className: "devtools-button update-button",
+ "data-standalone": true
+ },
+ "update")
+ : null;
+
const debugLinkDisabled = this.isRunning() ? "" : "disabled";
const debugLink = a({
onClick: this.isRunning() ? this.debug : null,
title: this.isRunning() ? null : "Only running service workers can be debugged",
className: `${debugLinkDisabled} debug-link`
},
Strings.GetStringFromName("debug"));
@@ -140,17 +158,22 @@ class Worker extends Component {
a({ onClick: this.start, className: "start-link" },
Strings.GetStringFromName("start"))
: null;
return li({ className: "service-worker-container" },
div(
{ className: "service-worker-scope" },
span({ title: worker.scope }, this.formatScope(worker.scope)),
- unregisterButton),
+ div(
+ { className: "service-worker-actions" },
+ unregisterButton,
+ updateButton
+ )
+ ),
div(
{ className: "service-worker-source" },
span({ className: "service-worker-meta-name" }, "Source"),
span({ className: "js-source-url", title: worker.scope },
this.formatSource(worker.url)),
debugLink),
div(
{ className: "service-worker-time" },