From 40670e6ffd579de4c61b6760f606ea90c4cc07cd Mon Sep 17 00:00:00 2001 From: Simon Knott Date: Fri, 4 Oct 2024 16:49:32 +0200 Subject: [PATCH] fix(emulate media): document "no-preference" as deprecated (#32881) Closes https://github.com/microsoft/playwright/issues/32862. `prefers-color-scheme: no-preference` was removed from browsers. This PR marks it as deprecated in our docs and removes all mentions. --------- Signed-off-by: Simon Knott Co-authored-by: Dmitry Gozman --- docs/src/api/class-page.md | 17 ++++------------- docs/src/api/params.md | 4 ++-- docs/src/emulation.md | 2 +- docs/src/test-use-options-js.md | 2 +- packages/playwright-core/types/types.d.ts | 22 +++++++++++++--------- packages/playwright/types/test.d.ts | 3 ++- 6 files changed, 23 insertions(+), 27 deletions(-) diff --git a/docs/src/api/class-page.md b/docs/src/api/class-page.md index 7a3be809c6..373649154d 100644 --- a/docs/src/api/class-page.md +++ b/docs/src/api/class-page.md @@ -1217,8 +1217,6 @@ await page.evaluate(() => matchMedia('(prefers-color-scheme: dark)').matches); // → true await page.evaluate(() => matchMedia('(prefers-color-scheme: light)').matches); // → false -await page.evaluate(() => matchMedia('(prefers-color-scheme: no-preference)').matches); -// → false ``` ```java @@ -1227,8 +1225,6 @@ page.evaluate("() => matchMedia('(prefers-color-scheme: dark)').matches"); // → true page.evaluate("() => matchMedia('(prefers-color-scheme: light)').matches"); // → false -page.evaluate("() => matchMedia('(prefers-color-scheme: no-preference)').matches"); -// → false ``` ```python async @@ -1237,8 +1233,6 @@ await page.evaluate("matchMedia('(prefers-color-scheme: dark)').matches") # → True await page.evaluate("matchMedia('(prefers-color-scheme: light)').matches") # → False -await page.evaluate("matchMedia('(prefers-color-scheme: no-preference)').matches") -# → False ``` ```python sync @@ -1247,7 +1241,6 @@ page.evaluate("matchMedia('(prefers-color-scheme: dark)').matches") # → True page.evaluate("matchMedia('(prefers-color-scheme: light)').matches") # → False -page.evaluate("matchMedia('(prefers-color-scheme: no-preference)').matches") ``` ```csharp @@ -1256,8 +1249,6 @@ await page.EvaluateAsync("matchMedia('(prefers-color-scheme: dark)').matches"); // → true await page.EvaluateAsync("matchMedia('(prefers-color-scheme: light)').matches"); // → false -await page.EvaluateAsync("matchMedia('(prefers-color-scheme: no-preference)').matches"); -// → false ``` ### option: Page.emulateMedia.media @@ -1281,16 +1272,16 @@ Passing `'Null'` disables CSS media emulation. * langs: js, java - `colorScheme` > -Emulates `'prefers-colors-scheme'` media feature, supported values are `'light'`, `'dark'`, `'no-preference'`. Passing -`null` disables color scheme emulation. +Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. Passing +`null` disables color scheme emulation. `'no-preference'` is deprecated. ### option: Page.emulateMedia.colorScheme * since: v1.9 * langs: csharp, python - `colorScheme` <[ColorScheme]<"light"|"dark"|"no-preference"|"null">> -Emulates `'prefers-colors-scheme'` media feature, supported values are `'light'`, `'dark'`, `'no-preference'`. Passing -`'Null'` disables color scheme emulation. +Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. Passing +`'Null'` disables color scheme emulation. `'no-preference'` is deprecated. ### option: Page.emulateMedia.reducedMotion * since: v1.12 diff --git a/docs/src/api/params.md b/docs/src/api/params.md index 462b225e6e..63693030bb 100644 --- a/docs/src/api/params.md +++ b/docs/src/api/params.md @@ -639,14 +639,14 @@ If no origin is specified, the username and password are sent to any servers upo * langs: js, java - `colorScheme` > -Emulates `'prefers-colors-scheme'` media feature, supported values are `'light'`, `'dark'`, `'no-preference'`. See +Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. See [`method: Page.emulateMedia`] for more details. Passing `null` resets emulation to system defaults. Defaults to `'light'`. ## context-option-colorscheme-csharp-python * langs: csharp, python - `colorScheme` <[ColorScheme]<"light"|"dark"|"no-preference"|"null">> -Emulates `'prefers-colors-scheme'` media feature, supported values are `'light'`, `'dark'`, `'no-preference'`. See +Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. See [`method: Page.emulateMedia`] for more details. Passing `'null'` resets emulation to system defaults. Defaults to `'light'`. ## context-option-reducedMotion diff --git a/docs/src/emulation.md b/docs/src/emulation.md index 12b44a49c8..fd0009f71c 100644 --- a/docs/src/emulation.md +++ b/docs/src/emulation.md @@ -558,7 +558,7 @@ await context.SetGeolocationAsync(new Geolocation() { Longitude = 48.858455, Lat **Note** you can only change geolocation for all pages in the context. ## Color Scheme and Media -Emulate the users `"colorScheme"`. Supported values are 'light', 'dark', 'no-preference'. You can also emulate the media type with [`method: Page.emulateMedia`]. +Emulate the users `"colorScheme"`. Supported values are 'light' and 'dark'. You can also emulate the media type with [`method: Page.emulateMedia`]. ```js title="playwright.config.ts" import { defineConfig } from '@playwright/test'; diff --git a/docs/src/test-use-options-js.md b/docs/src/test-use-options-js.md index c8c93c7cee..6e1da0a228 100644 --- a/docs/src/test-use-options-js.md +++ b/docs/src/test-use-options-js.md @@ -64,7 +64,7 @@ export default defineConfig({ | Option | Description | | :- | :- | -| [`property: TestOptions.colorScheme`] | [Emulates](./emulation.md#color-scheme-and-media) `'prefers-colors-scheme'` media feature, supported values are `'light'`, `'dark'`, `'no-preference'` | +| [`property: TestOptions.colorScheme`] | [Emulates](./emulation.md#color-scheme-and-media) `'prefers-colors-scheme'` media feature, supported values are `'light'` and `'dark'` | | [`property: TestOptions.geolocation`] | Context [geolocation](./emulation.md#geolocation). | | [`property: TestOptions.locale`] | [Emulates](./emulation.md#locale--timezone) the user locale, for example `en-GB`, `de-DE`, etc. | | [`property: TestOptions.permissions`] | A list of [permissions](./emulation.md#permissions) to grant to all pages in the context. | diff --git a/packages/playwright-core/types/types.d.ts b/packages/playwright-core/types/types.d.ts index 1f165c3d93..0ecdf93904 100644 --- a/packages/playwright-core/types/types.d.ts +++ b/packages/playwright-core/types/types.d.ts @@ -2553,16 +2553,15 @@ export interface Page { * // → true * await page.evaluate(() => matchMedia('(prefers-color-scheme: light)').matches); * // → false - * await page.evaluate(() => matchMedia('(prefers-color-scheme: no-preference)').matches); - * // → false * ``` * * @param options */ emulateMedia(options?: { /** - * Emulates `'prefers-colors-scheme'` media feature, supported values are `'light'`, `'dark'`, `'no-preference'`. - * Passing `null` disables color scheme emulation. + * Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) + * media feature, supported values are `'light'` and `'dark'`. Passing `null` disables color scheme emulation. + * `'no-preference'` is deprecated. */ colorScheme?: null|"light"|"dark"|"no-preference"; @@ -9761,7 +9760,8 @@ export interface Browser { }>; /** - * Emulates `'prefers-colors-scheme'` media feature, supported values are `'light'`, `'dark'`, `'no-preference'`. See + * Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) + * media feature, supported values are `'light'` and `'dark'`. See * [page.emulateMedia([options])](https://playwright.dev/docs/api/class-page#page-emulate-media) for more details. * Passing `null` resets emulation to system defaults. Defaults to `'light'`. */ @@ -14726,7 +14726,8 @@ export interface BrowserType { }>; /** - * Emulates `'prefers-colors-scheme'` media feature, supported values are `'light'`, `'dark'`, `'no-preference'`. See + * Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) + * media feature, supported values are `'light'` and `'dark'`. See * [page.emulateMedia([options])](https://playwright.dev/docs/api/class-page#page-emulate-media) for more details. * Passing `null` resets emulation to system defaults. Defaults to `'light'`. */ @@ -16522,7 +16523,8 @@ export interface AndroidDevice { bypassCSP?: boolean; /** - * Emulates `'prefers-colors-scheme'` media feature, supported values are `'light'`, `'dark'`, `'no-preference'`. See + * Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) + * media feature, supported values are `'light'` and `'dark'`. See * [page.emulateMedia([options])](https://playwright.dev/docs/api/class-page#page-emulate-media) for more details. * Passing `null` resets emulation to system defaults. Defaults to `'light'`. */ @@ -18998,7 +19000,8 @@ export interface Electron { bypassCSP?: boolean; /** - * Emulates `'prefers-colors-scheme'` media feature, supported values are `'light'`, `'dark'`, `'no-preference'`. See + * Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) + * media feature, supported values are `'light'` and `'dark'`. See * [page.emulateMedia([options])](https://playwright.dev/docs/api/class-page#page-emulate-media) for more details. * Passing `null` resets emulation to system defaults. Defaults to `'light'`. */ @@ -21820,7 +21823,8 @@ export interface BrowserContextOptions { }>; /** - * Emulates `'prefers-colors-scheme'` media feature, supported values are `'light'`, `'dark'`, `'no-preference'`. See + * Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) + * media feature, supported values are `'light'` and `'dark'`. See * [page.emulateMedia([options])](https://playwright.dev/docs/api/class-page#page-emulate-media) for more details. * Passing `null` resets emulation to system defaults. Defaults to `'light'`. */ diff --git a/packages/playwright/types/test.d.ts b/packages/playwright/types/test.d.ts index 400d7cbcf3..41c88940c9 100644 --- a/packages/playwright/types/test.d.ts +++ b/packages/playwright/types/test.d.ts @@ -5225,7 +5225,8 @@ export interface PlaywrightTestOptions { */ bypassCSP: boolean; /** - * Emulates `'prefers-colors-scheme'` media feature, supported values are `'light'`, `'dark'`, `'no-preference'`. See + * Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) + * media feature, supported values are `'light'` and `'dark'`. See * [page.emulateMedia([options])](https://playwright.dev/docs/api/class-page#page-emulate-media) for more details. * Passing `null` resets emulation to system defaults. Defaults to `'light'`. *