Bug 1501980 - Add a mode label to the Content Blocking section in the main menu. r=johannh
authorErica Wright <ewright@mozilla.com>
Fri, 30 Nov 2018 14:30:18 +0000
changeset 448971 d28d9a723d2441bcd168303a3e990be573f13e65
parent 448970 66f69c1eb0c2b81acce633c98960bbce974f018e
child 448972 084b61a81dc2e6a1ff29a24c7e78f6e28c4b1a35
push id35139
push userccoroiu@mozilla.com
push dateSat, 01 Dec 2018 02:30:08 +0000
treeherdermozilla-central@22425b629a9d [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersjohannh
bugs1501980
milestone65.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 1501980 - Add a mode label to the Content Blocking section in the main menu. r=johannh Differential Revision: https://phabricator.services.mozilla.com/D13170
browser/base/content/browser-contentblocking.js
browser/base/content/test/trackingUI/browser_trackingUI_categories.js
browser/components/customizableui/content/panelUI.inc.xul
browser/themes/shared/customizableui/panelUI.inc.css
--- a/browser/base/content/browser-contentblocking.js
+++ b/browser/base/content/browser-contentblocking.js
@@ -313,17 +313,17 @@ var ContentBlocking = {
 
     this.updateAnimationsEnabled();
 
     Services.prefs.addObserver(this.PREF_ANIMATIONS_ENABLED, this.updateAnimationsEnabled);
 
     XPCOMUtils.defineLazyPreferenceGetter(this, "reportBreakageEnabled",
       this.PREF_REPORT_BREAKAGE_ENABLED, false);
 
-    this.appMenuLabel.setAttribute("label", this.strings.appMenuTitle);
+    this.appMenuLabel.setAttribute("value", this.strings.appMenuTitle);
     this.appMenuLabel.setAttribute("tooltiptext", this.strings.appMenuTooltip);
 
     this.activeTooltipText =
       gNavigatorBundle.getString("trackingProtection.icon.activeTooltip");
     this.disabledTooltipText =
       gNavigatorBundle.getString("trackingProtection.icon.disabledTooltip");
     this.updateCBCategoryLabel = this.updateCBCategoryLabel.bind(this);
     this.updateCBCategoryLabel();
@@ -342,29 +342,31 @@ var ContentBlocking = {
   },
 
   updateCBCategoryLabel() {
     if (!Services.prefs.prefHasUserValue(this.PREF_CB_CATEGORY)) {
       // Fallback to not setting a label, it's preferable to not set a label than to set an incorrect one.
       return;
     }
     let button = document.getElementById("tracking-protection-preferences-button");
+    let appMenuCategoryLabel = document.getElementById("appMenu-tp-category");
     let label;
     let category = Services.prefs.getStringPref(this.PREF_CB_CATEGORY);
     switch (category) {
     case ("standard"):
       label = gNavigatorBundle.getString("contentBlocking.category.standard");
       break;
     case ("strict"):
       label = gNavigatorBundle.getString("contentBlocking.category.strict");
       break;
     case ("custom"):
       label = gNavigatorBundle.getString("contentBlocking.category.custom");
       break;
     }
+    appMenuCategoryLabel.value = label;
     button.label = label;
   },
 
   hideIdentityPopupAndReload() {
     this.identityPopup.hidePopup();
     BrowserReload();
   },
 
--- a/browser/base/content/test/trackingUI/browser_trackingUI_categories.js
+++ b/browser/base/content/test/trackingUI/browser_trackingUI_categories.js
@@ -1,14 +1,16 @@
 const CAT_PREF = "browser.contentblocking.category";
 const TP_PREF = "privacy.trackingprotection.enabled";
 const TP_PB_PREF = "privacy.trackingprotection.pbmode.enabled";
 const TPC_PREF = "network.cookie.cookieBehavior";
 const TT_PREF = "urlclassifier.trackingTable";
 
+ChromeUtils.import("resource://testing-common/CustomizableUITestUtils.jsm", this);
+
 registerCleanupFunction(function() {
   Services.prefs.clearUserPref(TP_PREF);
   Services.prefs.clearUserPref(TP_PB_PREF);
   Services.prefs.clearUserPref(TPC_PREF);
   Services.prefs.clearUserPref(TT_PREF);
   Services.prefs.clearUserPref(CAT_PREF);
 });
 
@@ -35,8 +37,36 @@ add_task(async function testCategoryLabe
 
     Services.prefs.setStringPref(CAT_PREF, "custom");
     await TestUtils.waitForCondition(() => preferencesButton.label ==
       gNavigatorBundle.getString("contentBlocking.category.custom"));
     is(preferencesButton.label, gNavigatorBundle.getString("contentBlocking.category.custom"),
       "The preferencesButton label has been changed to custom");
   });
 });
+
+add_task(async function testCategoryLabelsInAppMenu() {
+  await BrowserTestUtils.withNewTab("http://www.example.com", async function() {
+    let cuiTestUtils = new CustomizableUITestUtils(window);
+    await cuiTestUtils.openMainMenu();
+
+    let appMenuCategoryLabel = document.getElementById("appMenu-tp-category");
+    ok(appMenuCategoryLabel.value, "The appMenuCategory label exists");
+
+    Services.prefs.setStringPref(CAT_PREF, "strict");
+    await TestUtils.waitForCondition(() => appMenuCategoryLabel.value ==
+      gNavigatorBundle.getString("contentBlocking.category.strict"));
+    is(appMenuCategoryLabel.value, gNavigatorBundle.getString("contentBlocking.category.strict"),
+      "The appMenuCategory label has been changed to strict");
+
+    Services.prefs.setStringPref(CAT_PREF, "standard");
+    await TestUtils.waitForCondition(() => appMenuCategoryLabel.value ==
+      gNavigatorBundle.getString("contentBlocking.category.standard"));
+    is(appMenuCategoryLabel.value, gNavigatorBundle.getString("contentBlocking.category.standard"),
+      "The appMenuCategory label has been changed to standard");
+
+    Services.prefs.setStringPref(CAT_PREF, "custom");
+    await TestUtils.waitForCondition(() => appMenuCategoryLabel.value ==
+      gNavigatorBundle.getString("contentBlocking.category.custom"));
+    is(appMenuCategoryLabel.value, gNavigatorBundle.getString("contentBlocking.category.custom"),
+      "The appMenuCategory label has been changed to custom");
+  });
+});
--- a/browser/components/customizableui/content/panelUI.inc.xul
+++ b/browser/components/customizableui/content/panelUI.inc.xul
@@ -220,19 +220,23 @@
           <toolbarbutton id="appMenu-fxa-icon"
                          class="subviewbutton subviewbutton-iconic"
                          onmouseover="gSync.refreshSyncButtonsTooltip();"
                          oncommand="gSync.doSync();"
                          closemenu="none"/>
         </toolbaritem>
         <toolbarseparator class="sync-ui-item"/>
         <toolbaritem>
-          <toolbarbutton id="appMenu-tp-label"
-                         class="subviewbutton subviewbutton-iconic"
-                         oncommand="ContentBlocking.openPreferences('appMenu-trackingprotection');"/>
+          <toolbarbutton id="appMenu-tp-button"
+               class="subviewbutton subviewbutton-iconic"
+               oncommand="ContentBlocking.openPreferences('appMenu-trackingprotection');">
+            <image id="appMenu-tp-icon" class="toolbarbutton-icon"/>
+            <label id="appMenu-tp-label" class="toolbarbutton-text"/>
+            <label id="appMenu-tp-category"/>
+          </toolbarbutton>
         </toolbaritem>
         <toolbarseparator id="appMenu-tp-separator"/>
         <toolbarbutton id="appMenu-new-window-button"
                        class="subviewbutton subviewbutton-iconic"
                        label="&newNavigatorCmd.label;"
                        key="key_newNavigator"
                        command="cmd_newNavigator"/>
         <toolbarbutton id="appMenu-private-window-button"
--- a/browser/themes/shared/customizableui/panelUI.inc.css
+++ b/browser/themes/shared/customizableui/panelUI.inc.css
@@ -591,20 +591,35 @@ toolbarbutton[constrain-size="true"][cui
   background-color: @appmenuWarningBackgroundColorActive@;
 }
 
 /* Tracking Protection Button & Toggle */
 
 #appMenu-tp-label {
   -moz-context-properties: fill;
   fill: currentColor;
+  -moz-box-flex: 1;
+  padding: 0;
+  padding-inline-start: 8px;
+  margin: 0;
+}
+
+#appMenu-tp-icon {
   list-style-image: url(chrome://browser/skin/tracking-protection.svg);
+}
+
+#appMenu-tp-button {
   -moz-box-flex: 1;
 }
 
+#appMenu-tp-category {
+  color: var(--panel-disabled-color);
+  margin-inline-end: 0;
+}
+
 .addon-banner-item > .toolbarbutton-text,
 .panel-banner-item > .toolbarbutton-text {
   margin: 0;
   padding: 0 6px;
   text-align: start;
 }
 
 .addon-banner-item > .toolbarbutton-icon,