Bug 1774377 - Add Firefox View menu item to the Tools menu. r=Gijs,fluent-reviewers

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

browser/base/content/browser-menubar.inc

@@ -392,6 +392,11 @@
                         class="sync-ui-item"
                         hidden="true"
                         oncommand="gSync.openSignInAgainPage('menubar');" data-l10n-id="menu-tools-fxa-re-auth"/>
+
+#ifdef NIGHTLY_BUILD
+              <menuitem id="menu_openFirefoxView"
+                        oncommand="FirefoxViewHandler.openTab();" data-l10n-id="menu-tools-firefox-view"/>
+#endif
               <menuseparator id="devToolsSeparator"/>
               <menu id="browserToolsMenu" data-l10n-id="menu-tools-browser-tools">
                 <menupopup id="menuWebDeveloperPopup">

browser/base/content/browser.js

@@ -565,7 +565,6 @@ var gMultiProcessBrowser = window.docShell.QueryInterface(Ci.nsILoadContext)
   .useRemoteTabs;
 var gFissionBrowser = window.docShell.QueryInterface(Ci.nsILoadContext)
   .useRemoteSubframes;
-var gFirefoxViewTab;
 
 var gBrowserAllowScriptsToCloseInitialTabs = false;
 
@@ -1997,6 +1996,8 @@ var gBrowserInit = {
     ctrlTab.readPref();
     Services.prefs.addObserver(ctrlTab.prefName, ctrlTab);
 
+    FirefoxViewHandler.init();
+
     // The object handling the downloads indicator is initialized here in the
     // delayed startup function, but the actual indicator element is not loaded
     // unless there are downloads to be displayed.
@@ -10028,3 +10029,34 @@ var ConfirmationHint = {
     }
   },
 };
+
+var FirefoxViewHandler = {
+  tab: null,
+  init() {
+    if (!Services.prefs.getBoolPref("browser.tabs.firefox-view")) {
+      document.getElementById("menu_openFirefoxView").hidden = true;
+    }
+  },
+  openTab() {
+    if (!this.tab) {
+      this.tab = gBrowser.addTrustedTab("about:firefoxview", { index: 0 });
+      this.tab.addEventListener("TabClose", this, { once: true });
+      gBrowser.tabContainer.addEventListener("TabSelect", this);
+      gBrowser.hideTab(this.tab);
+    }
+    gBrowser.selectedTab = this.tab;
+  },
+  handleEvent(e) {
+    switch (e.type) {
+      case "TabSelect":
+        document
+          .getElementById("firefox-view-button")
+          ?.toggleAttribute("open", e.target == this.tab);
+        break;
+      case "TabClose":
+        this.tab = null;
+        gBrowser.tabContainer.removeEventListener("TabSelect", this);
+        break;
+    }
+  },
+};

browser/base/content/macWindow.inc.xhtml

@@ -16,6 +16,9 @@
   <html:link rel="localization" href="browser/browserSets.ftl"/>
   <html:link rel="localization" href="browser/menubar.ftl"/>
   <html:link rel="localization" href="browser/screenshots.ftl"/>
+#ifdef NIGHTLY_BUILD
+  <html:link rel="localization" href="preview/firefoxView.ftl"/>
+#endif
 </linkset>
 
 # All JS files which are needed by browser.xhtml and other top level windows to

browser/base/content/nonbrowser-mac.js

@@ -46,6 +46,7 @@ function nonBrowserWindowStartup() {
     "Browser:BookmarkAllTabs",
     "View:PageInfo",
     "History:UndoCloseTab",
+    "menu_openFirefoxView",
   ];
   var element;
 
@@ -127,6 +128,10 @@ function nonBrowserWindowDelayedStartup() {
 
   // initialize the private browsing UI
   gPrivateBrowsingUI.init();
+
+  if (!Services.prefs.getBoolPref("browser.tabs.firefox-view")) {
+    document.getElementById("menu_openFirefoxView").hidden = true;
+  }
 }
 
 function nonBrowserWindowShutdown() {

browser/base/content/tabbrowser.js

@@ -1108,7 +1108,7 @@
 
       this._selectedBrowser = newBrowser;
       this._selectedTab = newTab;
-      if (newTab != gFirefoxViewTab) {
+      if (newTab != FirefoxViewHandler.tab) {
         this.showTab(newTab);
       }
 

browser/base/content/utilityOverlay.js

@@ -525,7 +525,7 @@ function openLinkIn(url, where, params) {
     // page. If a load request bounces off for the currently selected tab,
     // we'll open a new tab instead.
     let tab = w.gBrowser.getTabForBrowser(targetBrowser);
-    if (tab == w.gFirefoxViewTab) {
+    if (tab == w.FirefoxViewHandler.tab) {
       where = "tab";
       targetBrowser = null;
     } else if (

browser/components/customizableui/CustomizableWidgets.jsm

@@ -467,43 +467,7 @@ const CustomizableWidgets = [
       return Services.prefs.getBoolPref("browser.tabs.firefox-view");
     },
     onCommand(e) {
-      let button = e.target;
-      if (button.hasAttribute("open")) {
-        return;
-      }
-      let window = button.ownerGlobal;
-      let tabbrowser = window.gBrowser;
-      let tab = window.gFirefoxViewTab;
-      if (!tab) {
-        tab = tabbrowser.addTrustedTab("about:firefoxview", { index: 0 });
-        tabbrowser.hideTab(tab);
-        window.gFirefoxViewTab = tab;
-
-        let onTabSelect = event => {
-          button.toggleAttribute("open", event.target == tab);
-        };
-
-        let onTabClose = () => {
-          window.gFirefoxViewTab = null;
-          tabbrowser.tabContainer.removeEventListener("TabSelect", onTabSelect);
-        };
-
-        tabbrowser.tabContainer.addEventListener("TabSelect", onTabSelect);
-        tab.addEventListener("TabClose", onTabClose, { once: true });
-
-        window.addEventListener(
-          "unload",
-          () => {
-            tabbrowser.tabContainer.removeEventListener(
-              "TabSelect",
-              onTabSelect
-            );
-            tab.removeEventListener("TabClose", onTabClose);
-          },
-          { once: true }
-        );
-      }
-      tabbrowser.selectedTab = tab;
+      e.view.FirefoxViewHandler.openTab();
     },
   },
 ];

browser/components/firefoxview/firefoxView.ftl

@@ -8,6 +8,10 @@ toolbar-button-firefox-view =
   .label = { -firefoxview-brand-name }
   .tooltiptext = { -firefoxview-brand-name }
 
+menu-tools-firefox-view =
+  .label = { -firefoxview-brand-name }
+  .accesskey = F
+
 firefoxview-page-title = { -firefoxview-brand-name }
 
 # Used instead of the localized relative time when a timestamp is within a minute or so of now

browser/components/firefoxview/tests/browser/browser_firefoxview_tab.js

@@ -18,15 +18,15 @@ add_setup(async function() {
 });
 
 function assertFirefoxViewTab(w = window) {
-  ok(w.gFirefoxViewTab, "Firefox View tab exists");
-  ok(w.gFirefoxViewTab?.hidden, "Firefox View tab is hidden");
+  ok(w.FirefoxViewHandler.tab, "Firefox View tab exists");
+  ok(w.FirefoxViewHandler.tab?.hidden, "Firefox View tab is hidden");
   is(
-    w.gBrowser.tabs.indexOf(w.gFirefoxViewTab),
+    w.gBrowser.tabs.indexOf(w.FirefoxViewHandler.tab),
     0,
     "Firefox View tab is the first tab"
   );
   is(
-    w.gBrowser.visibleTabs.indexOf(w.gFirefoxViewTab),
+    w.gBrowser.visibleTabs.indexOf(w.FirefoxViewHandler.tab),
     -1,
     "Firefox View tab is not in the list of visible tabs"
   );
@@ -34,7 +34,7 @@ function assertFirefoxViewTab(w = window) {
 
 async function openFirefoxViewTab(w = window) {
   ok(
-    !w.gFirefoxViewTab,
+    !w.FirefoxViewHandler.tab,
     "Firefox View tab doesn't exist prior to clicking the button"
   );
   info("Clicking the Firefox View button");
@@ -45,14 +45,14 @@ async function openFirefoxViewTab(w = window) {
   );
   assertFirefoxViewTab(w);
   is(w.gBrowser.tabContainer.selectedIndex, 0, "Firefox View tab is selected");
-  await BrowserTestUtils.browserLoaded(w.gFirefoxViewTab.linkedBrowser);
-  return w.gFirefoxViewTab;
+  await BrowserTestUtils.browserLoaded(w.FirefoxViewHandler.tab.linkedBrowser);
+  return w.FirefoxViewHandler.tab;
 }
 
 function closeFirefoxViewTab(w = window) {
-  w.gBrowser.removeTab(w.gFirefoxViewTab);
+  w.gBrowser.removeTab(w.FirefoxViewHandler.tab);
   ok(
-    !w.gFirefoxViewTab,
+    !w.FirefoxViewHandler.tab,
     "Reference to Firefox View tab got removed when closing the tab"
   );
 }
@@ -98,7 +98,7 @@ add_task(async function accel_w_behavior() {
   let win = await BrowserTestUtils.openNewBrowserWindow();
   await openFirefoxViewTab(win);
   EventUtils.synthesizeKey("w", { accelKey: true }, win);
-  ok(!win.gFirefoxViewTab, "Accel+w closed the Firefox View tab");
+  ok(!win.FirefoxViewHandler.tab, "Accel+w closed the Firefox View tab");
   await openFirefoxViewTab(win);
   win.gBrowser.selectedTab = win.gBrowser.visibleTabs[0];
   info(

browser/components/sessionstore/SessionStore.jsm

@@ -2547,7 +2547,7 @@ var SessionStoreInternal = {
     if (!isPrivateWindow && tabState.isPrivate) {
       return;
     }
-    if (aTab == aWindow.gFirefoxViewTab) {
+    if (aTab == aWindow.FirefoxViewHandler.tab) {
       return;
     }
 
@@ -4130,7 +4130,7 @@ var SessionStoreInternal = {
 
     // update the internal state data for this window
     for (let tab of tabs) {
-      if (tab == aWindow.gFirefoxViewTab) {
+      if (tab == aWindow.FirefoxViewHandler.tab) {
         continue;
       }
       let tabData = lazy.TabState.collect(tab, TAB_CUSTOM_VALUES.get(tab));

browser/themes/shared/tabs.css

@@ -681,7 +681,7 @@
   }
 }
 
-/* Firefox View button */
+/* Firefox View button and menu item */
 
 :root:not([privatebrowsingmode=temporary]) :is(#firefox-view-button, #wrapper-firefox-view-button) + #tabbrowser-tabs {
   border-inline-start: 1px solid color-mix(in srgb, currentColor 25%, transparent);
@@ -689,7 +689,7 @@
   margin-inline-start: 4px;
 }
 
-:root[privatebrowsingmode=temporary] #firefox-view-button {
+:root[privatebrowsingmode=temporary] :is(#firefox-view-button, #menu_openFirefoxView) {
   display: none;
 }