Bug 1634051 - don't eagerly initialize the all tabs menu, r=mstriemer

The initialization costs of the TabList constructors is very small compared to
the cost of actually calling _populate, so instead of calling init() from an
idle task, we can just wait until the view actually needs to be shown.

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

browser/base/content/browser-allTabsMenu.inc.xhtml

@@ -2,15 +2,7 @@
    - License, v. 2.0. If a copy of the MPL was not distributed with this
    - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
 
-<panel id="allTabsMenu"
-       class="cui-widget-panel"
-       role="group"
-       type="arrow"
-       hidden="true"
-       flip="slide"
-       position="bottomcenter topright"
-       noautofocus="true">
-  <panelmultiview mainViewId="allTabsMenu-allTabsView" disablekeynav="true">
+<html:template id="allTabsMenu-container">
   <panelview id="allTabsMenu-allTabsView" class="PanelUI-subView">
     <vbox class="panel-subview-body">
       <toolbarbutton id="allTabsMenu-undoCloseTab"
@@ -50,5 +42,4 @@
                      command="Browser:OpenAboutContainers"/>
     </vbox>
   </panelview>
-  </panelmultiview>
-</panel>
+</html:template>

browser/base/content/browser-allTabsMenu.js

@@ -27,6 +27,8 @@ var gTabsPanel = {
     if (this._initializedElements) {
       return;
     }
+    let template = document.getElementById("allTabsMenu-container");
+    template.replaceWith(template.content);
 
     for (let [name, id] of Object.entries(this.kElements)) {
       this[name] = document.getElementById(id);
@@ -147,8 +149,9 @@ var gTabsPanel = {
   },
 
   hideAllTabsPanel() {
-    this.init();
+    if (this.allTabsView) {
       PanelMultiView.hidePopup(this.allTabsView.closest("panel"));
+    }
   },
 
   showHiddenTabsPanel(event) {

browser/base/content/browser.js

@@ -2269,11 +2269,6 @@ var gBrowserInit = {
       gSync.init();
     });
 
-    scheduleIdleTask(() => {
-      // Initialize the all tabs menu
-      gTabsPanel.init();
-    });
-
     scheduleIdleTask(() => {
       // Read prefers-reduced-motion setting
       let reduceMotionQuery = window.matchMedia(

browser/components/originattributes/test/browser/browser_favicon_firstParty.js

@@ -320,6 +320,8 @@ async function doTestForAllTabsFavicon(
 
   assertIconIsData(tabInfo.tab);
 
+  gTabsPanel.init();
+
   // Make the popup of allTabs showing up and trigger the loading of the favicon.
   let allTabsView = document.getElementById("allTabsMenu-allTabsView");
   let allTabsPopupShownPromise = BrowserTestUtils.waitForEvent(

browser/components/originattributes/test/browser/browser_favicon_userContextId.js

@@ -266,6 +266,8 @@ async function doTestForAllTabsFavicon(aTestPage, aFaviconHost, aFaviconURL) {
   // be made for the favicon of allTabs menuitem.
   clearAllImageCaches();
 
+  gTabsPanel.init();
+
   // Make the popup of allTabs showing up and trigger the loading of the favicon.
   let allTabsView = document.getElementById("allTabsMenu-allTabsView");
   let allTabsPopupShownPromise = BrowserTestUtils.waitForEvent(