WebUI: swap paper-dropdown-menu out for md-select.

chrome/browser/resources/md_extensions/keyboard_shortcuts.js

 // Copyright 2016 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 cr.define('extensions', function() {
   'use strict';
 
   // The UI to display and manage keyboard shortcuts set for extension commands.
   var KeyboardShortcuts = Polymer({
     is: 'extensions-keyboard-shortcuts',
 
-    behaviors: [Polymer.NeonAnimatableBehavior],
+    behaviors: [Polymer.NeonAnimatableBehavior, I18nBehavior],
 
     properties: {
       /** @type {Array<!chrome.developerPrivate.ExtensionInfo>} */
       items: Array,
     },
 
+    /** @private {Array<Object>} */

[dpapad, 2017/06/15 01:35:37]

Can this be !Array<!Object> ?

[scottchen, 2017/06/15 23:50:51]

This property is removed in the newest patch.

+    scopes_: [],
+
     ready: function() {
       /** @type {!extensions.AnimationHelper} */
       this.animationHelper = new extensions.AnimationHelper(this, this.$.main);
       this.animationHelper.setEntryAnimations([extensions.Animation.FADE_IN]);
       this.animationHelper.setExitAnimations([extensions.Animation.SCALE_DOWN]);
       this.sharedElements = {hero: this.$.main};
+
+      // Preparing the options to be used easily by the html template.
+      this.scopes_ = [
+        {
+          value: chrome.developerPrivate.CommandScope.CHROME,
+          label: this.i18n('shortcutScopeInChrome')
+        },
+        {
+          value: chrome.developerPrivate.CommandScope.GLOBAL,
+          label: this.i18n('shortcutScopeGlobal')
+        },
+      ];
     },
 
     /**
      * @return {!Array<!chrome.developerPrivate.ExtensionInfo>}
      * @private
      */
     calculateShownItems_: function() {
       return this.items.filter(function(item) {
         return item.commands.length > 0;
       });
@@ skipping 15 matching lines @@
      * Determines whether to disable the dropdown menu for the command's scope.
      * @param {!chrome.developerPrivate.Command} command
      * @return {boolean}
      * @private
      */
     computeScopeDisabled_: function(command) {
       return command.isExtensionAction || !command.isActive;
     },
 
     /**
-     * Returns the scope index in the dropdown menu for the command's scope.
-     * @param {chrome.developerPrivate.Command} command
-     * @return {number}
+     * Helper to check if an option's scope value equals current command scope.
+     * @param {!string} commandScope the current command's scope value

[dpapad, 2017/06/15 01:35:37]

"!" not necessary with strings.

[scottchen, 2017/06/15 23:50:51]

Acknowledged, though this function is removed in the newest patch.

+     * @param {!string} optionScopeValue scope value of options checked against
+     * @return {boolean}
      * @private
      */
-    computeSelectedScope_: function(command) {
-      // These numbers match the indexes in the dropdown menu in the html.
-      switch (command.scope) {
-        case chrome.developerPrivate.CommandScope.CHROME:
-          return 0;
-        case chrome.developerPrivate.CommandScope.GLOBAL:
-          return 1;
-      }
-      assertNotReached();
+    isScopeEqual_: function(commandScope, optionScopeValue) {
+      return commandScope == optionScopeValue;
     },
 
     /** @private */
     onCloseButtonClick_: function() {
       this.fire('close');
     },
+
+    /** @private */
+    onScopeChanged_: function(e) {
+      e.model.set('command.scope', e.target.value);
+    },
   });
 
   return {KeyboardShortcuts: KeyboardShortcuts};
 });