diff options
Diffstat (limited to 'devtools/client/responsive/test/browser/browser_device_change.js')
-rw-r--r-- | devtools/client/responsive/test/browser/browser_device_change.js | 129 |
1 files changed, 129 insertions, 0 deletions
diff --git a/devtools/client/responsive/test/browser/browser_device_change.js b/devtools/client/responsive/test/browser/browser_device_change.js new file mode 100644 index 0000000000..6a3fe643af --- /dev/null +++ b/devtools/client/responsive/test/browser/browser_device_change.js @@ -0,0 +1,129 @@ +/* Any copyright is dedicated to the Public Domain. +http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +// Tests changing viewport device (need HTTP load for proper UA testing) + +const TEST_URL = `${URL_ROOT}doc_page_state.html`; +const DEFAULT_DPPX = window.devicePixelRatio; + +const Types = require("resource://devtools/client/responsive/types.js"); + +const testDevice = { + name: "Fake Phone RDM Test", + width: 320, + height: 570, + pixelRatio: 5.5, + userAgent: "Mozilla/5.0 (Mobile; rv:39.0) Gecko/39.0 Firefox/39.0", + touch: true, + firefoxOS: true, + os: "custom", + featured: true, +}; + +// Add the new device to the list +addDeviceForTest(testDevice); + +// Add the laptop to the device list +const { + updatePreferredDevices, +} = require("resource://devtools/client/responsive/actions/devices.js"); +updatePreferredDevices({ + added: ["Laptop with MDPI screen"], + removed: [], +}); + +addRDMTask( + TEST_URL, + async function ({ ui }) { + reloadOnUAChange(true); + + // Test defaults + testViewportDimensions(ui, 320, 480); + info("Should have default UA at the start of the test"); + await testUserAgent(ui, DEFAULT_UA); + await testDevicePixelRatio(ui, DEFAULT_DPPX); + await testTouchEventsOverride(ui, false); + testViewportDeviceMenuLabel(ui, "Responsive"); + + // Test device with custom properties + await selectDevice(ui, "Fake Phone RDM Test"); + await waitForViewportResizeTo(ui, testDevice.width, testDevice.height); + info("Should have device UA now that device is applied"); + await testUserAgent(ui, testDevice.userAgent); + await testDevicePixelRatio(ui, testDevice.pixelRatio); + await testTouchEventsOverride(ui, true); + + // Test resetting device when resizing viewport + await testViewportResize( + ui, + ".viewport-vertical-resize-handle", + [-10, -10], + [0, -10], + { + hasDevice: true, + } + ); + + info("Should have default UA after resizing viewport"); + await testUserAgent(ui, DEFAULT_UA); + await testDevicePixelRatio(ui, DEFAULT_DPPX); + await testTouchEventsOverride(ui, false); + testViewportDeviceMenuLabel(ui, "Responsive"); + + // Test device with generic properties + await selectDevice(ui, "Laptop with MDPI screen"); + await waitForViewportResizeTo(ui, 1280, 800); + info("Should have default UA when using device without specific UA"); + await testUserAgent(ui, DEFAULT_UA); + await testDevicePixelRatio(ui, 1); + await testTouchEventsOverride(ui, false); + + reloadOnUAChange(false); + }, + { waitForDeviceList: true } +); + +addRDMTask( + null, + async function () { + const tab = await addTab(TEST_URL); + const { ui } = await openRDM(tab); + + const { store } = ui.toolWindow; + + reloadOnUAChange(true); + + // Wait until the viewport has been added and the device list has been loaded + await waitUntilState( + store, + state => + state.viewports.length == 1 && + state.viewports[0].device === "Laptop with MDPI screen" && + state.devices.listState == Types.loadableState.LOADED + ); + + // Select device with custom UA + const waitForReload = await watchForDevToolsReload(ui.getViewportBrowser()); + await selectDevice(ui, "Fake Phone RDM Test"); + await waitForReload(); + await waitForViewportResizeTo(ui, testDevice.width, testDevice.height); + info("Should have device UA now that device is applied"); + await testUserAgent(ui, testDevice.userAgent); + + // Browser will reload to clear the UA on RDM close + const onReload = BrowserTestUtils.browserLoaded(ui.getViewportBrowser()); + await closeRDM(tab); + await onReload; + + // Ensure UA is reset to default after closing RDM + info("Should have default UA after closing RDM"); + await testUserAgentFromBrowser(tab.linkedBrowser, DEFAULT_UA); + + await removeTab(tab); + + reloadOnUAChange(false); + }, + { onlyPrefAndTask: true } +); |