diff --git a/docs/api.md b/docs/api.md index f64a095067..87ba00d71c 100644 --- a/docs/api.md +++ b/docs/api.md @@ -197,9 +197,10 @@ Indicates that the browser is connected. - `viewport` <[Object]> Sets a consistent viewport for each page. Defaults to an 1280x720 viewport. `null` disables the default viewport. - `width` <[number]> page width in pixels. - `height` <[number]> page height in pixels. - - `deviceScaleFactor` <[number]> Specify device scale factor (can be thought of as dpr). Defaults to `1`. - - `isMobile` <[boolean]> Whether the `meta viewport` tag is taken into account and touch events are enabled. Defaults to `false`. Not supported in Firefox. - `userAgent` <[string]> Specific user agent to use in this context. + - `deviceScaleFactor` <[number]> Specify device scale factor (can be thought of as dpr). Defaults to `1`. + - `isMobile` <[boolean]> Whether the `meta viewport` tag is taken into account and touch events are enabled. Defaults to `false`. Not supported in Firefox. + - `hasTouch` <[boolean]> Specifies if viewport supports touch events. Defaults to false. - `javaScriptEnabled` <[boolean]> Whether or not to enable or disable JavaScript in the context. Defaults to true. - `timezoneId` Changes the timezone of the context. See [ICU’s `metaZones.txt`](https://cs.chromium.org/chromium/src/third_party/icu/source/data/misc/metaZones.txt?rcl=faee8bc70570192d82d2978a71e2a615788597d1) for a list of supported timezone IDs. - `geolocation` <[Object]> @@ -232,12 +233,13 @@ Creates a new browser context. It won't share cookies/cache with other browser c - `options` <[Object]> - `ignoreHTTPSErrors` Whether to ignore HTTPS errors during navigation. Defaults to `false`. - `bypassCSP` Toggles bypassing page's Content-Security-Policy. - - `viewport` Sets a consistent viewport for each page. Defaults to an 1280x720 viewport. `null` disables the default viewport. + - `viewport` <[Object]> Sets a consistent viewport for each page. Defaults to an 1280x720 viewport. `null` disables the default viewport. - `width` <[number]> page width in pixels. - `height` <[number]> page height in pixels. - - `deviceScaleFactor` <[number]> Specify device scale factor (can be thought of as dpr). Defaults to `1`. - - `isMobile` <[boolean]> Whether the `meta viewport` tag is taken into account and touch events are enabled. Defaults to `false`. Not supported in Firefox. - - `userAgent` Specific user agent to use in this context. + - `userAgent` <[string]> Specific user agent to use in this context. + - `deviceScaleFactor` <[number]> Specify device scale factor (can be thought of as dpr). Defaults to `1`. + - `isMobile` <[boolean]> Whether the `meta viewport` tag is taken into account and touch events are enabled. Defaults to `false`. Not supported in Firefox. + - `hasTouch` <[boolean]> Specifies if viewport supports touch events. Defaults to false. - `javaScriptEnabled` Whether or not to enable or disable JavaScript in the context. Defaults to true. - `timezoneId` Changes the timezone of the context. See [ICU’s `metaZones.txt`](https://cs.chromium.org/chromium/src/third_party/icu/source/data/misc/metaZones.txt?rcl=faee8bc70570192d82d2978a71e2a615788597d1) for a list of supported timezone IDs. - `geolocation` <[Object]> diff --git a/src/browserContext.ts b/src/browserContext.ts index 9b8653a70b..4a553a5e71 100644 --- a/src/browserContext.ts +++ b/src/browserContext.ts @@ -24,7 +24,7 @@ import * as types from './types'; import { Events } from './events'; export type BrowserContextOptions = { - viewport?: types.Viewport | null, + viewport?: types.Size | null, ignoreHTTPSErrors?: boolean, javaScriptEnabled?: boolean, bypassCSP?: boolean, @@ -36,6 +36,9 @@ export type BrowserContextOptions = { extraHTTPHeaders?: network.Headers, offline?: boolean, httpCredentials?: types.Credentials, + deviceScaleFactor?: number, + isMobile?: boolean, + hasTouch?: boolean }; export interface BrowserContext { diff --git a/src/chromium/crPage.ts b/src/chromium/crPage.ts index d91689adaf..3d379b5847 100644 --- a/src/chromium/crPage.ts +++ b/src/chromium/crPage.ts @@ -350,24 +350,25 @@ export class CRPage implements PageDelegate { } async _updateViewport(updateTouch: boolean): Promise { - let viewport = this._browserContext._options.viewport || { width: 0, height: 0 }; + const options = this._browserContext._options; + let viewport = options.viewport || { width: 0, height: 0 }; const viewportSize = this._page._state.viewportSize; if (viewportSize) viewport = { ...viewport, ...viewportSize }; const isLandscape = viewport.width > viewport.height; const promises = [ this._client.send('Emulation.setDeviceMetricsOverride', { - mobile: !!viewport.isMobile, + mobile: !!options.isMobile, width: viewport.width, height: viewport.height, screenWidth: viewport.width, screenHeight: viewport.height, - deviceScaleFactor: viewport.deviceScaleFactor || 1, + deviceScaleFactor: options.deviceScaleFactor || 1, screenOrientation: isLandscape ? { angle: 90, type: 'landscapePrimary' } : { angle: 0, type: 'portraitPrimary' }, }), ]; if (updateTouch) - promises.push(this._client.send('Emulation.setTouchEmulationEnabled', { enabled: !!viewport.isMobile })); + promises.push(this._client.send('Emulation.setTouchEmulationEnabled', { enabled: !!options.hasTouch })); await Promise.all(promises); } diff --git a/src/deviceDescriptors.ts b/src/deviceDescriptors.ts index a6780ee11a..985bba9d07 100644 --- a/src/deviceDescriptors.ts +++ b/src/deviceDescriptors.ts @@ -22,684 +22,760 @@ export const DeviceDescriptors: types.Devices = { 'userAgent': 'Mozilla/5.0 (PlayBook; U; RIM Tablet OS 2.1.0; en-US) AppleWebKit/536.2+ (KHTML like Gecko) Version/7.2.1.0 Safari/536.2+', 'viewport': { 'width': 600, - 'height': 1024, - 'deviceScaleFactor': 1, - 'isMobile': true - } + 'height': 1024 + }, + 'deviceScaleFactor': 1, + 'isMobile': true, + 'hasTouch': true }, 'Blackberry PlayBook landscape': { 'userAgent': 'Mozilla/5.0 (PlayBook; U; RIM Tablet OS 2.1.0; en-US) AppleWebKit/536.2+ (KHTML like Gecko) Version/7.2.1.0 Safari/536.2+', 'viewport': { 'width': 1024, - 'height': 600, - 'deviceScaleFactor': 1, - 'isMobile': true - } + 'height': 600 + }, + 'deviceScaleFactor': 1, + 'isMobile': true, + 'hasTouch': true }, 'BlackBerry Z30': { 'userAgent': 'Mozilla/5.0 (BB10; Touch) AppleWebKit/537.10+ (KHTML, like Gecko) Version/10.0.9.2372 Mobile Safari/537.10+', 'viewport': { 'width': 360, - 'height': 640, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 640 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'BlackBerry Z30 landscape': { 'userAgent': 'Mozilla/5.0 (BB10; Touch) AppleWebKit/537.10+ (KHTML, like Gecko) Version/10.0.9.2372 Mobile Safari/537.10+', 'viewport': { 'width': 640, - 'height': 360, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 360 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'Galaxy Note 3': { 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.3; en-us; SM-N900T Build/JSS15J) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30', 'viewport': { 'width': 360, - 'height': 640, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 640 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'Galaxy Note 3 landscape': { 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.3; en-us; SM-N900T Build/JSS15J) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30', 'viewport': { 'width': 640, - 'height': 360, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 360 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'Galaxy Note II': { 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.1; en-us; GT-N7100 Build/JRO03C) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30', 'viewport': { 'width': 360, - 'height': 640, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 640 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'Galaxy Note II landscape': { 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.1; en-us; GT-N7100 Build/JRO03C) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30', 'viewport': { 'width': 640, - 'height': 360, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 360 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'Galaxy S III': { 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.0; en-us; GT-I9300 Build/IMM76D) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30', 'viewport': { 'width': 360, - 'height': 640, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 640 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'Galaxy S III landscape': { 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.0; en-us; GT-I9300 Build/IMM76D) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30', 'viewport': { 'width': 640, - 'height': 360, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 360 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'Galaxy S5': { 'userAgent': 'Mozilla/5.0 (Linux; Android 5.0; SM-G900P Build/LRX21T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 360, - 'height': 640, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 640 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'Galaxy S5 landscape': { 'userAgent': 'Mozilla/5.0 (Linux; Android 5.0; SM-G900P Build/LRX21T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 640, - 'height': 360, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 360 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'iPad (gen 6)': { 'userAgent': 'Mozilla/5.0 (iPad; CPU OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 768, - 'height': 1024, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 1024 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPad (gen 6) landscape': { 'userAgent': 'Mozilla/5.0 (iPad; CPU OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 1024, - 'height': 768, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 768 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPad (gen 7)': { 'userAgent': 'Mozilla/5.0 (iPad; CPU OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 810, - 'height': 1080, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 1080 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPad (gen 7) landscape': { 'userAgent': 'Mozilla/5.0 (iPad; CPU OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 1080, - 'height': 810, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 810 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPad Mini': { 'userAgent': 'Mozilla/5.0 (iPad; CPU OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 768, - 'height': 1024, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 1024 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPad Mini landscape': { 'userAgent': 'Mozilla/5.0 (iPad; CPU OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 1024, - 'height': 768, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 768 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPad Pro 11': { 'userAgent': 'Mozilla/5.0 (iPad; CPU OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 834, - 'height': 1194, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 1194 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPad Pro 11 landscape': { 'userAgent': 'Mozilla/5.0 (iPad; CPU OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 1194, - 'height': 834, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 834 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 6': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1', 'viewport': { 'width': 375, - 'height': 667, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 667 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 6 landscape': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1', 'viewport': { 'width': 667, - 'height': 375, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 375 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 6 Plus': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1', 'viewport': { 'width': 414, - 'height': 736, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 736 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 6 Plus landscape': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1', 'viewport': { 'width': 736, - 'height': 414, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 414 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 7': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1', 'viewport': { 'width': 375, - 'height': 667, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 667 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 7 landscape': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1', 'viewport': { 'width': 667, - 'height': 375, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 375 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 7 Plus': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1', 'viewport': { 'width': 414, - 'height': 736, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 736 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 7 Plus landscape': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1', 'viewport': { 'width': 736, - 'height': 414, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 414 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 8': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1', 'viewport': { 'width': 375, - 'height': 667, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 667 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 8 landscape': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1', 'viewport': { 'width': 667, - 'height': 375, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 375 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 8 Plus': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1', 'viewport': { 'width': 414, - 'height': 736, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 736 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 8 Plus landscape': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1', 'viewport': { 'width': 736, - 'height': 414, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 414 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'iPhone SE': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 10_3_1 like Mac OS X) AppleWebKit/603.1.30 (KHTML, like Gecko) Version/10.0 Mobile/14E304 Safari/602.1', 'viewport': { 'width': 320, - 'height': 568, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 568 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPhone SE landscape': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 10_3_1 like Mac OS X) AppleWebKit/603.1.30 (KHTML, like Gecko) Version/10.0 Mobile/14E304 Safari/602.1', 'viewport': { 'width': 568, - 'height': 320, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 320 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPhone X': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1', 'viewport': { 'width': 375, - 'height': 812, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 812 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'iPhone X landscape': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1', 'viewport': { 'width': 812, - 'height': 375, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 375 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'iPhone XR': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 12_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/12.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 414, - 'height': 896, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 896 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'iPhone XR landscape': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 12_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/12.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 896, - 'height': 414, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 414 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 11': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 414, - 'height': 896, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 896 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 11 landscape': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 896, - 'height': 414, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 414 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 11 Pro': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 375, - 'height': 812, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 812 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 11 Pro landscape': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 812, - 'height': 375, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 375 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 11 Pro Max': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 414, - 'height': 896, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 896 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'iPhone 11 Pro Max landscape': { 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Mobile/15E148 Safari/604.1', 'viewport': { 'width': 896, - 'height': 414, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 414 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'JioPhone 2': { 'userAgent': 'Mozilla/5.0 (Mobile; LYF/F300B/LYF-F300B-001-01-15-130718-i;Android; rv:48.0) Gecko/48.0 Firefox/48.0 KAIOS/2.5', 'viewport': { 'width': 240, - 'height': 320, - 'deviceScaleFactor': 1, - 'isMobile': true - } + 'height': 320 + }, + 'deviceScaleFactor': 1, + 'isMobile': true, + 'hasTouch': true }, 'JioPhone 2 landscape': { 'userAgent': 'Mozilla/5.0 (Mobile; LYF/F300B/LYF-F300B-001-01-15-130718-i;Android; rv:48.0) Gecko/48.0 Firefox/48.0 KAIOS/2.5', 'viewport': { 'width': 320, - 'height': 240, - 'deviceScaleFactor': 1, - 'isMobile': true - } + 'height': 240 + }, + 'deviceScaleFactor': 1, + 'isMobile': true, + 'hasTouch': true }, 'Kindle Fire HDX': { 'userAgent': 'Mozilla/5.0 (Linux; U; en-us; KFAPWI Build/JDQ39) AppleWebKit/535.19 (KHTML, like Gecko) Silk/3.13 Safari/535.19 Silk-Accelerated=true', 'viewport': { 'width': 800, - 'height': 1280, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 1280 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'Kindle Fire HDX landscape': { 'userAgent': 'Mozilla/5.0 (Linux; U; en-us; KFAPWI Build/JDQ39) AppleWebKit/535.19 (KHTML, like Gecko) Silk/3.13 Safari/535.19 Silk-Accelerated=true', 'viewport': { 'width': 1280, - 'height': 800, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 800 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'LG Optimus L70': { 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.4.2; en-us; LGMS323 Build/KOT49I.MS32310c) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 384, - 'height': 640, - 'deviceScaleFactor': 1.25, - 'isMobile': true - } + 'height': 640 + }, + 'deviceScaleFactor': 1.25, + 'isMobile': true, + 'hasTouch': true }, 'LG Optimus L70 landscape': { 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.4.2; en-us; LGMS323 Build/KOT49I.MS32310c) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 640, - 'height': 384, - 'deviceScaleFactor': 1.25, - 'isMobile': true - } + 'height': 384 + }, + 'deviceScaleFactor': 1.25, + 'isMobile': true, + 'hasTouch': true }, 'Microsoft Lumia 550': { 'userAgent': 'Mozilla/5.0 (Windows Phone 10.0; Android 4.2.1; Microsoft; Lumia 550) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Mobile Safari/537.36 Edge/14.14263', 'viewport': { 'width': 640, - 'height': 360, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 360 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'Microsoft Lumia 550 landscape': { 'userAgent': 'Mozilla/5.0 (Windows Phone 10.0; Android 4.2.1; Microsoft; Lumia 550) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Mobile Safari/537.36 Edge/14.14263', 'viewport': { 'width': 360, - 'height': 640, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 640 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'Microsoft Lumia 950': { 'userAgent': 'Mozilla/5.0 (Windows Phone 10.0; Android 4.2.1; Microsoft; Lumia 950) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Mobile Safari/537.36 Edge/14.14263', 'viewport': { 'width': 360, - 'height': 640, - 'deviceScaleFactor': 4, - 'isMobile': true - } + 'height': 640 + }, + 'deviceScaleFactor': 4, + 'isMobile': true, + 'hasTouch': true }, 'Microsoft Lumia 950 landscape': { 'userAgent': 'Mozilla/5.0 (Windows Phone 10.0; Android 4.2.1; Microsoft; Lumia 950) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Mobile Safari/537.36 Edge/14.14263', 'viewport': { 'width': 640, - 'height': 360, - 'deviceScaleFactor': 4, - 'isMobile': true - } + 'height': 360 + }, + 'deviceScaleFactor': 4, + 'isMobile': true, + 'hasTouch': true }, 'Nexus 10': { 'userAgent': 'Mozilla/5.0 (Linux; Android 6.0.1; Nexus 10 Build/MOB31T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Safari/537.36', 'viewport': { 'width': 800, - 'height': 1280, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 1280 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'Nexus 10 landscape': { 'userAgent': 'Mozilla/5.0 (Linux; Android 6.0.1; Nexus 10 Build/MOB31T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Safari/537.36', 'viewport': { 'width': 1280, - 'height': 800, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 800 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'Nexus 4': { 'userAgent': 'Mozilla/5.0 (Linux; Android 4.4.2; Nexus 4 Build/KOT49H) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 384, - 'height': 640, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 640 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'Nexus 4 landscape': { 'userAgent': 'Mozilla/5.0 (Linux; Android 4.4.2; Nexus 4 Build/KOT49H) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 640, - 'height': 384, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 384 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'Nexus 5': { 'userAgent': 'Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 360, - 'height': 640, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 640 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'Nexus 5 landscape': { 'userAgent': 'Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 640, - 'height': 360, - 'deviceScaleFactor': 3, - 'isMobile': true - } + 'height': 360 + }, + 'deviceScaleFactor': 3, + 'isMobile': true, + 'hasTouch': true }, 'Nexus 5X': { 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0.0; Nexus 5X Build/OPR4.170623.006) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 412, - 'height': 732, - 'deviceScaleFactor': 2.625, - 'isMobile': true - } + 'height': 732 + }, + 'deviceScaleFactor': 2.625, + 'isMobile': true, + 'hasTouch': true }, 'Nexus 5X landscape': { 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0.0; Nexus 5X Build/OPR4.170623.006) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 732, - 'height': 412, - 'deviceScaleFactor': 2.625, - 'isMobile': true - } + 'height': 412 + }, + 'deviceScaleFactor': 2.625, + 'isMobile': true, + 'hasTouch': true }, 'Nexus 6': { 'userAgent': 'Mozilla/5.0 (Linux; Android 7.1.1; Nexus 6 Build/N6F26U) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 412, - 'height': 732, - 'deviceScaleFactor': 3.5, - 'isMobile': true - } + 'height': 732 + }, + 'deviceScaleFactor': 3.5, + 'isMobile': true, + 'hasTouch': true }, 'Nexus 6 landscape': { 'userAgent': 'Mozilla/5.0 (Linux; Android 7.1.1; Nexus 6 Build/N6F26U) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 732, - 'height': 412, - 'deviceScaleFactor': 3.5, - 'isMobile': true - } + 'height': 412 + }, + 'deviceScaleFactor': 3.5, + 'isMobile': true, + 'hasTouch': true }, 'Nexus 6P': { 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0.0; Nexus 6P Build/OPP3.170518.006) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 412, - 'height': 732, - 'deviceScaleFactor': 3.5, - 'isMobile': true - } + 'height': 732 + }, + 'deviceScaleFactor': 3.5, + 'isMobile': true, + 'hasTouch': true }, 'Nexus 6P landscape': { 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0.0; Nexus 6P Build/OPP3.170518.006) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 732, - 'height': 412, - 'deviceScaleFactor': 3.5, - 'isMobile': true - } + 'height': 412 + }, + 'deviceScaleFactor': 3.5, + 'isMobile': true, + 'hasTouch': true }, 'Nexus 7': { 'userAgent': 'Mozilla/5.0 (Linux; Android 6.0.1; Nexus 7 Build/MOB30X) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Safari/537.36', 'viewport': { 'width': 600, - 'height': 960, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 960 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'Nexus 7 landscape': { 'userAgent': 'Mozilla/5.0 (Linux; Android 6.0.1; Nexus 7 Build/MOB30X) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Safari/537.36', 'viewport': { 'width': 960, - 'height': 600, - 'deviceScaleFactor': 2, - 'isMobile': true - } + 'height': 600 + }, + 'deviceScaleFactor': 2, + 'isMobile': true, + 'hasTouch': true }, 'Nokia Lumia 520': { 'userAgent': 'Mozilla/5.0 (compatible; MSIE 10.0; Windows Phone 8.0; Trident/6.0; IEMobile/10.0; ARM; Touch; NOKIA; Lumia 520)', 'viewport': { 'width': 320, - 'height': 533, - 'deviceScaleFactor': 1.5, - 'isMobile': true - } + 'height': 533 + }, + 'deviceScaleFactor': 1.5, + 'isMobile': true, + 'hasTouch': true }, 'Nokia Lumia 520 landscape': { 'userAgent': 'Mozilla/5.0 (compatible; MSIE 10.0; Windows Phone 8.0; Trident/6.0; IEMobile/10.0; ARM; Touch; NOKIA; Lumia 520)', 'viewport': { 'width': 533, - 'height': 320, - 'deviceScaleFactor': 1.5, - 'isMobile': true - } + 'height': 320 + }, + 'deviceScaleFactor': 1.5, + 'isMobile': true, + 'hasTouch': true }, 'Nokia N9': { 'userAgent': 'Mozilla/5.0 (MeeGo; NokiaN9) AppleWebKit/534.13 (KHTML, like Gecko) NokiaBrowser/8.5.0 Mobile Safari/534.13', 'viewport': { 'width': 480, - 'height': 854, - 'deviceScaleFactor': 1, - 'isMobile': true - } + 'height': 854 + }, + 'deviceScaleFactor': 1, + 'isMobile': true, + 'hasTouch': true }, 'Nokia N9 landscape': { 'userAgent': 'Mozilla/5.0 (MeeGo; NokiaN9) AppleWebKit/534.13 (KHTML, like Gecko) NokiaBrowser/8.5.0 Mobile Safari/534.13', 'viewport': { 'width': 854, - 'height': 480, - 'deviceScaleFactor': 1, - 'isMobile': true - } + 'height': 480 + }, + 'deviceScaleFactor': 1, + 'isMobile': true, + 'hasTouch': true }, 'Pixel 2': { 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0; Pixel 2 Build/OPD3.170816.012) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 411, - 'height': 731, - 'deviceScaleFactor': 2.625, - 'isMobile': true - } + 'height': 731 + }, + 'deviceScaleFactor': 2.625, + 'isMobile': true, + 'hasTouch': true }, 'Pixel 2 landscape': { 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0; Pixel 2 Build/OPD3.170816.012) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 731, - 'height': 411, - 'deviceScaleFactor': 2.625, - 'isMobile': true - } + 'height': 411 + }, + 'deviceScaleFactor': 2.625, + 'isMobile': true, + 'hasTouch': true }, 'Pixel 2 XL': { 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0.0; Pixel 2 XL Build/OPD1.170816.004) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 411, - 'height': 823, - 'deviceScaleFactor': 3.5, - 'isMobile': true - } + 'height': 823 + }, + 'deviceScaleFactor': 3.5, + 'isMobile': true, + 'hasTouch': true }, 'Pixel 2 XL landscape': { 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0.0; Pixel 2 XL Build/OPD1.170816.004) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36', 'viewport': { 'width': 823, - 'height': 411, - 'deviceScaleFactor': 3.5, - 'isMobile': true - } + 'height': 411 + }, + 'deviceScaleFactor': 3.5, + 'isMobile': true, + 'hasTouch': true } }; diff --git a/src/firefox/ffBrowser.ts b/src/firefox/ffBrowser.ts index 56ec5a0e1d..842eb2a5b2 100644 --- a/src/firefox/ffBrowser.ts +++ b/src/firefox/ffBrowser.ts @@ -73,11 +73,13 @@ export class FFBrowser extends platform.EventEmitter implements Browser { let viewport; if (options.viewport) { // TODO: remove isMobile/hasTouch from the protocol? - if (options.viewport.isMobile) - throw new Error('viewport.isMobile is not supported in Firefox'); + if (options.isMobile) + throw new Error('options.isMobile is not supported in Firefox'); + if (options.hasTouch) + throw new Error('options.hasTouch is not supported in Firefox'); viewport = { viewportSize: { width: options.viewport.width, height: options.viewport.height }, - deviceScaleFactor: options.viewport.deviceScaleFactor || 1, + deviceScaleFactor: options.deviceScaleFactor || 1, isMobile: false, hasTouch: false, }; diff --git a/src/types.ts b/src/types.ts index c045092eab..3cad1b4aeb 100644 --- a/src/types.ts +++ b/src/types.ts @@ -77,13 +77,6 @@ export type ScreenshotOptions = ElementScreenshotOptions & { clip?: Rect, }; -export type Viewport = { - width: number; - height: number; - deviceScaleFactor?: number; - isMobile?: boolean; -}; - export type URLMatch = string | RegExp | ((url: URL) => boolean); export type Credentials = { @@ -117,7 +110,10 @@ export const colorSchemes: Set = new Set(['dark', 'light', 'no-pref export type DeviceDescriptor = { userAgent: string, - viewport: Viewport, + viewport: Size, + deviceScaleFactor: number, + isMobile: boolean, + hasTouch: boolean }; export type Devices = { [name: string]: DeviceDescriptor }; diff --git a/src/webkit/wkPage.ts b/src/webkit/wkPage.ts index d015bd802b..ca101ecbd3 100644 --- a/src/webkit/wkPage.ts +++ b/src/webkit/wkPage.ts @@ -155,7 +155,7 @@ export class WKPage implements PageDelegate { promises.push(session.send('Network.setExtraHTTPHeaders', { headers: this._calculateExtraHTTPHeaders() })); if (contextOptions.offline) promises.push(session.send('Network.setEmulateOfflineState', { offline: true })); - promises.push(session.send('Page.setTouchEmulationEnabled', { enabled: contextOptions.viewport ? !!contextOptions.viewport.isMobile : false })); + promises.push(session.send('Page.setTouchEmulationEnabled', { enabled: !!contextOptions.hasTouch })); if (contextOptions.timezoneId) { promises.push(session.send('Page.setTimeZone', { timeZone: contextOptions.timezoneId }). catch(e => { throw new Error(`Invalid timezone ID: ${contextOptions.timezoneId}`); })); @@ -485,7 +485,8 @@ export class WKPage implements PageDelegate { } async _updateViewport(): Promise { - let viewport = this._browserContext._options.viewport || { width: 0, height: 0 }; + const options = this._browserContext._options; + let viewport = options.viewport || { width: 0, height: 0 }; const viewportSize = this._page._state.viewportSize; if (viewportSize) viewport = { ...viewport, ...viewportSize }; @@ -493,8 +494,8 @@ export class WKPage implements PageDelegate { this._pageProxySession.send('Emulation.setDeviceMetricsOverride', { width: viewport.width, height: viewport.height, - fixedLayout: !!viewport.isMobile, - deviceScaleFactor: viewport.deviceScaleFactor || 1 + fixedLayout: !!options.isMobile, + deviceScaleFactor: options.deviceScaleFactor || 1 }), this._session.send('Page.setScreenSizeOverride', { width: viewport.width, diff --git a/test/click.spec.js b/test/click.spec.js index 23aafedb4c..9682848523 100644 --- a/test/click.spec.js +++ b/test/click.spec.js @@ -307,7 +307,7 @@ module.exports.describe = function({testRunner, expect, playwright, FFOX, CHROMI expect(await frame.evaluate(() => window.result)).toBe('Clicked'); }); it('should click the button with deviceScaleFactor set', async({browser, server}) => { - const context = await browser.newContext({ viewport: {width: 400, height: 400, deviceScaleFactor: 5} }); + const context = await browser.newContext({ viewport: { width: 400, height: 400 }, deviceScaleFactor: 5 }); const page = await context.newPage(); expect(await page.evaluate(() => window.devicePixelRatio)).toBe(5); await page.setContent('
spacer
'); @@ -367,7 +367,7 @@ module.exports.describe = function({testRunner, expect, playwright, FFOX, CHROMI expect(await page.evaluate(() => offsetY)).toBe(WEBKIT ? 1910 + 8 : 1910); }); it.skip(FFOX)('should click the button with offset with page scale', async({browser, server}) => { - const context = await browser.newContext({ viewport: { width: 400, height: 400, isMobile: true} }); + const context = await browser.newContext({ viewport: { width: 400, height: 400 }, isMobile: true }); const page = await context.newPage(); await page.goto(server.PREFIX + '/input/button.html'); await page.$eval('button', button => { diff --git a/test/emulation.spec.js b/test/emulation.spec.js index 352d49532f..433debdf60 100644 --- a/test/emulation.spec.js +++ b/test/emulation.spec.js @@ -120,7 +120,7 @@ module.exports.describe = function({testRunner, expect, playwright, headless, FF await context.close(); }); it('should detect touch when applying viewport with touches', async({browser, server}) => { - const context = await browser.newContext({ viewport: { width: 800, height: 600, isMobile: true } }); + const context = await browser.newContext({ viewport: { width: 800, height: 600 }, hasTouch: true }); const page = await context.newPage(); await page.goto(server.EMPTY_PAGE); await page.addScriptTag({url: server.PREFIX + '/modernizr.js'}); @@ -139,7 +139,7 @@ module.exports.describe = function({testRunner, expect, playwright, headless, FF await context2.close(); }); it.fail(WEBKIT)('should fire orientationchange event', async({browser, server}) => { - const context = await browser.newContext({ viewport: { width: 300, height: 400, isMobile: true } }); + const context = await browser.newContext({ viewport: { width: 300, height: 400 }, isMobile: true }); const page = await context.newPage(); await page.goto(server.PREFIX + '/mobile.html'); await page.evaluate(() => { @@ -157,14 +157,14 @@ module.exports.describe = function({testRunner, expect, playwright, headless, FF await context.close(); }); it('default mobile viewports to 980 width', async({browser, server}) => { - const context = await browser.newContext({ viewport: {width: 320, height: 480, isMobile: true} }); + const context = await browser.newContext({ viewport: {width: 320, height: 480 }, isMobile: true }); const page = await context.newPage(); await page.goto(server.PREFIX + '/empty.html'); expect(await page.evaluate(() => window.innerWidth)).toBe(980); await context.close(); }); it('respect meta viewport tag', async({browser, server}) => { - const context = await browser.newContext({ viewport: {width: 320, height: 480, isMobile: true} }); + const context = await browser.newContext({ viewport: {width: 320, height: 480 }, isMobile: true }); const page = await context.newPage(); await page.goto(server.PREFIX + '/mobile.html'); expect(await page.evaluate(() => window.innerWidth)).toBe(320); diff --git a/test/popup.spec.js b/test/popup.spec.js index 4b7ab162d8..fa9767eaf6 100644 --- a/test/popup.spec.js +++ b/test/popup.spec.js @@ -114,7 +114,8 @@ module.exports.describe = function({testRunner, expect, playwright, CHROMIUM, WE }); it.skip(FFOX)('should inherit touch support from browser context', async function({browser, server}) { const context = await browser.newContext({ - viewport: { width: 400, height: 500, isMobile: true } + viewport: { width: 400, height: 500 }, + hasTouch: true }); const page = await context.newPage(); await page.goto(server.EMPTY_PAGE); diff --git a/test/screenshot.spec.js b/test/screenshot.spec.js index af348ce471..3ce4b5502c 100644 --- a/test/screenshot.spec.js +++ b/test/screenshot.spec.js @@ -164,7 +164,7 @@ module.exports.describe = function({testRunner, expect, product, FFOX, CHROMIUM, expect(screenshot).toBeGolden('screenshot-clip-odd-size.png'); }); it.skip(FFOX)('should work with a mobile viewport', async({browser, server}) => { - const context = await browser.newContext({viewport: { width: 320, height: 480, isMobile: true }}); + const context = await browser.newContext({ viewport: { width: 320, height: 480 }, isMobile: true }); const page = await context.newPage(); await page.goto(server.PREFIX + '/overflow.html'); const screenshot = await page.screenshot(); @@ -172,7 +172,7 @@ module.exports.describe = function({testRunner, expect, product, FFOX, CHROMIUM, await context.close(); }); it.skip(FFOX)('should work with a mobile viewport and clip', async({browser, server}) => { - const context = await browser.newContext({viewport: { width: 320, height: 480, isMobile: true }}); + const context = await browser.newContext({viewport: { width: 320, height: 480 }, isMobile: true}); const page = await context.newPage(); await page.goto(server.PREFIX + '/overflow.html'); const screenshot = await page.screenshot({ clip: { x: 10, y: 10, width: 100, height: 150 } }); @@ -180,7 +180,7 @@ module.exports.describe = function({testRunner, expect, product, FFOX, CHROMIUM, await context.close(); }); it.skip(FFOX)('should work with a mobile viewport and fullPage', async({browser, server}) => { - const context = await browser.newContext({viewport: { width: 320, height: 480, isMobile: true }}); + const context = await browser.newContext({viewport: { width: 320, height: 480 }, isMobile: true}); const page = await context.newPage(); await page.goto(server.PREFIX + '/overflow-large.html'); const screenshot = await page.screenshot({ fullPage: true });