MD Bookmarks: Lazily render dropdown menus

chrome/browser/resources/md_bookmarks/toolbar.html

 <link rel="import" href="chrome://resources/html/polymer.html">
 
 <link rel="import" href="chrome://resources/cr_elements/cr_action_menu/cr_action_menu.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_lazy_render/cr_lazy_render.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_toolbar/cr_toolbar.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_toolbar/cr_toolbar_selection_overlay.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button-light.html">
 <link rel="import" href="chrome://bookmarks/edit_dialog.html">
 <link rel="import" href="chrome://bookmarks/shared_style.html">
 <link rel="stylesheet" href="chrome://resources/css/md_colors.css">
@@ skipping 28 matching lines @@
         --cr-toolbar-field-margin:
             calc(var(--sidebar-width) + var(--splitter-width));
       }
 
       :host(:not([narrow_])) cr-toolbar-selection-overlay {
         --selection-overlay-padding: var(--card-padding-side);
         --cr-toolbar-field-margin: var(--sidebar-width);
         --selection-overlay-max-width: var(--card-max-width);
       }
     </style>
-    <dialog is="cr-action-menu" id="dropdown">
-      <button class="dropdown-item" on-tap="onSortTap_"
-          disabled="[[!canChangeList_]]">
-        $i18n{menuSort}
-      </button>
-      <hr>
-      <button id="addBookmarkButton" class="dropdown-item"
-          on-tap="onAddBookmarkTap_" disabled="[[!canChangeList_]]">
-        $i18n{menuAddBookmark}
-      </button>
-      <button class="dropdown-item" on-tap="onAddFolderTap_"
-          disabled="[[!canChangeList_]]">
-        $i18n{menuAddFolder}
-      </button>
-      <hr>
-      <button id="importBookmarkButton" class="dropdown-item"
-          on-tap="onImportTap_" disabled="[[!globalCanEdit_]]">
-        $i18n{menuImport}
-      </button>
-      <button class="dropdown-item" on-tap="onExportTap_">
-        $i18n{menuExport}
-      </button>
-    </dialog>
     <cr-toolbar page-name="$i18n{title}"
         clear-label="$i18n{clearSearch}"
         search-prompt="$i18n{searchPrompt}"
         hidden$="[[showSelectionOverlay]]"
         narrow="{{narrow_}}"
         on-search-changed="onSearchChanged_">
-      <button is="paper-icon-button-light" class="more-actions more-vert-button"
+      <button is="paper-icon-button-light"
+          id="menuButton"
+          class="more-actions more-vert-button"
           on-tap="onMenuButtonOpenTap_">
         <div></div>
         <div></div>
         <div></div>
       </button>
     </cr-toolbar>
+    <template is="cr-lazy-render" id="dropdown">
+      <dialog is="cr-action-menu">
+        <button class="dropdown-item" on-tap="onSortTap_"
+            disabled="[[!canChangeList_]]">
+          $i18n{menuSort}
+        </button>
+        <hr>
+        <button id="addBookmarkButton" class="dropdown-item"
+            on-tap="onAddBookmarkTap_" disabled="[[!canChangeList_]]">
+          $i18n{menuAddBookmark}
+        </button>
+        <button class="dropdown-item" on-tap="onAddFolderTap_"
+            disabled="[[!canChangeList_]]">
+          $i18n{menuAddFolder}
+        </button>
+        <hr>
+        <button id="importBookmarkButton" class="dropdown-item"
+            on-tap="onImportTap_" disabled="[[!globalCanEdit_]]">
+          $i18n{menuImport}
+        </button>
+        <button class="dropdown-item" on-tap="onExportTap_">
+          $i18n{menuExport}
+        </button>
+      </dialog>
+    </template>
     <template is="cr-lazy-render" id="addDialog">
       <bookmarks-edit-dialog></bookmarks-edit-dialog>
     </template>
     <template is="dom-if" if="[[showSelectionOverlay]]">
       <cr-toolbar-selection-overlay delete-label="$i18n{delete}"
           cancel-label="$i18n{cancel}"
           selection-label="[[getItemsSelectedString_(selectedItems_.size)]]"
           delete-disabled="[[!canDeleteSelection_(selectedItems_)]]"
           on-delete-selected-items="onDeleteSelectionTap_"
           on-clear-selected-items="onClearSelectionTap_">
       </cr-toolbar-selection-overlay>
     </template>
   </template>
   <script src="chrome://bookmarks/toolbar.js"></script>
 </dom-module>