Bug 1621306 - Enable the devtools.responsive.browserUI.enabled pref in Nightly only r=bradwerth

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

--HG--
extra : moz-landing-system : lando

browser/app/profile/firefox.js

@@ -2244,14 +2244,15 @@ pref("devtools.responsive.touchSimulation.enabled", false);
 pref("devtools.responsive.metaViewport.enabled", true);
 // The user agent of the viewport.
 pref("devtools.responsive.userAgent", "");
-// Whether or not the RDM UI is embedded in the browser.
-pref("devtools.responsive.browserUI.enabled", false);
 
-// Show the custom user agent input in Nightly builds.
+// Show the custom user agent input and browser embedded RDM UI in
+// Nightly builds.
 #if defined(NIGHTLY_BUILD)
   pref("devtools.responsive.showUserAgentInput", true);
+  pref("devtools.responsive.browserUI.enabled", true);
 #else
   pref("devtools.responsive.showUserAgentInput", false);
+  pref("devtools.responsive.browserUI.enabled", false);
 #endif
 
 // Show tab debug targets for This Firefox (on by default for local builds).

devtools/client/responsive/actions/viewports.js

@@ -6,7 +6,6 @@
 
 "use strict";
 
-const Services = require("Services");
 const asyncStorage = require("devtools/shared/async-storage");
 
 const {
@@ -108,21 +107,9 @@ module.exports = {
    * Rotate the viewport.
    */
   rotateViewport(id) {
-    return async function(dispatch, getState) {
-      if (Services.prefs.getBoolPref("devtools.responsive.browserUI.enabled")) {
-        const viewport = getState().viewports[0];
-
-        post(window, {
-          type: "viewport-resize",
-          height: viewport.width,
-          width: viewport.height,
-        });
-      }
-
-      dispatch({
-        type: ROTATE_VIEWPORT,
-        id,
-      });
+    return {
+      type: ROTATE_VIEWPORT,
+      id,
     };
   },
 

devtools/client/responsive/components/App.js

@@ -348,6 +348,17 @@ class App extends PureComponent {
 
     this.onChangeViewportOrientation(id, type, angle, true);
     this.props.dispatch(rotateViewport(id));
+
+    if (Services.prefs.getBoolPref("devtools.responsive.browserUI.enabled")) {
+      window.postMessage(
+        {
+          type: "viewport-resize",
+          height: viewport.width,
+          width: viewport.height,
+        },
+        "*"
+      );
+    }
   }
 
   onScreenshot() {

devtools/client/responsive/test/browser/browser.ini

@@ -72,7 +72,7 @@ skip-if = os == "linux"
 tags = devtools geolocation
 [browser_picker_link.js]
 [browser_preloaded_newtab.js]
-skip-if = fission || (bits == 64 && (os == "linux" && os_version == '18.04'|| os == "mac" && os_version == '10.14')) #Bug 1577963
+skip-if = true # Bug 1620421
 [browser_prompts.js]
 skip-if = true # tests a tunnel mechanism that doesn't exist in fission
 [browser_screenshot_button.js]

devtools/client/styleeditor/StyleEditorUI.jsm

@@ -1095,8 +1095,8 @@ StyleEditorUI.prototype = {
   },
 
   /**
-   * Launches the responsive mode with a specific width or height
-   *
+   * Launches the responsive mode and emits an event with data containing
+   * a specific width and height
    * @param  {object} options
    *         Object with width or/and height properties.
    */
@@ -1107,7 +1107,8 @@ StyleEditorUI.prototype = {
     await ResponsiveUIManager.openIfNeeded(win, tab, {
       trigger: "style_editor",
     });
-    ResponsiveUIManager.getResponsiveUIForTab(tab).setViewportSize(options);
+
+    this.emit("responsive-mode-opened", options);
   },
 
   /**

devtools/client/styleeditor/test/browser_styleeditor_media_sidebar_links.js

@@ -70,11 +70,17 @@ async function testMediaLink(editor, tab, ui, itemIndex, type, value) {
   let conditions = sidebar.querySelectorAll(".media-rule-condition");
 
   const onMediaChange = once(ui, "media-list-changed");
+  const onRDMOpened = once(ui, "responsive-mode-opened");
 
   info("Launching responsive mode");
   conditions[itemIndex].querySelector(responsiveModeToggleClass).click();
 
+  const size = await onRDMOpened;
+
   const rdmUI = ResponsiveUIManager.getResponsiveUIForTab(tab);
+
+  rdmUI.setViewportSize(size);
+
   const onContentResize = waitForResizeTo(rdmUI, type, value);
   rdmUI.transitionsEnabled = false;