Settings WebUI: adding extensions external link in settings sidebar menu

Bug: 809293
Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation
Change-Id: I301fa871eb33ccbae30c219f4ff3b12c7916f6dd
Reviewed-on: https://chromium-review.googlesource.com/976942
Commit-Queue: Esmael El-Moslimany <aee@chromium.org>
Reviewed-by: Demetrios Papadopoulos <dpapad@chromium.org>
Reviewed-by: Hector Carmona <hcarmona@chromium.org>
Cr-Commit-Position: refs/heads/master@{#546033}

chrome/browser/resources/settings/settings_menu/settings_menu.html

@@ -65,12 +65,15 @@
         outline: auto 5px -webkit-focus-ring-color;
       }
 
-      #advancedButton > span {
+      #advancedButton > span,
+      #extensionsButton > span {
         flex: 1;
       }
 
-      #advancedButton > iron-icon {
-        -webkit-margin-end: 22px;  /* 24px - 2px from margin for outline. */
+      #advancedButton > iron-icon,
+      #extensionsButton > iron-icon {
+        @apply --cr-icon-height-width;
+        -webkit-margin-end: 14px;  /* 16px - 2px from margin for outline. */
       }
 
       #menuSeparator {
@@ -80,8 +83,9 @@
         margin-top: 8px;
       }
     </style>
-    <iron-selector id="topMenu" selectable="a" attr-for-selected="href"
-        on-iron-activate="onSelectorActivate_" role="navigation">
+    <iron-selector id="topMenu" selectable="a:not([unselectable])"
+        attr-for-selected="href" on-iron-activate="onSelectorActivate_"
+        role="navigation">
 <if expr="chromeos">
       <a href="/internet">
         <iron-icon icon="settings:network-wifi"></iron-icon>
@@ -189,6 +193,11 @@
         </iron-selector>
       </iron-collapse>
       <div id="menuSeparator"></div>
+      <a id="extensionsButton" unselectable href="chrome://extensions"
+          target="_blank" on-click="onExternalLinkClick_">
+        <span>$i18n{extensionsPageTitle}</span>
+        <iron-icon class="cr-icon icon-external" actionable></iron-icon>
+      </a>
       <a id="about-menu" href="/help">$i18n{aboutPageTitle}</a>
     </iron-selector>
   </template>

chrome/browser/resources/settings/settings_menu/settings_menu.js

@@ -52,7 +52,8 @@ Polymer({
    * @private
    */
   onLinkTap_: function(event) {
-    if (event.target.hasAttribute('href'))
+    if (event.target.tagName == 'A' &&
+        !event.target.hasAttribute('unselectable'))
       event.preventDefault();
   },
 
@@ -87,4 +88,9 @@ Polymer({
   arrowState_: function(opened) {
     return opened ? 'cr:arrow-drop-up' : 'cr:arrow-drop-down';
   },
+
+  /** @private */
+  onExternalLinkClick_: function() {
+    this.fire('external-link-click');
+  },
 });

chrome/browser/resources/settings/settings_ui/settings_ui.js

@@ -59,7 +59,7 @@ Polymer({
     lastSearchQuery_: {
       type: String,
       value: '',
-    }
+    },
   },
 
   listeners: {
@@ -82,6 +82,10 @@ Polymer({
       this.$.drawerTemplate.if = true;
     });
 
+    this.addEventListener('external-link-click', () => {
+      this.$.drawer.closeDrawer();
+    });
+
     window.addEventListener('popstate', e => {
       this.$.drawer.closeDrawer();
     });

chrome/browser/ui/webui/settings/md_settings_localized_strings_provider.cc

@@ -2331,6 +2331,11 @@ void AddMultideviceStrings(content::WebUIDataSource* html_source) {
 }
 #endif
 
+void AddExtensionsStrings(content::WebUIDataSource* html_source) {
+  html_source->AddLocalizedString("extensionsPageTitle",
+                                  IDS_SETTINGS_EXTENSIONS_CHECKBOX_LABEL);
+}
+
 }  // namespace
 
 void AddLocalizedStrings(content::WebUIDataSource* html_source,
@@ -2379,6 +2384,7 @@ void AddLocalizedStrings(content::WebUIDataSource* html_source,
   AddImportDataStrings(html_source);
   AddSystemStrings(html_source);
 #endif
+  AddExtensionsStrings(html_source);
 
 #if defined(USE_NSS_CERTS)
   certificate_manager::AddLocalizedStrings(html_source);

chrome/test/data/webui/settings/cr_settings_browsertest.js

@@ -1276,6 +1276,7 @@ CrSettingsMenuTest.prototype = {
 
   /** @override */
   extraLibraries: CrSettingsBrowserTest.prototype.extraLibraries.concat([
+    'test_util.js',
     'settings_menu_test.js',
   ]),
 };

chrome/test/data/webui/settings/settings_menu_test.js

@@ -75,6 +75,13 @@ cr.define('settings_menu', function() {
       MockInteractions.tap(settingsMenu.$.people);
       assertEquals('', settings.getQueryParameters().toString());
     });
+
+    test('extensionsButtonClicked', function() {
+      const eventPromise =
+          test_util.eventToPromise('external-link-click', settingsMenu);
+      settingsMenu.$.extensionsButton.click();
+      return eventPromise;
+    });
   });
 
   suite('SettingsMenuReset', function() {