root
/
playwright
mirror of https://github.com/microsoft/playwright.git
1
0
Fork 0
Code Issues Actions 2 Packages Projects Releases Wiki Activity

feat(webkit): add forced colors media query override (#16654)

This commit is contained in:
Max Schmitt 2022-08-19 14:19:54 +02:00 committed by GitHub
parent 14ac443c85
commit be33ec817b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 11 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
docs/src/api/class-page.md
View File

@ -1188,10 +1188,6 @@ Emulates `'prefers-reduced-motion'` media feature, supported values are `'reduce
Emulates `'forced-colors'` media feature, supported values are `'active'` and `'none'`. Passing `null` disables forced colors emulation.
:::note
It's not supported in WebKit, see [here](https://bugs.webkit.org/show_bug.cgi?id=225281) in their issue tracker.
:::
### option: Page.emulateMedia.forcedColors
* since: v1.15
* langs: csharp

4
docs/src/api/params.md
View File

@ -534,10 +534,6 @@ to `'no-preference'`.
Emulates `'forced-colors'` media feature, supported values are `'active'`, `'none'`. See [`method: Page.emulateMedia`] for more details. Defaults
to `'none'`.
:::note
It's not supported in WebKit, see [here](https://bugs.webkit.org/show_bug.cgi?id=225281) in their issue tracker.
:::
## context-option-logger
* langs: js
- `logger` <[Logger]>

15
packages/playwright-core/src/server/webkit/wkPage.ts
View File

@ -194,8 +194,8 @@ export class WKPage implements PageDelegate {
if (contextOptions.userAgent)
promises.push(this.updateUserAgent());
const emulatedMedia = this._page.emulatedMedia();
if (emulatedMedia.media || emulatedMedia.colorScheme || emulatedMedia.reducedMotion)
promises.push(WKPage._setEmulateMedia(session, emulatedMedia.media, emulatedMedia.colorScheme, emulatedMedia.reducedMotion));
if (emulatedMedia.media || emulatedMedia.colorScheme || emulatedMedia.reducedMotion || emulatedMedia.forcedColors)
promises.push(WKPage._setEmulateMedia(session, emulatedMedia.media, emulatedMedia.colorScheme, emulatedMedia.reducedMotion, emulatedMedia.forcedColors));
for (const binding of this._page.allBindings())
promises.push(session.send('Runtime.addBinding', { name: binding.name }));
const bootstrapScript = this._calculateBootstrapScript();
@ -636,7 +636,7 @@ export class WKPage implements PageDelegate {
await this._page._onFileChooserOpened(handle);
}
private static async _setEmulateMedia(session: WKSession, mediaType: types.MediaType | null, colorScheme: types.ColorScheme | null, reducedMotion: types.ReducedMotion | null): Promise<void> {
private static async _setEmulateMedia(session: WKSession, mediaType: types.MediaType | null, colorScheme: types.ColorScheme | null, reducedMotion: types.ReducedMotion | null, forcedColors: types.ForcedColors | null): Promise<void> {
const promises = [];
promises.push(session.send('Page.setEmulatedMedia', { media: mediaType || '' }));
let appearance: any = undefined;
@ -651,6 +651,12 @@ export class WKPage implements PageDelegate {
case 'no-preference': reducedMotionWk = 'NoPreference'; break;
}
promises.push(session.send('Page.setForcedReducedMotion', { reducedMotion: reducedMotionWk }));
let forcedColorsWk: any = undefined;
switch (forcedColors) {
case 'active': forcedColorsWk = 'Active'; break;
case 'none': forcedColorsWk = 'None'; break;
}
promises.push(session.send('Page.setForcedColors', { forcedColors: forcedColorsWk }));
await Promise.all(promises);
}
@ -672,7 +678,8 @@ export class WKPage implements PageDelegate {
const emulatedMedia = this._page.emulatedMedia();
const colorScheme = emulatedMedia.colorScheme;
const reducedMotion = emulatedMedia.reducedMotion;
await this._forAllSessions(session => WKPage._setEmulateMedia(session, emulatedMedia.media, colorScheme, reducedMotion));
const forcedColors = emulatedMedia.forcedColors;
await this._forAllSessions(session => WKPage._setEmulateMedia(session, emulatedMedia.media, colorScheme, reducedMotion, forcedColors));
}
async updateEmulatedViewportSize(): Promise<void> {

10
packages/playwright-core/types/types.d.ts vendored
View File

@ -2249,8 +2249,6 @@ export interface Page {
/**
* Emulates `'forced-colors'` media feature, supported values are `'active'` and `'none'`. Passing `null` disables forced
* colors emulation.
*
* > NOTE: It's not supported in WebKit, see [here](https://bugs.webkit.org/show_bug.cgi?id=225281) in their issue tracker.
*/
forcedColors?: null|"active"|"none";
@ -10541,8 +10539,6 @@ export interface BrowserType<Unused = {}> {
* Emulates `'forced-colors'` media feature, supported values are `'active'`, `'none'`. See
* [page.emulateMedia([options])](https://playwright.dev/docs/api/class-page#page-emulate-media) for more details. Defaults
* to `'none'`.
*
* > NOTE: It's not supported in WebKit, see [here](https://bugs.webkit.org/show_bug.cgi?id=225281) in their issue tracker.
*/
forcedColors?: "active"|"none";
@ -11802,8 +11798,6 @@ export interface AndroidDevice {
* Emulates `'forced-colors'` media feature, supported values are `'active'`, `'none'`. See
* [page.emulateMedia([options])](https://playwright.dev/docs/api/class-page#page-emulate-media) for more details. Defaults
* to `'none'`.
*
* > NOTE: It's not supported in WebKit, see [here](https://bugs.webkit.org/show_bug.cgi?id=225281) in their issue tracker.
*/
forcedColors?: "active"|"none";
@ -13366,8 +13360,6 @@ export interface Browser extends EventEmitter {
* Emulates `'forced-colors'` media feature, supported values are `'active'`, `'none'`. See
* [page.emulateMedia([options])](https://playwright.dev/docs/api/class-page#page-emulate-media) for more details. Defaults
* to `'none'`.
*
* > NOTE: It's not supported in WebKit, see [here](https://bugs.webkit.org/show_bug.cgi?id=225281) in their issue tracker.
*/
forcedColors?: "active"|"none";
@ -16015,8 +16007,6 @@ export interface BrowserContextOptions {
* Emulates `'forced-colors'` media feature, supported values are `'active'`, `'none'`. See
* [page.emulateMedia([options])](https://playwright.dev/docs/api/class-page#page-emulate-media) for more details. Defaults
* to `'none'`.
*
* > NOTE: It's not supported in WebKit, see [here](https://bugs.webkit.org/show_bug.cgi?id=225281) in their issue tracker.
*/
forcedColors?: "active"|"none";

1
tests/library/defaultbrowsercontext-2.spec.ts
View File

@ -46,7 +46,6 @@ it('should support reducedMotion option', async ({ launchPersistent }) => {
});
it('should support forcedColors option', async ({ launchPersistent, browserName }) => {
it.skip(browserName === 'webkit', 'https://bugs.webkit.org/show_bug.cgi?id=225281');
const { page } = await launchPersistent({ forcedColors: 'active' });
expect(await page.evaluate(() => matchMedia('(forced-colors: active)').matches)).toBe(true);
expect(await page.evaluate(() => matchMedia('(forced-colors: none)').matches)).toBe(false);

1
tests/page/page-emulate-media.spec.ts
View File

@ -125,7 +125,6 @@ it('should emulate reduced motion', async ({ page }) => {
});
it('should emulate forcedColors ', async ({ page, browserName }) => {
it.skip(browserName === 'webkit', 'https://bugs.webkit.org/show_bug.cgi?id=225281');
expect(await page.evaluate(() => matchMedia('(forced-colors: none)').matches)).toBe(true);
await page.emulateMedia({ forcedColors: 'none' });
expect(await page.evaluate(() => matchMedia('(forced-colors: none)').matches)).toBe(true);