Bug 1396085 - ensure the sync widget is always initialized and animate the sync spinner. r=Gijs
authorMark Hammond <mhammond@skippinet.com.au>
Tue, 05 Sep 2017 15:08:17 +1000
changeset 428557 fc8ba9723756b65083bcd03817eb6e984af956af
parent 428556 dfc055f4d93e2875e587927622769aa7e6ccdac5
child 428558 5ecc8d4b725a2974260eb5bef495b91771fadbb0
push id7761
push userjlund@mozilla.com
push dateFri, 15 Sep 2017 00:19:52 +0000
treeherdermozilla-beta@c38455951db4 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersGijs
bugs1396085
milestone57.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1396085 - ensure the sync widget is always initialized and animate the sync spinner. r=Gijs MozReview-Commit-ID: HcAuLZQ95EH
browser/components/customizableui/CustomizableWidgets.jsm
browser/themes/shared/customizableui/panelUI.inc.css
--- a/browser/components/customizableui/CustomizableWidgets.jsm
+++ b/browser/components/customizableui/CustomizableWidgets.jsm
@@ -251,16 +251,22 @@ const CustomizableWidgets = [
       DECKINDEX_TABS: 0,
       DECKINDEX_TABSDISABLED: 1,
       DECKINDEX_FETCHING: 2,
       DECKINDEX_NOCLIENTS: 3,
     },
     TABS_PER_PAGE: 25,
     NEXT_PAGE_MIN_TABS: 5, // Minimum number of tabs displayed when we click "Show All"
     onCreated(aNode) {
+      this._initialize(aNode);
+    },
+    _initialize(aNode) {
+      if (this._initialized) {
+        return;
+      }
       // Add an observer to the button so we get the animation during sync.
       // (Note the observer sets many attributes, including label and
       // tooltiptext, but we only want the 'syncstatus' attribute for the
       // animation)
       let doc = aNode.ownerDocument;
       let obnode = doc.createElementNS(kNSXUL, "observes");
       obnode.setAttribute("element", "sync-status");
       obnode.setAttribute("attribute", "syncstatus");
@@ -295,18 +301,20 @@ const CustomizableWidgets = [
         let os = e.target.getAttribute("mobile-promo-os");
         if (!os || e.button > 1) {
           return;
         }
         let link = Services.prefs.getCharPref(`identity.mobilepromo.${os}`) + "synced-tabs";
         doc.defaultView.openUILinkIn(link, "tab");
         CustomizableUI.hidePanelForNode(e.target);
       });
+      this._initialized = true;
     },
     onViewShowing(aEvent) {
+      this._initialize(aEvent.target);
       let doc = aEvent.target.ownerDocument;
       this._tabsList = doc.getElementById("PanelUI-remotetabs-tabslist");
       Services.obs.addObserver(this, SyncedTabs.TOPIC_TABS_CHANGED);
 
       if (SyncedTabs.isConfiguredToSyncTabs) {
         if (SyncedTabs.hasSyncedThisSession) {
           this.setDeckIndex(this.deckIndices.DECKINDEX_TABS);
         } else {
--- a/browser/themes/shared/customizableui/panelUI.inc.css
+++ b/browser/themes/shared/customizableui/panelUI.inc.css
@@ -800,17 +800,18 @@ toolbaritem[cui-areatype="menu-panel"][s
 #appMenu-fxa-label {
   -moz-box-flex: 1;
 }
 
 @keyframes syncRotate {
   to { transform: rotate(360deg); }
 }
 
-#appMenu-fxa-icon[syncstatus="active"] > .toolbarbutton-icon {
+#appMenu-fxa-icon[syncstatus="active"] > .toolbarbutton-icon,
+#PanelUI-remotetabs-syncnow[syncstatus="active"] > .toolbarbutton-icon {
   animation: syncRotate 0.8s linear infinite;
   fill: #0a84ff;
 }
 
 #appMenu-fxa-status {
   -moz-box-align: center;
 }