diff --git a/devtools/client/responsive.html/actions/index.js b/devtools/client/responsive.html/actions/index.js
index b57f78cea165..39567afb8c90 100644
--- a/devtools/client/responsive.html/actions/index.js
+++ b/devtools/client/responsive.html/actions/index.js
@@ -39,7 +39,10 @@ createEnum([
// The pixel ratio of the viewport has changed. This may be triggered by the user
// when changing the device displayed in the viewport, or when a pixel ratio is
// selected from the DPR dropdown.
- "CHANGE_VIEWPORT_PIXEL_RATIO",
+ "CHANGE_PIXEL_RATIO",
+
+ // Change the touch simulation state.
+ "CHANGE_TOUCH_SIMULATION",
// Indicates that the device list is being loaded
"LOAD_DEVICE_LIST_START",
@@ -68,7 +71,4 @@ createEnum([
// Update the device modal open state.
"UPDATE_DEVICE_MODAL_OPEN",
- // Update the touch simulation enabled state.
- "UPDATE_TOUCH_SIMULATION_ENABLED",
-
], module.exports);
diff --git a/devtools/client/responsive.html/actions/touch-simulation.js b/devtools/client/responsive.html/actions/touch-simulation.js
index dc27f9a94830..8f98101e7a78 100644
--- a/devtools/client/responsive.html/actions/touch-simulation.js
+++ b/devtools/client/responsive.html/actions/touch-simulation.js
@@ -7,14 +7,14 @@
"use strict";
const {
- UPDATE_TOUCH_SIMULATION_ENABLED
+ CHANGE_TOUCH_SIMULATION
} = require("./index");
module.exports = {
- updateTouchSimulationEnabled(enabled = false) {
+ changeTouchSimulation(enabled) {
return {
- type: UPDATE_TOUCH_SIMULATION_ENABLED,
+ type: CHANGE_TOUCH_SIMULATION,
enabled,
};
},
diff --git a/devtools/client/responsive.html/actions/viewports.js b/devtools/client/responsive.html/actions/viewports.js
index c5f5a4623749..f9d83a2d07e0 100644
--- a/devtools/client/responsive.html/actions/viewports.js
+++ b/devtools/client/responsive.html/actions/viewports.js
@@ -7,7 +7,7 @@
const {
ADD_VIEWPORT,
CHANGE_DEVICE,
- CHANGE_VIEWPORT_PIXEL_RATIO,
+ CHANGE_PIXEL_RATIO,
RESIZE_VIEWPORT,
ROTATE_VIEWPORT
} = require("./index");
@@ -37,9 +37,9 @@ module.exports = {
/**
* Change the viewport pixel ratio.
*/
- changeViewportPixelRatio(id, pixelRatio = 0) {
+ changePixelRatio(id, pixelRatio = 0) {
return {
- type: CHANGE_VIEWPORT_PIXEL_RATIO,
+ type: CHANGE_PIXEL_RATIO,
id,
pixelRatio,
};
diff --git a/devtools/client/responsive.html/app.js b/devtools/client/responsive.html/app.js
index 04836220550f..18328560cdef 100644
--- a/devtools/client/responsive.html/app.js
+++ b/devtools/client/responsive.html/app.js
@@ -17,10 +17,10 @@ const {
} = require("./actions/devices");
const { changeNetworkThrottling } = require("./actions/network-throttling");
const { takeScreenshot } = require("./actions/screenshot");
-const { updateTouchSimulationEnabled } = require("./actions/touch-simulation");
+const { changeTouchSimulation } = require("./actions/touch-simulation");
const {
changeDevice,
- changeViewportPixelRatio,
+ changePixelRatio,
resizeViewport,
rotateViewport
} = require("./actions/viewports");
@@ -47,6 +47,16 @@ let App = createClass({
window.postMessage({ type: "browser-mounted" }, "*");
},
+ onChangeDevice(id, device) {
+ window.postMessage({
+ type: "change-device",
+ device,
+ }, "*");
+ this.props.dispatch(changeDevice(id, device.name));
+ this.props.dispatch(changeTouchSimulation(device.touch));
+ this.props.dispatch(changePixelRatio(id, device.pixelRatio));
+ },
+
onChangeNetworkThrottling(enabled, profile) {
window.postMessage({
type: "change-network-throtting",
@@ -56,23 +66,20 @@ let App = createClass({
this.props.dispatch(changeNetworkThrottling(enabled, profile));
},
- onChangeViewportDevice(id, device) {
+ onChangePixelRatio(pixelRatio) {
window.postMessage({
- type: "change-viewport-device",
- device,
- }, "*");
- this.props.dispatch(changeDevice(id, device.name));
- this.props.dispatch(updateTouchSimulationEnabled(device.touch));
- this.props.dispatch(changeViewportPixelRatio(id, device.pixelRatio));
- },
-
- onChangeViewportPixelRatio(pixelRatio) {
- window.postMessage({
- type: "change-viewport-pixel-ratio",
+ type: "change-pixel-ratio",
pixelRatio,
}, "*");
+ this.props.dispatch(changePixelRatio(0, pixelRatio));
+ },
- this.props.dispatch(changeViewportPixelRatio(0, pixelRatio));
+ onChangeTouchSimulation(enabled) {
+ window.postMessage({
+ type: "change-touch-simulation",
+ enabled,
+ }, "*");
+ this.props.dispatch(changeTouchSimulation(enabled));
},
onContentResize({ width, height }) {
@@ -111,15 +118,6 @@ let App = createClass({
this.props.dispatch(updateDeviceModalOpen(isOpen));
},
- onUpdateTouchSimulation(isEnabled) {
- window.postMessage({
- type: "update-touch-simulation",
- enabled: isEnabled,
- }, "*");
-
- this.props.dispatch(updateTouchSimulationEnabled(isEnabled));
- },
-
render() {
let {
devices,
@@ -133,9 +131,10 @@ let App = createClass({
let {
onBrowserMounted,
+ onChangeDevice,
onChangeNetworkThrottling,
- onChangeViewportDevice,
- onChangeViewportPixelRatio,
+ onChangePixelRatio,
+ onChangeTouchSimulation,
onContentResize,
onDeviceListUpdate,
onExit,
@@ -144,7 +143,6 @@ let App = createClass({
onScreenshot,
onUpdateDeviceDisplayed,
onUpdateDeviceModalOpen,
- onUpdateTouchSimulation,
} = this;
let selectedDevice = "";
@@ -168,10 +166,10 @@ let App = createClass({
selectedPixelRatio,
touchSimulation,
onChangeNetworkThrottling,
- onChangeViewportPixelRatio,
+ onChangePixelRatio,
+ onChangeTouchSimulation,
onExit,
onScreenshot,
- onUpdateTouchSimulation,
}),
Viewports({
devices,
@@ -179,7 +177,7 @@ let App = createClass({
screenshot,
viewports,
onBrowserMounted,
- onChangeViewportDevice,
+ onChangeDevice,
onContentResize,
onRotateViewport,
onResizeViewport,
diff --git a/devtools/client/responsive.html/components/device-selector.js b/devtools/client/responsive.html/components/device-selector.js
index a78bf21f69b0..6a59138e7b41 100644
--- a/devtools/client/responsive.html/components/device-selector.js
+++ b/devtools/client/responsive.html/components/device-selector.js
@@ -17,7 +17,7 @@ module.exports = createClass({
propTypes: {
devices: PropTypes.shape(Types.devices).isRequired,
selectedDevice: PropTypes.string.isRequired,
- onChangeViewportDevice: PropTypes.func.isRequired,
+ onChangeDevice: PropTypes.func.isRequired,
onResizeViewport: PropTypes.func.isRequired,
onUpdateDeviceModalOpen: PropTypes.func.isRequired,
},
@@ -27,7 +27,7 @@ module.exports = createClass({
onSelectChange({ target }) {
let {
devices,
- onChangeViewportDevice,
+ onChangeDevice,
onResizeViewport,
onUpdateDeviceModalOpen,
} = this.props;
@@ -40,7 +40,7 @@ module.exports = createClass({
for (let device of devices[type]) {
if (device.name === target.value) {
onResizeViewport(device.width, device.height);
- onChangeViewportDevice(device);
+ onChangeDevice(device);
return;
}
}
diff --git a/devtools/client/responsive.html/components/dpr-selector.js b/devtools/client/responsive.html/components/dpr-selector.js
index 36f434f2c39e..31b8db1c219d 100644
--- a/devtools/client/responsive.html/components/dpr-selector.js
+++ b/devtools/client/responsive.html/components/dpr-selector.js
@@ -37,7 +37,7 @@ module.exports = createClass({
displayPixelRatio: Types.pixelRatio.value.isRequired,
selectedDevice: PropTypes.string.isRequired,
selectedPixelRatio: PropTypes.shape(Types.pixelRatio).isRequired,
- onChangeViewportPixelRatio: PropTypes.func.isRequired,
+ onChangePixelRatio: PropTypes.func.isRequired,
},
mixins: [ addons.PureRenderMixin ],
@@ -55,7 +55,7 @@ module.exports = createClass({
},
onSelectChange({ target }) {
- this.props.onChangeViewportPixelRatio(+target.value);
+ this.props.onChangePixelRatio(+target.value);
},
render() {
diff --git a/devtools/client/responsive.html/components/global-toolbar.js b/devtools/client/responsive.html/components/global-toolbar.js
index 3e7359d69c81..6c31fa338f58 100644
--- a/devtools/client/responsive.html/components/global-toolbar.js
+++ b/devtools/client/responsive.html/components/global-toolbar.js
@@ -24,10 +24,10 @@ module.exports = createClass({
selectedPixelRatio: PropTypes.shape(Types.pixelRatio).isRequired,
touchSimulation: PropTypes.shape(Types.touchSimulation).isRequired,
onChangeNetworkThrottling: PropTypes.func.isRequired,
- onChangeViewportPixelRatio: PropTypes.func.isRequired,
+ onChangePixelRatio: PropTypes.func.isRequired,
+ onChangeTouchSimulation: PropTypes.func.isRequired,
onExit: PropTypes.func.isRequired,
onScreenshot: PropTypes.func.isRequired,
- onUpdateTouchSimulation: PropTypes.func.isRequired,
},
mixins: [ addons.PureRenderMixin ],
@@ -42,10 +42,10 @@ module.exports = createClass({
selectedPixelRatio,
touchSimulation,
onChangeNetworkThrottling,
- onChangeViewportPixelRatio,
+ onChangePixelRatio,
+ onChangeTouchSimulation,
onExit,
onScreenshot,
- onUpdateTouchSimulation
} = this.props;
let touchButtonClass = "toolbar-button devtools-button";
@@ -73,14 +73,14 @@ module.exports = createClass({
displayPixelRatio,
selectedDevice,
selectedPixelRatio,
- onChangeViewportPixelRatio,
+ onChangePixelRatio,
}),
dom.button({
id: "global-touch-simulation-button",
className: touchButtonClass,
title: (touchSimulation.enabled ?
getStr("responsive.disableTouch") : getStr("responsive.enableTouch")),
- onClick: () => onUpdateTouchSimulation(!touchSimulation.enabled),
+ onClick: () => onChangeTouchSimulation(!touchSimulation.enabled),
}),
dom.button({
id: "global-screenshot-button",
diff --git a/devtools/client/responsive.html/components/resizable-viewport.js b/devtools/client/responsive.html/components/resizable-viewport.js
index 54ab31a85ef5..b3290e324535 100644
--- a/devtools/client/responsive.html/components/resizable-viewport.js
+++ b/devtools/client/responsive.html/components/resizable-viewport.js
@@ -28,7 +28,7 @@ module.exports = createClass({
swapAfterMount: PropTypes.bool.isRequired,
viewport: PropTypes.shape(Types.viewport).isRequired,
onBrowserMounted: PropTypes.func.isRequired,
- onChangeViewportDevice: PropTypes.func.isRequired,
+ onChangeDevice: PropTypes.func.isRequired,
onContentResize: PropTypes.func.isRequired,
onResizeViewport: PropTypes.func.isRequired,
onRotateViewport: PropTypes.func.isRequired,
@@ -109,7 +109,7 @@ module.exports = createClass({
// Change the device selector back to an unselected device
// TODO: Bug 1313140: We should avoid calling this for every resize event, since it
// triggers RDP calls each time.
- this.props.onChangeViewportDevice({ name: "" });
+ this.props.onChangeDevice({ name: "" });
this.setState({
lastClientX,
@@ -125,7 +125,7 @@ module.exports = createClass({
swapAfterMount,
viewport,
onBrowserMounted,
- onChangeViewportDevice,
+ onChangeDevice,
onContentResize,
onResizeViewport,
onRotateViewport,
@@ -149,7 +149,7 @@ module.exports = createClass({
ViewportToolbar({
devices,
selectedDevice: viewport.device,
- onChangeViewportDevice,
+ onChangeDevice,
onResizeViewport,
onRotateViewport,
onUpdateDeviceModalOpen,
diff --git a/devtools/client/responsive.html/components/viewport-dimension.js b/devtools/client/responsive.html/components/viewport-dimension.js
index 3b239d848d7d..b9adcb9d0868 100644
--- a/devtools/client/responsive.html/components/viewport-dimension.js
+++ b/devtools/client/responsive.html/components/viewport-dimension.js
@@ -15,7 +15,7 @@ module.exports = createClass({
propTypes: {
viewport: PropTypes.shape(Types.viewport).isRequired,
- onChangeViewportDevice: PropTypes.func.isRequired,
+ onChangeDevice: PropTypes.func.isRequired,
onResizeViewport: PropTypes.func.isRequired,
},
@@ -114,7 +114,7 @@ module.exports = createClass({
}
// Change the device selector back to an unselected device
- this.props.onChangeViewportDevice({ name: "" });
+ this.props.onChangeDevice({ name: "" });
this.props.onResizeViewport(parseInt(this.state.width, 10),
parseInt(this.state.height, 10));
},
diff --git a/devtools/client/responsive.html/components/viewport-toolbar.js b/devtools/client/responsive.html/components/viewport-toolbar.js
index 463406761ae6..cdc7ee268829 100644
--- a/devtools/client/responsive.html/components/viewport-toolbar.js
+++ b/devtools/client/responsive.html/components/viewport-toolbar.js
@@ -17,7 +17,7 @@ module.exports = createClass({
propTypes: {
devices: PropTypes.shape(Types.devices).isRequired,
selectedDevice: PropTypes.string.isRequired,
- onChangeViewportDevice: PropTypes.func.isRequired,
+ onChangeDevice: PropTypes.func.isRequired,
onResizeViewport: PropTypes.func.isRequired,
onRotateViewport: PropTypes.func.isRequired,
onUpdateDeviceModalOpen: PropTypes.func.isRequired,
@@ -29,7 +29,7 @@ module.exports = createClass({
let {
devices,
selectedDevice,
- onChangeViewportDevice,
+ onChangeDevice,
onResizeViewport,
onRotateViewport,
onUpdateDeviceModalOpen,
@@ -42,7 +42,7 @@ module.exports = createClass({
DeviceSelector({
devices,
selectedDevice,
- onChangeViewportDevice,
+ onChangeDevice,
onResizeViewport,
onUpdateDeviceModalOpen,
}),
diff --git a/devtools/client/responsive.html/components/viewport.js b/devtools/client/responsive.html/components/viewport.js
index 9a0c1d541a8d..b61327196c3e 100644
--- a/devtools/client/responsive.html/components/viewport.js
+++ b/devtools/client/responsive.html/components/viewport.js
@@ -22,20 +22,20 @@ module.exports = createClass({
swapAfterMount: PropTypes.bool.isRequired,
viewport: PropTypes.shape(Types.viewport).isRequired,
onBrowserMounted: PropTypes.func.isRequired,
- onChangeViewportDevice: PropTypes.func.isRequired,
+ onChangeDevice: PropTypes.func.isRequired,
onContentResize: PropTypes.func.isRequired,
onResizeViewport: PropTypes.func.isRequired,
onRotateViewport: PropTypes.func.isRequired,
onUpdateDeviceModalOpen: PropTypes.func.isRequired,
},
- onChangeViewportDevice(device) {
+ onChangeDevice(device) {
let {
viewport,
- onChangeViewportDevice,
+ onChangeDevice,
} = this.props;
- onChangeViewportDevice(viewport.id, device);
+ onChangeDevice(viewport.id, device);
},
onResizeViewport(width, height) {
@@ -69,7 +69,7 @@ module.exports = createClass({
} = this.props;
let {
- onChangeViewportDevice,
+ onChangeDevice,
onRotateViewport,
onResizeViewport,
} = this;
@@ -80,7 +80,7 @@ module.exports = createClass({
},
ViewportDimension({
viewport,
- onChangeViewportDevice,
+ onChangeDevice,
onResizeViewport,
}),
ResizableViewport({
@@ -90,7 +90,7 @@ module.exports = createClass({
swapAfterMount,
viewport,
onBrowserMounted,
- onChangeViewportDevice,
+ onChangeDevice,
onContentResize,
onResizeViewport,
onRotateViewport,
diff --git a/devtools/client/responsive.html/components/viewports.js b/devtools/client/responsive.html/components/viewports.js
index 2959c80eae2c..e667ca8fe7a5 100644
--- a/devtools/client/responsive.html/components/viewports.js
+++ b/devtools/client/responsive.html/components/viewports.js
@@ -20,7 +20,7 @@ module.exports = createClass({
screenshot: PropTypes.shape(Types.screenshot).isRequired,
viewports: PropTypes.arrayOf(PropTypes.shape(Types.viewport)).isRequired,
onBrowserMounted: PropTypes.func.isRequired,
- onChangeViewportDevice: PropTypes.func.isRequired,
+ onChangeDevice: PropTypes.func.isRequired,
onContentResize: PropTypes.func.isRequired,
onResizeViewport: PropTypes.func.isRequired,
onRotateViewport: PropTypes.func.isRequired,
@@ -34,7 +34,7 @@ module.exports = createClass({
screenshot,
viewports,
onBrowserMounted,
- onChangeViewportDevice,
+ onChangeDevice,
onContentResize,
onResizeViewport,
onRotateViewport,
@@ -54,7 +54,7 @@ module.exports = createClass({
swapAfterMount: i == 0,
viewport,
onBrowserMounted,
- onChangeViewportDevice,
+ onChangeDevice,
onContentResize,
onResizeViewport,
onRotateViewport,
diff --git a/devtools/client/responsive.html/manager.js b/devtools/client/responsive.html/manager.js
index cceba6a55244..051306d18f76 100644
--- a/devtools/client/responsive.html/manager.js
+++ b/devtools/client/responsive.html/manager.js
@@ -449,14 +449,17 @@ ResponsiveUI.prototype = {
}
switch (event.data.type) {
+ case "change-device":
+ this.onChangeDevice(event);
+ break;
case "change-network-throtting":
this.onChangeNetworkThrottling(event);
break;
- case "change-viewport-device":
- this.onChangeViewportDevice(event);
+ case "change-pixel-ratio":
+ this.onChangePixelRatio(event);
break;
- case "change-viewport-pixel-ratio":
- this.updateDPPX(event.data.pixelRatio);
+ case "change-touch-simulation":
+ this.onChangeTouchSimulation(event);
break;
case "content-resize":
this.onContentResize(event);
@@ -464,12 +467,18 @@ ResponsiveUI.prototype = {
case "exit":
this.onExit();
break;
- case "update-touch-simulation":
- this.onUpdateTouchSimulation(event);
- break;
}
},
+ onChangeDevice: Task.async(function* (event) {
+ let { userAgent, pixelRatio, touch } = event.data.device;
+ yield this.updateUserAgent(userAgent);
+ yield this.updateDPPX(pixelRatio);
+ yield this.updateTouchSimulation(touch);
+ // Used by tests
+ this.emit("device-changed");
+ }),
+
onChangeNetworkThrottling: Task.async(function* (event) {
let { enabled, profile } = event.data;
yield this.updateNetworkThrottling(enabled, profile);
@@ -477,14 +486,15 @@ ResponsiveUI.prototype = {
this.emit("network-throttling-changed");
}),
- onChangeViewportDevice: Task.async(function* (event) {
- let { userAgent, pixelRatio, touch } = event.data.device;
- yield this.updateUserAgent(userAgent);
- yield this.updateDPPX(pixelRatio);
- yield this.updateTouchSimulation(touch);
- // Used by tests
- this.emit("viewport-device-changed");
- }),
+ onChangePixelRatio(event) {
+ let { pixelRatio } = event.data;
+ this.updateDPPX(pixelRatio);
+ },
+
+ onChangeTouchSimulation(event) {
+ let { enabled } = event.data;
+ this.updateTouchSimulation(enabled);
+ },
onContentResize(event) {
let { width, height } = event.data;
@@ -499,11 +509,6 @@ ResponsiveUI.prototype = {
ResponsiveUIManager.closeIfNeeded(browserWindow, tab);
},
- onUpdateTouchSimulation(event) {
- let { enabled } = event.data;
- this.updateTouchSimulation(enabled);
- },
-
updateDPPX: Task.async(function* (dppx) {
if (!dppx) {
yield this.emulationFront.clearDPPXOverride();
diff --git a/devtools/client/responsive.html/reducers/touch-simulation.js b/devtools/client/responsive.html/reducers/touch-simulation.js
index e96b21276eea..b3203b6447b1 100644
--- a/devtools/client/responsive.html/reducers/touch-simulation.js
+++ b/devtools/client/responsive.html/reducers/touch-simulation.js
@@ -5,14 +5,16 @@
"use strict";
const {
- UPDATE_TOUCH_SIMULATION_ENABLED,
+ CHANGE_TOUCH_SIMULATION,
} = require("../actions/index");
-const INITIAL_TOUCH_SIMULATION = { enabled: false };
+const INITIAL_TOUCH_SIMULATION = {
+ enabled: false,
+};
let reducers = {
- [UPDATE_TOUCH_SIMULATION_ENABLED](touchSimulation, { enabled }) {
+ [CHANGE_TOUCH_SIMULATION](touchSimulation, { enabled }) {
return Object.assign({}, touchSimulation, {
enabled,
});
diff --git a/devtools/client/responsive.html/reducers/viewports.js b/devtools/client/responsive.html/reducers/viewports.js
index 9e49ec5b1029..4208794b4ac6 100644
--- a/devtools/client/responsive.html/reducers/viewports.js
+++ b/devtools/client/responsive.html/reducers/viewports.js
@@ -7,7 +7,7 @@
const {
ADD_VIEWPORT,
CHANGE_DEVICE,
- CHANGE_VIEWPORT_PIXEL_RATIO,
+ CHANGE_PIXEL_RATIO,
RESIZE_VIEWPORT,
ROTATE_VIEWPORT,
} = require("../actions/index");
@@ -47,7 +47,7 @@ let reducers = {
});
},
- [CHANGE_VIEWPORT_PIXEL_RATIO](viewports, { id, pixelRatio }) {
+ [CHANGE_PIXEL_RATIO](viewports, { id, pixelRatio }) {
return viewports.map(viewport => {
if (viewport.id !== id) {
return viewport;
diff --git a/devtools/client/responsive.html/test/browser/browser_device_change.js b/devtools/client/responsive.html/test/browser/browser_device_change.js
index 82a1f3acb442..f7f164874881 100644
--- a/devtools/client/responsive.html/test/browser/browser_device_change.js
+++ b/devtools/client/responsive.html/test/browser/browser_device_change.js
@@ -50,7 +50,7 @@ addRDMTask(TEST_URL, function* ({ ui, manager }) {
yield testTouchEventsOverride(ui, true);
// Test resetting device when resizing viewport
- let deviceChanged = once(ui, "viewport-device-changed");
+ let deviceChanged = once(ui, "device-changed");
yield testViewportResize(ui, ".viewport-vertical-resize-handle",
[-10, -10], [testDevice.width, testDevice.height - 10], [0, -10], ui);
yield deviceChanged;
diff --git a/devtools/client/responsive.html/test/browser/head.js b/devtools/client/responsive.html/test/browser/head.js
index 30c3b0a3113c..e4b85d3a8f87 100644
--- a/devtools/client/responsive.html/test/browser/head.js
+++ b/devtools/client/responsive.html/test/browser/head.js
@@ -213,7 +213,7 @@ function* testViewportResize(ui, selector, moveBy,
expectedViewportSize, expectedHandleMove) {
let win = ui.toolWindow;
- let changed = once(ui, "viewport-device-changed");
+ let changed = once(ui, "device-changed");
let resized = waitForViewportResizeTo(ui, ...expectedViewportSize);
let startRect = dragElementBy(selector, ...moveBy, win);
yield resized;
@@ -272,7 +272,7 @@ function changeSelectValue({ toolWindow }, selector, value) {
}
const selectDevice = (ui, value) => Promise.all([
- once(ui, "viewport-device-changed"),
+ once(ui, "device-changed"),
changeSelectValue(ui, ".viewport-device-selector", value)
]);
diff --git a/devtools/client/responsive.html/test/unit/test_change_viewport_device.js b/devtools/client/responsive.html/test/unit/test_change_device.js
similarity index 100%
rename from devtools/client/responsive.html/test/unit/test_change_viewport_device.js
rename to devtools/client/responsive.html/test/unit/test_change_device.js
diff --git a/devtools/client/responsive.html/test/unit/test_change_viewport_pixel_ratio.js b/devtools/client/responsive.html/test/unit/test_change_pixel_ratio.js
similarity index 83%
rename from devtools/client/responsive.html/test/unit/test_change_viewport_pixel_ratio.js
rename to devtools/client/responsive.html/test/unit/test_change_pixel_ratio.js
index 34305c143f4f..b594caef55b2 100644
--- a/devtools/client/responsive.html/test/unit/test_change_viewport_pixel_ratio.js
+++ b/devtools/client/responsive.html/test/unit/test_change_pixel_ratio.js
@@ -5,7 +5,7 @@
// Test changing the viewport pixel ratio.
-const { addViewport, changeViewportPixelRatio } =
+const { addViewport, changePixelRatio } =
require("devtools/client/responsive.html/actions/viewports");
const NEW_PIXEL_RATIO = 5.5;
@@ -14,7 +14,7 @@ add_task(function* () {
const { getState, dispatch } = store;
dispatch(addViewport());
- dispatch(changeViewportPixelRatio(0, NEW_PIXEL_RATIO));
+ dispatch(changePixelRatio(0, NEW_PIXEL_RATIO));
let viewport = getState().viewports[0];
equal(viewport.pixelRatio.value, NEW_PIXEL_RATIO,
diff --git a/devtools/client/responsive.html/test/unit/test_update_touch_simulation_enabled.js b/devtools/client/responsive.html/test/unit/test_update_touch_simulation_enabled.js
index 22a7c37b9ff8..f8ba2a4b6de1 100644
--- a/devtools/client/responsive.html/test/unit/test_update_touch_simulation_enabled.js
+++ b/devtools/client/responsive.html/test/unit/test_update_touch_simulation_enabled.js
@@ -6,7 +6,7 @@
// Test updating the touch simulation `enabled` property
const {
- updateTouchSimulationEnabled,
+ changeTouchSimulation,
} = require("devtools/client/responsive.html/actions/touch-simulation");
add_task(function* () {
@@ -16,7 +16,7 @@ add_task(function* () {
ok(!getState().touchSimulation.enabled,
"Touch simulation is disabled by default.");
- dispatch(updateTouchSimulationEnabled(true));
+ dispatch(changeTouchSimulation(true));
ok(getState().touchSimulation.enabled,
"Touch simulation is enabled.");
diff --git a/devtools/client/responsive.html/test/unit/xpcshell.ini b/devtools/client/responsive.html/test/unit/xpcshell.ini
index 3a864341e8b2..ed745c18c593 100644
--- a/devtools/client/responsive.html/test/unit/xpcshell.ini
+++ b/devtools/client/responsive.html/test/unit/xpcshell.ini
@@ -6,11 +6,11 @@ firefox-appdir = browser
[test_add_device.js]
[test_add_device_type.js]
[test_add_viewport.js]
+[test_change_device.js]
[test_change_display_pixel_ratio.js]
[test_change_location.js]
[test_change_network_throttling.js]
-[test_change_viewport_device.js]
-[test_change_viewport_pixel_ratio.js]
+[test_change_pixel_ratio.js]
[test_resize_viewport.js]
[test_rotate_viewport.js]
[test_update_device_displayed.js]