diff --git a/browser/app/profile/firefox.js b/browser/app/profile/firefox.js index 8d100ff4d3ac..1ef5521a09db 100644 --- a/browser/app/profile/firefox.js +++ b/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). diff --git a/devtools/client/responsive/actions/viewports.js b/devtools/client/responsive/actions/viewports.js index 837d3192d5a9..ed58d3dbd4e6 100644 --- a/devtools/client/responsive/actions/viewports.js +++ b/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, }; }, diff --git a/devtools/client/responsive/components/App.js b/devtools/client/responsive/components/App.js index 3149feea3968..eb6a024dd3f5 100644 --- a/devtools/client/responsive/components/App.js +++ b/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() { diff --git a/devtools/client/responsive/test/browser/browser.ini b/devtools/client/responsive/test/browser/browser.ini index 930b9a8c7cba..3f9160569f56 100644 --- a/devtools/client/responsive/test/browser/browser.ini +++ b/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] diff --git a/devtools/client/styleeditor/StyleEditorUI.jsm b/devtools/client/styleeditor/StyleEditorUI.jsm index 8d86400725fd..8fc9c668ce4f 100644 --- a/devtools/client/styleeditor/StyleEditorUI.jsm +++ b/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); }, /** diff --git a/devtools/client/styleeditor/test/browser_styleeditor_media_sidebar_links.js b/devtools/client/styleeditor/test/browser_styleeditor_media_sidebar_links.js index a09786c121a4..d53aaff017a0 100644 --- a/devtools/client/styleeditor/test/browser_styleeditor_media_sidebar_links.js +++ b/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;