WebUI Polymer 2 migration: Convert cr-action-menu to a <dialog> wrapper.

Polymer2 does not support HTML element extensions, so all such elements need to be converted to wrappers. Based on https://chromium-review.googlesource.com/c/chromium/src/+/944163. Bug: 818279 Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation Change-Id: Ie4bd5b2ff7d6339fb32982b0fc25103eb10f8965 Reviewed-on: https://chromium-review.googlesource.com/951667 Commit-Queue: calamity <calamity@chromium.org> Reviewed-by: Demetrios Papadopoulos <dpapad@chromium.org> Cr-Commit-Position: refs/heads/master@{#543616}
Denger-Network · Mar 16, 2018 · 42944a0 · 42944a0
1 parent b35d9a7
commit 42944a0
Show file tree

Hide file tree

Showing 35 changed files with 261 additions and 219 deletions.
diff --git a/chrome/browser/resources/md_bookmarks/command_manager.html b/chrome/browser/resources/md_bookmarks/command_manager.html
@@ -29,7 +29,7 @@
       }
     </style>
     <template is="cr-lazy-render" id="dropdown">
-      <dialog is="cr-action-menu" on-mousedown="onMenuMousedown_">
+      <cr-action-menu on-mousedown="onMenuMousedown_">
         <template is="dom-repeat" items="[[menuCommands_]]" as="command">
           <button slot="item" class="dropdown-item"
               command$="[[command]]"
@@ -47,7 +47,7 @@
               aria-hidden="true">
           </hr>
         </template>
-      </dialog>
+      </cr-action-menu>
     </template>
     <template is="cr-lazy-render" id="editDialog">
       <bookmarks-edit-dialog></bookmarks-edit-dialog>

diff --git a/chrome/browser/resources/md_bookmarks/command_manager.js b/chrome/browser/resources/md_bookmarks/command_manager.js
@@ -131,7 +131,7 @@ cr.define('bookmarks', function() {
       // Ensure that the menu is fully rendered before trying to position it.
       Polymer.dom.flush();
       bookmarks.DialogFocusManager.getInstance().showDialog(
-          dropdown, function() {
+          dropdown.getDialog(), function() {
             dropdown.showAtPosition({top: y, left: x});
           });
     },
@@ -151,7 +151,7 @@ cr.define('bookmarks', function() {
       // Ensure that the menu is fully rendered before trying to position it.
       Polymer.dom.flush();
       bookmarks.DialogFocusManager.getInstance().showDialog(
-          dropdown, function() {
+          dropdown.getDialog(), function() {
             dropdown.showAt(target);
           });
     },

diff --git a/chrome/browser/resources/md_downloads/toolbar.html b/chrome/browser/resources/md_downloads/toolbar.html
@@ -48,7 +48,7 @@
         </button>
       </paper-icon-button-light>
     </cr-toolbar>
-    <dialog is="cr-action-menu" id="moreActionsMenu">
+    <cr-action-menu id="moreActionsMenu">
       <button slot="item" class="dropdown-item clear-all"
           on-click="onClearAllTap_">
         $i18n{clearAll}
@@ -57,7 +57,7 @@
           on-click="onOpenDownloadsFolderTap_">
         $i18n{openDownloadsFolder}
       </button>
-    </dialog>
+    </cr-action-menu>
   </template>
   <script src="chrome://downloads/toolbar.js"></script>
 </dom-module>
diff --git a/chrome/browser/resources/md_history/history_list.html b/chrome/browser/resources/md_history/history_list.html
@@ -74,7 +74,7 @@
     </template>
 
     <template is="cr-lazy-render" id="sharedMenu">
-      <dialog is="cr-action-menu">
+      <cr-action-menu>
         <button id="menuMoreButton" slot="item" class="dropdown-item"
             hidden="[[!canSearchMoreFromSite_(
                 searchedTerm, actionMenuModel_.item.domain)]]"
@@ -86,7 +86,7 @@
             on-click="onRemoveFromHistoryTap_">
           $i18n{removeFromHistory}
         </button>
-      </dialog>
+      </cr-action-menu>
     </template>
   </template>
   <script src="chrome://history/history_list.js"></script>

diff --git a/chrome/browser/resources/md_history/synced_device_manager.html b/chrome/browser/resources/md_history/synced_device_manager.html
@@ -88,7 +88,7 @@
     </div>
 
     <template is="cr-lazy-render" id="menu">
-      <dialog is="cr-action-menu">
+      <cr-action-menu>
         <button id="menuOpenButton" slot="item" class="dropdown-item"
             on-click="onOpenAllTap_">
           $i18n{openAll}
@@ -97,7 +97,7 @@
             on-click="onDeleteSessionTap_">
           $i18n{deleteSession}
         </button>
-      </dialog>
+      </cr-action-menu>
     </template>
   </template>
   <script src="chrome://history/synced_device_manager.js"></script>

diff --git a/chrome/browser/resources/settings/bluetooth_page/bluetooth_device_list_item.html b/chrome/browser/resources/settings/bluetooth_page/bluetooth_device_list_item.html
@@ -37,15 +37,15 @@
               title="$i18n{moreActions}" on-keydown="ignoreEnterKey_">
           </button>
         </paper-icon-button-light>
-        <dialog id="dotsMenu" is="cr-action-menu">
+        <cr-action-menu id="dotsMenu">
           <button slot="item" class="dropdown-item"
               on-click="onConnectActionTap_">
             [[getConnectActionText_(device.connected)]]
           </button>
           <button slot="item" class="dropdown-item" on-click="onRemoveTap_">
             $i18n{bluetoothRemove}
           </button>
-        </dialog>
+        </cr-action-menu>
       </div>
     </div>
   </template>

diff --git a/chrome/browser/resources/settings/internet_page/internet_known_networks_page.html b/chrome/browser/resources/settings/internet_page/internet_known_networks_page.html
@@ -84,7 +84,7 @@
       </template>
     </div>
 
-    <dialog id="dotsMenu" is="cr-action-menu">
+    <cr-action-menu id="dotsMenu">
       <button slot="item" class="dropdown-item" hidden="[[!showAddPreferred_]]"
           on-click="onAddPreferredTap_">
         $i18n{knownNetworksMenuAddPreferred}
@@ -97,7 +97,7 @@
           on-click="onForgetTap_">
         $i18n{knownNetworksMenuForget}
       </button>
-    </dialog>
+    </cr-action-menu>
 
   </template>
   <script src="internet_known_networks_page.js"></script>

diff --git a/chrome/browser/resources/settings/languages_page/languages_page.html b/chrome/browser/resources/settings/languages_page/languages_page.html
@@ -45,15 +45,15 @@
         margin-top: 4px;
       }
 
-      dialog[is='cr-action-menu'].complex .dropdown-item {
+      cr-action-menu.complex .dropdown-item {
         min-height: 36px;
       }
 
-      dialog[is='cr-action-menu']:not(.complex) hr {
+      cr-action-menu:not(.complex) hr {
         display: none;
       }
 
-      dialog[is='cr-action-menu'].complex hr {
+      cr-action-menu.complex hr {
         /* Override user-agent border and margin. */
         border: none;
         /* TODO(michaelpg): Update to whatever variable is used for the darker,
@@ -266,7 +266,7 @@
         </iron-collapse>
 </if>
         <template is="cr-lazy-render" id="menu">
-          <dialog is="cr-action-menu"
+          <cr-action-menu
               class$="[[getMenuClass_(prefs.translate.enabled.value)]]">
 <if expr="chromeos or is_win">
             <paper-checkbox id="uiLanguageItem" slot="item"
@@ -312,7 +312,7 @@
                 hidden="[[!detailLanguage_.removable]]">
               $i18n{removeLanguage}
             </button>
-          </dialog>
+          </cr-action-menu>
         </template>
       </neon-animatable>
 <if expr="chromeos">

diff --git a/chrome/browser/resources/settings/on_startup_page/startup_url_entry.html b/chrome/browser/resources/settings/on_startup_page/startup_url_entry.html
@@ -31,15 +31,15 @@
           </button>
         </paper-icon-button-light>
         <template is="cr-lazy-render" id="menu">
-          <dialog is="cr-action-menu">
+          <cr-action-menu>
             <button slot="item" class="dropdown-item" on-click="onEditTap_">
               $i18n{edit}
             </button>
             <button slot="item" class="dropdown-item" id="remove"
                 on-click="onRemoveTap_">
               $i18n{onStartupRemove}
             </button>
-          </dialog>
+          </cr-action-menu>
         </template>
       </template>
     </div>

diff --git a/chrome/browser/resources/settings/on_startup_page/startup_url_entry.js b/chrome/browser/resources/settings/on_startup_page/startup_url_entry.js
@@ -43,7 +43,7 @@ Polymer({
 
   /** @private */
   onRemoveTap_: function() {
-    this.$$('dialog[is=cr-action-menu]').close();
+    this.$$('cr-action-menu').close();
     settings.StartupUrlsPageBrowserProxyImpl.getInstance().removeStartupPage(
         this.model.modelIndex);
   },
@@ -54,7 +54,7 @@ Polymer({
    */
   onEditTap_: function(e) {
     e.preventDefault();
-    this.$$('dialog[is=cr-action-menu]').close();
+    this.$$('cr-action-menu').close();
     this.fire(settings.EDIT_STARTUP_URL_EVENT, {
       model: this.model,
       anchor: this.$$('#dots'),

diff --git a/chrome/browser/resources/settings/passwords_and_forms_page/autofill_section.html b/chrome/browser/resources/settings/passwords_and_forms_page/autofill_section.html
@@ -126,12 +126,12 @@ <h2 class="start">$i18n{addresses}</h2>
         $i18n{noAddressesFound}
       </div>
     </div>
-    <dialog is="cr-action-menu" id="addressSharedMenu">
+    <cr-action-menu id="addressSharedMenu">
       <button id="menuEditAddress" slot="item" class="dropdown-item"
           on-click="onMenuEditAddressTap_">$i18n{edit}</button>
       <button id="menuRemoveAddress" slot="item" class="dropdown-item"
           on-click="onMenuRemoveAddressTap_">$i18n{removeAddress}</button>
-    </dialog>
+    </cr-action-menu>
     <template is="dom-if" if="[[showAddressDialog_]]" restamp>
       <settings-address-edit-dialog address="[[activeAddress]]"
           on-close="onAddressDialogClosed_">
@@ -202,7 +202,7 @@ <h2 class="start">$i18n{creditCards}</h2>
         $i18n{noCreditCardsPolicy}
       </div>
     </div>
-    <dialog is="cr-action-menu" id="creditCardSharedMenu">
+    <cr-action-menu id="creditCardSharedMenu">
       <button id="menuEditCreditCard" slot="item" class="dropdown-item"
           on-click="onMenuEditCreditCardTap_">$i18n{edit}</button>
       <button id="menuRemoveCreditCard" slot="item" class="dropdown-item"
@@ -213,7 +213,7 @@ <h2 class="start">$i18n{creditCards}</h2>
           hidden$="[[!activeCreditCard.metadata.isCached]]">
         $i18n{clearCreditCard}
       </button>
-    </dialog>
+    </cr-action-menu>
     <template is="dom-if" if="[[showCreditCardDialog_]]" restamp>
       <settings-credit-card-edit-dialog credit-card="[[activeCreditCard]]"
           on-close="onCreditCardDialogClosed_">

diff --git a/chrome/browser/resources/settings/passwords_and_forms_page/passwords_section.html b/chrome/browser/resources/settings/passwords_and_forms_page/passwords_section.html
@@ -128,13 +128,13 @@ <h2 class="start">$i18n{savedPasswordsHeading}</h2>
         $i18n{noPasswordsFound}
       </div>
     </div>
-    <dialog is="cr-action-menu" id="menu">
+    <cr-action-menu id="menu">
       <button id="menuEditPassword" slot="item" class="dropdown-item"
           on-click="onMenuEditPasswordTap_">$i18n{passwordViewDetails}</button>
       <button id="menuRemovePassword" slot="item" class="dropdown-item"
           on-click="onMenuRemovePasswordTap_">$i18n{removePassword}</button>
-    </dialog>
-    <dialog is="cr-action-menu" id="exportImportMenu">
+    </cr-action-menu>
+    <cr-action-menu id="exportImportMenu">
       <button id="menuImportPassword" slot="item" class="dropdown-item"
           on-click="onImportTap_" hidden="[[!showImportPasswords_]]">
         $i18n{import}
@@ -143,7 +143,7 @@ <h2 class="start">$i18n{savedPasswordsHeading}</h2>
           on-click="onExportTap_" hidden="[[!showExportPasswords_]]">
         $i18n{exportMenuItem}
       </button>
-    </dialog>
+    </cr-action-menu>
     <template is="dom-if" if="[[showPasswordsExportDialog_]]" restamp>
       <passwords-export-dialog on-close="onPasswordsExportDialogClosed_">
       </passwords-export-dialog>

diff --git a/chrome/browser/resources/settings/people_page/sync_account_control.html b/chrome/browser/resources/settings/people_page/sync_account_control.html
@@ -186,7 +186,7 @@
         </paper-button>
       </div>
       <template is="dom-if" if="[[!syncStatus.signedIn]]" restamp>
-        <dialog is="cr-action-menu" id="menu" auto-reposition>
+        <cr-action-menu id="menu" auto-reposition>
           <template is="dom-repeat" items="[[storedAccounts_]]">
             <button class="dropdown-item" on-click="onAccountTap_" slot="item">
               <img class="account-icon small" alt=""
@@ -200,7 +200,7 @@
                 src="chrome://theme/IDR_PROFILE_AVATAR_PLACEHOLDER_LARGE">
             <span>$i18n{useAnotherAccount}</span>
           </button>
-        </dialog>
+        </cr-action-menu>
       </template>
     </template>
   </template>

diff --git a/chrome/browser/resources/settings/printing_page/cups_printers_list.html b/chrome/browser/resources/settings/printing_page/cups_printers_list.html
@@ -14,14 +14,14 @@
       }
     </style>
 
-    <dialog is="cr-action-menu">
+    <cr-action-menu>
       <button slot="item" class="dropdown-item" on-click="onEditTap_">
         $i18n{editPrinter}
       </button>
       <button slot="item" class="dropdown-item" on-click="onRemoveTap_">
         $i18n{removePrinter}
       </button>
-    </dialog>
+    </cr-action-menu>
     <div class="list-frame vertical-list">
       <template is="dom-repeat" items="[[printers]]"
           filter="[[filterPrinter_(searchTerm)]]">

diff --git a/chrome/browser/resources/settings/printing_page/cups_printers_list.js b/chrome/browser/resources/settings/printing_page/cups_printers_list.js
@@ -44,8 +44,8 @@ Polymer({
    */
   onOpenActionMenuTap_: function(e) {
     this.activePrinter = e.model.item;
-    const menu = /** @type {!CrActionMenuElement} */ (
-        this.$$('dialog[is=cr-action-menu]'));
+    const menu =
+        /** @type {!CrActionMenuElement} */ (this.$$('cr-action-menu'));
     menu.showAt(/** @type {!Element} */ (
         Polymer.dom(/** @type {!Event} */ (e)).localTarget));
   },
@@ -75,8 +75,8 @@ Polymer({
 
   /** @private */
   closeDropdownMenu_: function() {
-    const menu = /** @type {!CrActionMenuElement} */ (
-        this.$$('dialog[is=cr-action-menu]'));
+    const menu =
+        /** @type {!CrActionMenuElement} */ (this.$$('cr-action-menu'));
     menu.close();
   },
 

diff --git a/chrome/browser/resources/settings/search_engines_page/omnibox_extension_entry.html b/chrome/browser/resources/settings/search_engines_page/omnibox_extension_entry.html
@@ -39,7 +39,7 @@
             focus-row-control focus-type="menu">
         </button>
       </paper-icon-button-light>
-      <dialog is="cr-action-menu">
+      <cr-action-menu>
         <button slot="item" class="dropdown-item" on-click="onManageTap_"
             id="manage">
           $i18n{searchEnginesManageExtension}
@@ -48,7 +48,7 @@
             id="disable">
           $i18n{disable}
         </button>
-      </dialog>
+      </cr-action-menu>
     </div>
   </template>
   <script src="omnibox_extension_entry.js"></script>

diff --git a/chrome/browser/resources/settings/search_engines_page/omnibox_extension_entry.js b/chrome/browser/resources/settings/search_engines_page/omnibox_extension_entry.js
@@ -39,7 +39,7 @@ Polymer({
 
   /** @private */
   closePopupMenu_: function() {
-    this.$$('dialog[is=cr-action-menu]').close();
+    this.$$('cr-action-menu').close();
   },
 
   /**
@@ -53,7 +53,7 @@ Polymer({
 
   /** @private */
   onDotsTap_: function() {
-    /** @type {!CrActionMenuElement} */ (this.$$('dialog[is=cr-action-menu]'))
+    /** @type {!CrActionMenuElement} */ (this.$$('cr-action-menu'))
         .showAt(assert(this.$$('paper-icon-button-light button')));
   },
 });
diff --git a/chrome/browser/resources/settings/search_engines_page/search_engine_entry.html b/chrome/browser/resources/settings/search_engines_page/search_engine_entry.html
@@ -58,7 +58,7 @@
             focus-row-control focus-type="cr-menu-button">
         </button>
       </paper-icon-button-light>
-      <dialog is="cr-action-menu">
+      <cr-action-menu>
         <button slot="item" class="dropdown-item" on-click="onMakeDefaultTap_"
             hidden$="[[!engine.canBeDefault]]" id="makeDefault">
           $i18n{searchEnginesMakeDefault}
@@ -71,7 +71,7 @@
             hidden$="[[!engine.canBeRemoved]]" id="delete">
           $i18n{searchEnginesRemoveFromList}
         </button>
-      </dialog>
+      </cr-action-menu>
     </div>
     <template is="dom-if" if="[[engine.extension]]">
       <extension-controlled-indicator

diff --git a/chrome/browser/resources/settings/search_engines_page/search_engine_entry.js b/chrome/browser/resources/settings/search_engines_page/search_engine_entry.js
@@ -45,7 +45,7 @@ Polymer({
 
   /** @private */
   closePopupMenu_: function() {
-    this.$$('dialog[is=cr-action-menu]').close();
+    this.$$('cr-action-menu').close();
   },
 
   /**
@@ -85,7 +85,7 @@ Polymer({
 
   /** @private */
   onDotsTap_: function() {
-    /** @type {!CrActionMenuElement} */ (this.$$('dialog[is=cr-action-menu]'))
+    /** @type {!CrActionMenuElement} */ (this.$$('cr-action-menu'))
         .showAt(assert(this.$$('paper-icon-button-light button')));
   },