Bug 1538983 Rework highlightable buttons r=jaws

Our standard <button> binding has been carrying around an extra <label>
just to support search highlighting in about:preferences.  This patch
removes that overhead by moving the tweaks that about:preferences needs
into a custom element used only within about:preferences.

Differential Revision: https://phabricator.services.mozilla.com/D28511

--HG--
extra : rebase_source : f7fe120f29630c76a1af77ddf16a422d3c946c58

browser/components/preferences/in-content/containers.xul

@@ -27,7 +27,10 @@
   </vbox>
   <vbox>
     <hbox flex="1">
-      <button id="containersAdd" oncommand="gContainersPane.onAddButtonCommand();" data-l10n-id="containers-add-button"/>
+      <button id="containersAdd"
+              is="highlightable-button"
+              oncommand="gContainersPane.onAddButtonCommand();"
+              data-l10n-id="containers-add-button"/>
     </hbox>
   </vbox>
 </groupbox>

browser/components/preferences/in-content/findInPage.js

@@ -5,6 +5,20 @@
 /* import-globals-from extensionControlled.js */
 /* import-globals-from preferences.js */
 
+// A tweak to the standard <button> CE to use textContent on the <label>
+// inside the button, which allows the text to be highlighted when the user
+// is searching.
+
+const MozButton = customElements.get("button");
+class HighlightableButton extends MozButton {
+  static get inheritedAttributes() {
+    return Object.assign({}, super.inheritedAttributes, {
+      ".button-text": "text=label,accesskey,crop",
+    });
+  }
+}
+customElements.define("highlightable-button", HighlightableButton, {extends: "button"});
+
 var gSearchResultsPane = {
   listSearchTooltips: new Set(),
   listSearchMenuitemIndicators: new Set(),
@@ -405,8 +419,7 @@ var gSearchResultsPane = {
         this.listSearchMenuitemIndicators.add(menulist);
       }
 
-      if ((nodeObject.tagName == "button" ||
-           nodeObject.tagName == "menulist" ||
+      if ((nodeObject.tagName == "menulist" ||
            nodeObject.tagName == "menuitem") &&
            (labelResult || valueResult || keywordsResult)) {
         nodeObject.setAttribute("highlightable", "true");

browser/components/preferences/in-content/home.xul

@@ -12,6 +12,7 @@
       data-category="paneHome">
   <html:h1 style="-moz-box-flex: 1;" data-l10n-id="pane-home-title"/>
   <button id="restoreDefaultHomePageBtn"
+          is="highlightable-button"
           class="homepage-button check-home-page-controlled"
           data-preference-related="browser.startup.homepage"
           data-l10n-id="home-restore-defaults"
@@ -51,6 +52,7 @@
                 autocompletesearch="unifiedcomplete" />
         <hbox class="homepage-buttons">
           <button id="useCurrentBtn"
+                  is="highlightable-button"
                   flex="1"
                   class="homepage-button check-home-page-controlled"
                   data-l10n-id="use-current-pages"
@@ -58,6 +60,7 @@
                   disabled="true"
                   preference="pref.browser.homepage.disable_button.current_page"/>
           <button id="useBookmarkBtn"
+                  is="highlightable-button"
                   flex="1"
                   class="homepage-button check-home-page-controlled"
                   data-l10n-id="choose-bookmark"
@@ -86,6 +89,7 @@
         align="center" hidden="true" class="extension-controlled">
     <description control="disableHomePageExtension" flex="1" />
     <button id="disableHomePageExtension"
+            is="highlightable-button"
             class="extension-controlled-button accessory-button"
             data-l10n-id="disable-extension" />
   </hbox>
@@ -93,6 +97,7 @@
         align="center" hidden="true" class="extension-controlled">
     <description control="disableNewTabExtension" flex="1" />
     <button id="disableNewTabExtension"
+            is="highlightable-button"
             class="extension-controlled-button accessory-button"
             data-l10n-id="disable-extension" />
   </hbox>

browser/components/preferences/in-content/main.xul

@@ -48,6 +48,7 @@
         <image class="face-sad"/>
         <label id="isNotDefaultLabel" flex="1" data-l10n-id="is-not-default"/>
         <button id="setDefaultButton"
+                is="highlightable-button"
                 class="accessory-button"
                 data-l10n-id="set-as-my-default-browser"
                 preference="pref.general.disable_button.default_browser"/>
@@ -95,6 +96,7 @@
             align="center" class="extension-controlled">
         <description control="disableContainersExtension" flex="1" />
         <button id="disableContainersExtension"
+                is="highlightable-button"
                 class="extension-controlled-button accessory-button"
                 data-l10n-id="disable-extension" />
       </hbox>
@@ -109,6 +111,7 @@
         <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
         <hbox>
           <button id="browserContainersSettings"
+                  is="highlightable-button"
                   class="accessory-button"
                   data-l10n-id="browser-containers-settings"
                   search-l10n-ids="containers-add-button.label,
@@ -176,6 +179,7 @@
     <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
     <hbox>
       <button id="advancedFonts"
+              is="highlightable-button"
               class="accessory-button"
               icon="select-font"
               data-l10n-id="advanced-fonts"
@@ -248,6 +252,7 @@
     <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
     <hbox>
       <button id="colors"
+              is="highlightable-button"
               class="accessory-button"
               icon="select-color"
               data-l10n-id="colors-settings"
@@ -280,6 +285,7 @@
         <menupopup/>
       </menulist>
       <button id="manageBrowserLanguagesButton"
+              is="highlightable-button"
               class="accessory-button"
               data-l10n-id="manage-browser-languages-button"
               oncommand="gMainPane.showBrowserLanguages({search: false})"/>
@@ -295,6 +301,7 @@
     <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
     <hbox>
       <button id="chooseLanguage"
+              is="highlightable-button"
               class="accessory-button"
               data-l10n-id="choose-button"
               search-l10n-ids="
@@ -324,6 +331,7 @@
       </hbox>
     </hbox>
     <button id="translateButton"
+            is="highlightable-button"
             class="accessory-button"
             data-l10n-id="translate-exceptions"/>
   </hbox>
@@ -357,6 +365,7 @@
                readonly="true"
                aria-labelledby="saveTo"/>
       <button id="chooseFolder"
+              is="highlightable-button"
               class="accessory-button"
               data-l10n-id="download-choose-folder"/>
     </hbox>
@@ -431,6 +440,7 @@
     <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
     <vbox>
       <button id="showUpdateHistory"
+              is="highlightable-button"
               class="accessory-button"
               data-l10n-id="update-history"
               preference="app.update.disable_button.showUpdateHistory"
@@ -447,18 +457,21 @@
       <hbox id="checkForUpdates" align="start">
         <spacer flex="1"/>
         <button id="checkForUpdatesButton"
+                is="highlightable-button"
                 data-l10n-id="update-checkForUpdatesButton"
                 oncommand="gAppUpdater.checkForUpdates();"/>
       </hbox>
       <hbox id="downloadAndInstall" align="start">
         <spacer flex="1"/>
         <button id="downloadAndInstallButton"
+                is="highlightable-button"
                 oncommand="gAppUpdater.startDownload();"/>
                 <!-- label and accesskey will be filled by JS -->
       </hbox>
       <hbox id="apply" align="start">
         <spacer flex="1"/>
         <button id="updateButton"
+                is="highlightable-button"
                 data-l10n-id="update-updateButton"
                 oncommand="gAppUpdater.buttonRestartAfterDownload();"/>
       </hbox>
@@ -467,6 +480,7 @@
         <label data-l10n-id="update-checkingForUpdates"></label>
         <spacer flex="1"/>
         <button data-l10n-id="update-checkForUpdatesButton"
+                is="highlightable-button"
                 disabled="true"/>
       </hbox>
       <hbox id="downloading" align="start" data-l10n-id="update-downloading">
@@ -483,12 +497,14 @@
         </label>
         <spacer flex="1"/>
         <button data-l10n-id="update-checkForUpdatesButton"
+                is="highlightable-button"
                 oncommand="gAppUpdater.checkForUpdates();"/>
       </hbox>
       <hbox id="policyDisabled" align="start">
         <label data-l10n-id="update-adminDisabled"></label>
         <spacer flex="1"/>
         <button data-l10n-id="update-checkForUpdatesButton"
+                is="highlightable-button"
                 disabled="true"/>
       </hbox>
       <hbox id="noUpdatesFound" align="start">
@@ -496,12 +512,14 @@
         <label data-l10n-id="update-noUpdatesFound"></label>
         <spacer flex="1"/>
         <button data-l10n-id="update-checkForUpdatesButton"
+                is="highlightable-button"
                 oncommand="gAppUpdater.checkForUpdates();"/>
       </hbox>
       <hbox id="otherInstanceHandlingUpdates" align="start">
         <label data-l10n-id="update-otherInstanceHandlingUpdates"></label>
         <spacer flex="1"/>
         <button data-l10n-id="update-checkForUpdatesButton"
+                is="highlightable-button"
                 disabled="true"/>
       </hbox>
       <hbox id="manualUpdate" align="start">
@@ -511,6 +529,7 @@
         </description>
         <spacer flex="1"/>
         <button data-l10n-id="update-checkForUpdatesButton"
+                is="highlightable-button"
                 disabled="true"/>
       </hbox>
       <hbox id="unsupportedSystem" align="start">
@@ -519,12 +538,14 @@
         </description>
         <spacer flex="1"/>
         <button data-l10n-id="update-checkForUpdatesButton"
+                is="highlightable-button"
                 disabled="true"/>
       </hbox>
       <hbox id="restarting" align="start">
         <image class="update-throbber"/><label data-l10n-id="update-restarting"></label>
         <spacer flex="1"/>
         <button data-l10n-id="update-updateButton"
+                is="highlightable-button"
                 disabled="true"/>
       </hbox>
     </deck>
@@ -673,6 +694,7 @@
     <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
     <hbox>
       <button id="connectionSettings"
+              is="highlightable-button"
               class="accessory-button"
               icon="network"
               data-l10n-id="network-proxy-connection-settings"

browser/components/preferences/in-content/privacy.xul

@@ -31,6 +31,7 @@
         <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
         <hbox>
           <button id="trackingProtectionExceptions"
+                  is="highlightable-button"
                   class="accessory-button"
                   flex="1"
                   data-l10n-id="tracking-manage-exceptions"
@@ -57,6 +58,7 @@
                      data-l10n-id="content-blocking-setting-standard"
                      flex="1"/>
               <button id="standardArrow"
+                      is="highlightable-button"
                       class="arrowhead default-content-blocking-ui"
                       data-l10n-id="content-blocking-expand-section"
                       aria-expanded="false"/>
@@ -116,6 +118,7 @@
                     <vbox>
                       <spacer flex="1"/>
                       <button class="accessory-button reload-tabs-button"
+                              is="highlightable-button"
                               data-l10n-id="content-blocking-reload-tabs-button"/>
                       <spacer flex="1"/>
                     </vbox>
@@ -131,6 +134,7 @@
                      data-l10n-id="content-blocking-setting-strict"
                      flex="1"/>
               <button id="strictArrow"
+                      is="highlightable-button"
                       class="arrowhead"
                       data-l10n-id="content-blocking-expand-section"
                       aria-expanded="false"/>
@@ -190,6 +194,7 @@
                     <vbox>
                       <spacer flex="1"/>
                       <button class="accessory-button reload-tabs-button"
+                              is="highlightable-button"
                               data-l10n-id="content-blocking-reload-tabs-button"/>
                       <spacer flex="1"/>
                     </vbox>
@@ -217,6 +222,7 @@
                    data-l10n-id="content-blocking-setting-custom"
                    flex="1"/>
             <button id="customArrow"
+                    is="highlightable-button"
                     class="arrowhead"
                     data-l10n-id="content-blocking-expand-section"
                     aria-expanded="false"/>
@@ -228,6 +234,7 @@
                     align="center" hidden="true" class="extension-controlled">
                 <description control="contentBlockingDisableTrackingProtectionExtension" flex="1"/>
                 <button id="contentBlockingDisableTrackingProtectionExtension"
+                        is="highlightable-button"
                         class="extension-controlled-button accessory-button"
                         data-l10n-id="disable-extension" hidden="true"/>
               </hbox>
@@ -306,6 +313,7 @@
                   <vbox>
                     <spacer flex="1"/>
                     <button class="accessory-button reload-tabs-button"
+                            is="highlightable-button"
                             data-l10n-id="content-blocking-reload-tabs-button"/>
                     <spacer flex="1"/>
                   </vbox>
@@ -368,6 +376,7 @@
       <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
       <hbox>
         <button id="clearSiteDataButton"
+            is="highlightable-button"
             class="accessory-button"
             icon="clear"
             search-l10n-ids="clear-site-data-cookies-empty.label, clear-site-data-cache-empty.label"
@@ -375,6 +384,7 @@
       </hbox>
       <hbox>
         <button id="siteDataSettings"
+                is="highlightable-button"
                 class="accessory-button"
                 data-l10n-id="sitedata-settings"
                 search-l10n-ids="
@@ -388,6 +398,7 @@
       </hbox>
       <hbox>
         <button id="cookieExceptions"
+                is="highlightable-button"
                 class="accessory-button"
                 data-l10n-id="sitedata-cookies-permissions"
                 preference="pref.privacy.disable_button.cookie_exceptions"
@@ -420,6 +431,7 @@
       <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
       <hbox>
         <button id="passwordExceptions"
+                is="highlightable-button"
                 class="accessory-button"
                 data-l10n-id="forms-exceptions"
                 preference="pref.privacy.disable_button.view_passwords_exceptions"
@@ -434,6 +446,7 @@
       <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
       <hbox>
         <button id="showPasswords"
+                is="highlightable-button"
                 class="accessory-button"
                 data-l10n-id="forms-saved-logins"
                 search-l10n-ids="forms-saved-logins.label"
@@ -448,6 +461,7 @@
     <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
     <hbox>
       <button id="changeMasterPassword"
+              is="highlightable-button"
               class="accessory-button"
               data-l10n-id="forms-master-pw-change"/>
     </hbox>
@@ -537,12 +551,14 @@
     </deck>
     <vbox id="historyButtons" align="end">
       <button id="clearHistoryButton"
+              is="highlightable-button"
               class="accessory-button"
               icon="clear"
               data-l10n-id="history-clear-button"/>
       <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
       <hbox>
         <button id="clearDataSettings"
+                is="highlightable-button"
                 class="accessory-button"
                 data-l10n-id="history-clear-on-close-settings"
                 search-l10n-ids="
@@ -599,6 +615,7 @@
       </description>
       <hbox pack="end">
         <button id="locationSettingsButton"
+                is="highlightable-button"
                 class="accessory-button"
                 data-l10n-id="permissions-location-settings"
                 search-l10n-ids="
@@ -622,6 +639,7 @@
       </description>
       <hbox pack="end">
         <button id="cameraSettingsButton"
+                is="highlightable-button"
                 class="accessory-button"
                 data-l10n-id="permissions-camera-settings"
                 search-l10n-ids="
@@ -645,6 +663,7 @@
       </description>
       <hbox pack="end">
         <button id="microphoneSettingsButton"
+                is="highlightable-button"
                 class="accessory-button"
                 data-l10n-id="permissions-microphone-settings"
                 search-l10n-ids="
@@ -674,6 +693,7 @@
       </description>
       <hbox pack="end">
         <button id="notificationSettingsButton"
+                is="highlightable-button"
                 class="accessory-button"
                 data-l10n-id="permissions-notification-settings"
                 search-l10n-ids="
@@ -703,6 +723,7 @@
     <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
     <hbox>
       <button id="autoplayMediaPolicyButton"
+              is="highlightable-button"
               class="accessory-button"
               data-l10n-id="permissions-block-autoplay-media-exceptions"
               search-l10n-ids="permissions-address,
@@ -723,6 +744,7 @@
     <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
     <hbox>
       <button id="popupPolicyButton"
+              is="highlightable-button"
               class="accessory-button"
               data-l10n-id="permissions-block-popups-exceptions"
               search-l10n-ids="
@@ -744,6 +766,7 @@
     <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
     <hbox>
       <button id="addonExceptions"
+              is="highlightable-button"
               class="accessory-button"
               data-l10n-id="permissions-addon-exceptions"
               search-l10n-ids="
@@ -895,6 +918,7 @@
       <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
       <hbox pack="end">
         <button id="viewCertificatesButton"
+                is="highlightable-button"
                 class="accessory-button"
                 data-l10n-id="certs-view"
                 preference="security.disable_button.openCertManager"
@@ -917,6 +941,7 @@
       <!-- Please don't remove the wrapping hbox/vbox/box for these elements. It's used to properly compute the search tooltip position. -->
       <hbox pack="end">
         <button id="viewSecurityDevicesButton"
+                is="highlightable-button"
                 class="accessory-button"
                 data-l10n-id="certs-devices"
                 preference="security.disable_button.openDeviceManager"

browser/components/preferences/in-content/search.xul

@@ -67,10 +67,12 @@
 
       <hbox>
         <button id="restoreDefaultSearchEngines"
+                is="highlightable-button"
                 data-l10n-id="search-restore-default"
                 />
         <spacer flex="1"/>
         <button id="removeEngineButton"
+                is="highlightable-button"
                 class="searchEngineAction"
                 data-l10n-id="search-remove-engine"
                 disabled="true"

browser/components/preferences/in-content/sync.xul

@@ -35,6 +35,7 @@
             <label id="signedOutAccountBoxTitle"><html:h2 data-l10n-id="sync-signedout-account-title"/></label>
           </hbox>
           <button id="noFxaSignIn"
+                  is="highlightable-button"
                   class="accessory-button"
                   data-l10n-id="sync-signedout-account-signin"/>
         </hbox>
@@ -87,6 +88,7 @@
                   </label>
                   <label id="fxaEmailAddress" flex="1" crop="end"/>
                   <button id="fxaUnlinkButton"
+                          is="highlightable-button"
                           class="accessory-button"
                           data-l10n-id="sync-disconnect"/>
                 </hbox>
@@ -112,8 +114,12 @@
                     data-l10n-args='{"email": ""}'/>
                 </hbox>
                 <hbox class="fxaAccountBoxButtons">
-                  <button id="verifyFxaAccount" data-l10n-id="sync-resend-verification"/>
-                  <button id="unverifiedUnlinkFxaAccount" data-l10n-id="sync-remove-account"/>
+                  <button id="verifyFxaAccount"
+                          is="highlightable-button"
+                          data-l10n-id="sync-resend-verification"/>
+                  <button id="unverifiedUnlinkFxaAccount"
+                          is="highlightable-button"
+                          data-l10n-id="sync-remove-account"/>
                 </hbox>
               </vbox>
             </hbox>
@@ -132,8 +138,12 @@
                     data-l10n-args='{"email": ""}'/>
                 </hbox>
                 <hbox class="fxaAccountBoxButtons">
-                  <button id="rejectReSignIn" data-l10n-id="sync-sign-in"/>
-                  <button id="rejectUnlinkFxaAccount" data-l10n-id="sync-remove-account"/>
+                  <button id="rejectReSignIn"
+                          is="highlightable-button"
+                          data-l10n-id="sync-sign-in"/>
+                  <button id="rejectUnlinkFxaAccount"
+                          is="highlightable-button"
+                          data-l10n-id="sync-remove-account"/>
                 </hbox>
               </vbox>
             </hbox>
@@ -174,11 +184,14 @@
       <hbox id="fxaDeviceName">
         <textbox id="fxaSyncComputerName" flex="1" disabled="true"/>
         <button id="fxaChangeDeviceName"
+                is="highlightable-button"
                 data-l10n-id="sync-device-name-change"/>
         <button id="fxaCancelChangeDeviceName"
+                is="highlightable-button"
                 data-l10n-id="sync-device-name-cancel"
                 hidden="true"/>
         <button id="fxaSaveChangeDeviceName"
+                is="highlightable-button"
                 data-l10n-id="sync-device-name-save"
                 hidden="true"/>
       </hbox>

browser/components/preferences/in-content/syncDisconnect.xul

@@ -49,10 +49,12 @@
       <spacer flex="1"/>
       <hbox class="actionButtons" align="right" flex="1">
         <button id="butCancel"
+                is="highlightable-button"
                 oncommand="close(event);"
                 class="syncDisconnectButton"
                 data-l10n-id="sync-disconnect-cancel"/>
         <button id="butDisconnect"
+                is="highlightable-button"
                 oncommand="gSyncDisconnectDialog.accept(event);"
                 class="syncDisconnectButton"
                 data-l10n-id="sync-disconnect-confirm-disconnect"/>

browser/extensions/formautofill/FormAutofillPreferences.jsm

@@ -79,7 +79,7 @@ FormAutofillPreferences.prototype = {
     let addressAutofillCheckboxGroup = document.createXULElement("hbox");
     let addressAutofillCheckbox = document.createXULElement("checkbox");
     let addressAutofillLearnMore = document.createXULElement("label", {is: "text-link"});
-    let savedAddressesBtn = document.createXULElement("button");
+    let savedAddressesBtn = document.createXULElement("button", {is: "highlightable-button"});
     // Wrappers are used to properly compute the search tooltip positions
     let savedAddressesBtnWrapper = document.createXULElement("hbox");
     let savedCreditCardsBtnWrapper = document.createXULElement("hbox");
@@ -138,7 +138,7 @@ FormAutofillPreferences.prototype = {
       let creditCardAutofillCheckboxGroup = document.createXULElement("hbox");
       let creditCardAutofillCheckbox = document.createXULElement("checkbox");
       let creditCardAutofillLearnMore = document.createXULElement("label", {is: "text-link"});
-      let savedCreditCardsBtn = document.createXULElement("button");
+      let savedCreditCardsBtn = document.createXULElement("button", {is: "highlightable-button"});
       savedCreditCardsBtn.className = "accessory-button";
       creditCardAutofillCheckbox.className = "tail-with-learn-more";
       creditCardAutofillLearnMore.className = "learnMore";

toolkit/content/widgets/button.js

@@ -224,8 +224,7 @@
       return {
         ".box-inherit": "align,dir,pack,orient",
         ".button-icon": "src=image",
-        ".button-text": "value=label,accesskey,crop,highlightable",
-        ".button-highlightable-text": "text=label,accesskey,crop,highlightable",
+        ".button-text": "value=label,accesskey,crop",
         ".button-menu-dropmarker": "open,disabled,label",
       };
     }
@@ -239,7 +238,6 @@
         <hbox class="box-inherit button-box" align="center" pack="center" flex="1" anonid="button-box">
           <image class="button-icon"></image>
           <label class="button-text"></label>
-          <label class="button-highlightable-text"></label>
         </hbox>`), true);
       Object.defineProperty(this, "buttonFragment", {value: frag});
       return frag;
@@ -281,7 +279,7 @@
           }
         });
       } else {
-        fragment = MozButton.buttonFragment;
+        fragment = this.constructor.buttonFragment;
       }
 
       this.appendChild(fragment.cloneNode(true));

toolkit/content/xul.css

@@ -660,8 +660,6 @@ tabmodalprompt {
   text-shadow: none;
 }
 
-.button-highlightable-text:not([highlightable="true"]),
-.button-text[highlightable="true"],
 .menulist-highlightable-label:not([highlightable="true"]),
 .menulist-label[highlightable="true"],
 .menu-iconic-highlightable-text:not([highlightable="true"]),