diff --git a/browser/base/content/browser-sync.js b/browser/base/content/browser-sync.js
index 8af4febffd3b..ff21de07126b 100644
--- a/browser/base/content/browser-sync.js
+++ b/browser/base/content/browser-sync.js
@@ -167,9 +167,6 @@ var gSync = {
// setting this._initialized, so we don't attempt to remove observers.
return;
}
- let syncNow = document.getElementById("PanelUI-remotetabs-syncnow");
- let label = this.syncStrings.GetStringFromName("syncnow.label");
- syncNow.setAttribute("label", label);
// We start with every menuitem hidden (except for the "setup sync" state),
// so that we don't need to init the sync UI on windows like pageInfo.xul
// (see bug 1384856).
@@ -645,7 +642,7 @@ var gSync = {
},
updateSyncStatus(state) {
- let syncNow = document.getElementById("PanelUI-remotetabs-syncnow");
+ let syncNow = document.querySelector(".syncNowBtn");
const syncingUI = syncNow.getAttribute("syncstatus") == "active";
if (state.syncing != syncingUI) {
// Do we need to update the UI?
@@ -1171,26 +1168,11 @@ var gSync = {
onActivityStart() {
clearTimeout(this._syncAnimationTimer);
this._syncStartTime = Date.now();
-
- let label = this.syncStrings.GetStringFromName("syncingtabs.label");
- let remotetabsSyncNowEl = document.getElementById(
- "PanelUI-remotetabs-syncnow"
- );
- let fxaMenuSyncNowEl = document.getElementById(
- "PanelUI-fxa-menu-syncnow-button"
- );
- let syncElements = [remotetabsSyncNowEl, fxaMenuSyncNowEl];
-
- syncElements.forEach(el => {
+ document.querySelectorAll(".syncNowBtn").forEach(el => {
el.setAttribute("syncstatus", "active");
el.setAttribute("disabled", "true");
+ document.l10n.setAttributes(el, el.getAttribute("syncinglabel"));
});
-
- remotetabsSyncNowEl.setAttribute("label", label);
- fxaMenuSyncNowEl.setAttribute(
- "label",
- fxaMenuSyncNowEl.getAttribute("syncinglabel")
- );
},
_onActivityStop() {
@@ -1198,16 +1180,10 @@ var gSync = {
return;
}
- let label = this.syncStrings.GetStringFromName("syncnow.label");
- let syncElements = [
- document.getElementById("PanelUI-remotetabs-syncnow"),
- document.getElementById("PanelUI-fxa-menu-syncnow-button"),
- ];
-
- syncElements.forEach(el => {
+ document.querySelectorAll(".syncNowBtn").forEach(el => {
el.removeAttribute("syncstatus");
el.removeAttribute("disabled");
- el.setAttribute("label", label);
+ document.l10n.setAttributes(el, "fxa-toolbar-sync-now");
});
Services.obs.notifyObservers(null, "test:browser-sync:activity-stop");
@@ -1378,14 +1354,13 @@ var gSync = {
tooltiptext = this.formatLastSyncDate(state.lastSync);
}
- if (this.appMenuLabel) {
- let syncNow = document.getElementById("PanelUI-remotetabs-syncnow");
+ document.querySelectorAll(".syncNowBtn").forEach(el => {
if (tooltiptext) {
- syncNow.setAttribute("tooltiptext", tooltiptext);
+ el.setAttribute("tooltiptext", tooltiptext);
} else {
- syncNow.removeAttribute("tooltiptext");
+ el.removeAttribute("tooltiptext");
}
- }
+ });
},
get relativeTimeFormat() {
diff --git a/browser/base/content/browser.xhtml b/browser/base/content/browser.xhtml
index 947b5f5e696e..ef919839ee34 100644
--- a/browser/base/content/browser.xhtml
+++ b/browser/base/content/browser.xhtml
@@ -643,8 +643,7 @@
-
-
diff --git a/browser/base/content/test/sync/browser_sync.js b/browser/base/content/test/sync/browser_sync.js
index c270b2b1eff3..e28733e7b575 100644
--- a/browser/base/content/test/sync/browser_sync.js
+++ b/browser/base/content/test/sync/browser_sync.js
@@ -91,7 +91,7 @@ add_task(async function test_ui_state_syncing() {
gSync.updateAllUI(state);
- checkSyncNowButton("PanelUI-remotetabs-syncnow", true);
+ checkSyncNowButtons(true);
// Be good citizens and remove the "syncing" state.
gSync.updateAllUI({
@@ -285,7 +285,7 @@ function checkRemoteTabsPanel(expectedShownItemId, syncing, syncNowTooltip) {
);
if (syncing != undefined && syncNowTooltip != undefined) {
- checkSyncNowButton("PanelUI-remotetabs-syncnow", syncing, syncNowTooltip);
+ checkSyncNowButtons(syncing, syncNowTooltip);
}
}
@@ -302,43 +302,41 @@ function checkMenuBarItem(expectedShownItemId) {
);
}
-function checkSyncNowButton(buttonId, syncing, tooltip = null) {
- const remoteTabsButton = document.getElementById(buttonId);
+function checkSyncNowButtons(syncing, tooltip = null) {
+ const syncButtons = document.querySelectorAll(".syncNowBtn");
- is(
- remoteTabsButton.getAttribute("syncstatus"),
- syncing ? "active" : "",
- "button active has the right value"
- );
- if (tooltip) {
+ for (const syncButton of syncButtons) {
is(
- remoteTabsButton.getAttribute("tooltiptext"),
- tooltip,
- "button tooltiptext is set to the right value"
+ syncButton.getAttribute("syncstatus"),
+ syncing ? "active" : "",
+ "button active has the right value"
);
- }
+ if (tooltip) {
+ is(
+ syncButton.getAttribute("tooltiptext"),
+ tooltip,
+ "button tooltiptext is set to the right value"
+ );
+ }
- if (buttonId.endsWith("-fxa-icon")) {
- return;
- }
-
- is(
- remoteTabsButton.hasAttribute("disabled"),
- syncing,
- "disabled has the right value"
- );
- if (syncing) {
is(
- remoteTabsButton.getAttribute("label"),
- gSync.syncStrings.GetStringFromName("syncingtabs.label"),
- "label is set to the right value"
- );
- } else {
- is(
- remoteTabsButton.getAttribute("label"),
- gSync.syncStrings.GetStringFromName("syncnow.label"),
- "label is set to the right value"
+ syncButton.hasAttribute("disabled"),
+ syncing,
+ "disabled has the right value"
);
+ if (syncing) {
+ is(
+ document.l10n.getAttributes(syncButton).id,
+ syncButton.getAttribute("syncinglabel"),
+ "label is set to the right value"
+ );
+ } else {
+ is(
+ document.l10n.getAttributes(syncButton).id,
+ "fxa-toolbar-sync-now",
+ "label is set to the right value"
+ );
+ }
}
}
diff --git a/browser/components/customizableui/content/panelUI.inc.xul b/browser/components/customizableui/content/panelUI.inc.xul
index 6ae7e33725d6..39f969b75c84 100644
--- a/browser/components/customizableui/content/panelUI.inc.xul
+++ b/browser/components/customizableui/content/panelUI.inc.xul
@@ -488,9 +488,11 @@
@@ -750,10 +752,11 @@