docs: migrate to newer :::warning syntax (#30089)

- Migrate from `:::warning` to `:::danger[Warning]`.
- Migrate from `:::caution` to `:::warning`.
- `:::warning` and `:::caution` were the color same before.
- `:::caution` is deprecated and gets removed in v4 of Docusaurus
- Also migrate to the [newer title
syntax](3877c1254f/packages/docusaurus-utils/src/markdownUtils.ts (L86-L91))

---------

Signed-off-by: Max Schmitt <max@schmitt.mx>
Co-authored-by: Dmitry Gozman <dgozman@gmail.com>
This commit is contained in:
Max Schmitt 2024-03-25 19:22:15 +01:00 committed by GitHub
parent 032f27ff84
commit f5823786fd
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
8 changed files with 36 additions and 40 deletions

View File

@ -14,7 +14,7 @@ A few examples of problems this can catch include:
The following examples rely on the [`@axe-core/playwright`](https://npmjs.org/@axe-core/playwright) package which adds support for running the [axe accessibility testing engine](https://www.deque.com/axe/) as part of your Playwright tests. The following examples rely on the [`@axe-core/playwright`](https://npmjs.org/@axe-core/playwright) package which adds support for running the [axe accessibility testing engine](https://www.deque.com/axe/) as part of your Playwright tests.
:::note Disclaimer :::note[Disclaimer]
Automated accessibility tests can detect some common accessibility problems such as missing or invalid properties. But many accessibility problems can only be discovered through manual testing. We recommend using a combination of automated testing, manual accessibility assessments, and inclusive user testing. Automated accessibility tests can detect some common accessibility problems such as missing or invalid properties. But many accessibility problems can only be discovered through manual testing. We recommend using a combination of automated testing, manual accessibility assessments, and inclusive user testing.
For manual assessments, we recommend [Accessibility Insights for Web](https://accessibilityinsights.io/docs/web/overview/?referrer=playwright-accessibility-testing-js), a free and open source dev tool that walks you through assessing a website for [WCAG 2.1 AA](https://www.w3.org/WAI/WCAG21/quickref/?currentsidebar=%23col_customize&levels=aaa) coverage. For manual assessments, we recommend [Accessibility Insights for Web](https://accessibilityinsights.io/docs/web/overview/?referrer=playwright-accessibility-testing-js), a free and open source dev tool that walks you through assessing a website for [WCAG 2.1 AA](https://www.w3.org/WAI/WCAG21/quickref/?currentsidebar=%23col_customize&levels=aaa) coverage.

View File

@ -4,7 +4,7 @@
ElementHandle represents an in-page DOM element. ElementHandles can be created with the [`method: Page.querySelector`] method. ElementHandle represents an in-page DOM element. ElementHandles can be created with the [`method: Page.querySelector`] method.
:::caution Discouraged :::warning[Discouraged]
The use of ElementHandle is discouraged, use [Locator] objects and web-first assertions instead. The use of ElementHandle is discouraged, use [Locator] objects and web-first assertions instead.
::: :::

View File

@ -53,7 +53,7 @@ foreach (var li in await page.GetByRole("listitem").AllAsync())
Returns an array of `node.innerText` values for all matching nodes. Returns an array of `node.innerText` values for all matching nodes.
:::caution Asserting text :::warning[Asserting text]
If you need to assert text on the page, prefer [`method: LocatorAssertions.toHaveText`] with [`option: useInnerText`] option to avoid flakiness. See [assertions guide](../test-assertions.md) for more details. If you need to assert text on the page, prefer [`method: LocatorAssertions.toHaveText`] with [`option: useInnerText`] option to avoid flakiness. See [assertions guide](../test-assertions.md) for more details.
::: :::
@ -85,7 +85,7 @@ var texts = await page.GetByRole(AriaRole.Link).AllInnerTextsAsync();
Returns an array of `node.textContent` values for all matching nodes. Returns an array of `node.textContent` values for all matching nodes.
:::caution Asserting text :::warning[Asserting text]
If you need to assert text on the page, prefer [`method: LocatorAssertions.toHaveText`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details. If you need to assert text on the page, prefer [`method: LocatorAssertions.toHaveText`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details.
::: :::
@ -443,7 +443,7 @@ await page.Locator("canvas").ClickAsync(new() {
Returns the number of elements matching the locator. Returns the number of elements matching the locator.
:::caution Asserting count :::warning[Asserting count]
If you need to assert the number of elements on the page, prefer [`method: LocatorAssertions.toHaveCount`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details. If you need to assert the number of elements on the page, prefer [`method: LocatorAssertions.toHaveCount`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details.
::: :::
@ -1121,7 +1121,7 @@ await locator.ClickAsync();
Returns the matching element's attribute value. Returns the matching element's attribute value.
:::caution Asserting attributes :::warning[Asserting attributes]
If you need to assert an element's attribute, prefer [`method: LocatorAssertions.toHaveAttribute`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details. If you need to assert an element's attribute, prefer [`method: LocatorAssertions.toHaveAttribute`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details.
::: :::
@ -1293,7 +1293,7 @@ Returns the [`element.innerHTML`](https://developer.mozilla.org/en-US/docs/Web/A
Returns the [`element.innerText`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/innerText). Returns the [`element.innerText`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/innerText).
:::caution Asserting text :::warning[Asserting text]
If you need to assert text on the page, prefer [`method: LocatorAssertions.toHaveText`] with [`option: useInnerText`] option to avoid flakiness. See [assertions guide](../test-assertions.md) for more details. If you need to assert text on the page, prefer [`method: LocatorAssertions.toHaveText`] with [`option: useInnerText`] option to avoid flakiness. See [assertions guide](../test-assertions.md) for more details.
::: :::
@ -1309,7 +1309,7 @@ If you need to assert text on the page, prefer [`method: LocatorAssertions.toHav
Returns the value for the matching `<input>` or `<textarea>` or `<select>` element. Returns the value for the matching `<input>` or `<textarea>` or `<select>` element.
:::caution Asserting value :::warning[Asserting value]
If you need to assert input value, prefer [`method: LocatorAssertions.toHaveValue`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details. If you need to assert input value, prefer [`method: LocatorAssertions.toHaveValue`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details.
::: :::
@ -1351,7 +1351,7 @@ Throws elements that are not an input, textarea or a select. However, if the ele
Returns whether the element is checked. Throws if the element is not a checkbox or radio input. Returns whether the element is checked. Throws if the element is not a checkbox or radio input.
:::caution Asserting checked state :::warning[Asserting checked state]
If you need to assert that checkbox is checked, prefer [`method: LocatorAssertions.toBeChecked`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details. If you need to assert that checkbox is checked, prefer [`method: LocatorAssertions.toBeChecked`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details.
::: :::
@ -1389,7 +1389,7 @@ var isChecked = await page.GetByRole(AriaRole.Checkbox).IsCheckedAsync();
Returns whether the element is disabled, the opposite of [enabled](../actionability.md#enabled). Returns whether the element is disabled, the opposite of [enabled](../actionability.md#enabled).
:::caution Asserting disabled state :::warning[Asserting disabled state]
If you need to assert that an element is disabled, prefer [`method: LocatorAssertions.toBeDisabled`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details. If you need to assert that an element is disabled, prefer [`method: LocatorAssertions.toBeDisabled`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details.
::: :::
@ -1427,7 +1427,7 @@ Boolean disabled = await page.GetByRole(AriaRole.Button).IsDisabledAsync();
Returns whether the element is [editable](../actionability.md#editable). Returns whether the element is [editable](../actionability.md#editable).
:::caution Asserting editable state :::warning[Asserting editable state]
If you need to assert that an element is editable, prefer [`method: LocatorAssertions.toBeEditable`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details. If you need to assert that an element is editable, prefer [`method: LocatorAssertions.toBeEditable`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details.
::: :::
@ -1465,7 +1465,7 @@ Boolean editable = await page.GetByRole(AriaRole.Textbox).IsEditableAsync();
Returns whether the element is [enabled](../actionability.md#enabled). Returns whether the element is [enabled](../actionability.md#enabled).
:::caution Asserting enabled state :::warning[Asserting enabled state]
If you need to assert that an element is enabled, prefer [`method: LocatorAssertions.toBeEnabled`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details. If you need to assert that an element is enabled, prefer [`method: LocatorAssertions.toBeEnabled`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details.
::: :::
@ -1503,7 +1503,7 @@ Boolean enabled = await page.GetByRole(AriaRole.Button).IsEnabledAsync();
Returns whether the element is hidden, the opposite of [visible](../actionability.md#visible). Returns whether the element is hidden, the opposite of [visible](../actionability.md#visible).
:::caution Asserting visibility :::warning[Asserting visibility]
If you need to assert that element is hidden, prefer [`method: LocatorAssertions.toBeHidden`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details. If you need to assert that element is hidden, prefer [`method: LocatorAssertions.toBeHidden`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details.
::: :::
@ -1540,7 +1540,7 @@ Boolean hidden = await page.GetByRole(AriaRole.Button).IsHiddenAsync();
Returns whether the element is [visible](../actionability.md#visible). Returns whether the element is [visible](../actionability.md#visible).
:::caution Asserting visibility :::warning[Asserting visibility]
If you need to assert that element is visible, prefer [`method: LocatorAssertions.toBeVisible`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details. If you need to assert that element is visible, prefer [`method: LocatorAssertions.toBeVisible`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details.
::: :::
@ -2324,7 +2324,7 @@ When all steps combined have not finished during the specified [`option: timeout
Returns the [`node.textContent`](https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent). Returns the [`node.textContent`](https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent).
:::caution Asserting text :::warning[Asserting text]
If you need to assert text on the page, prefer [`method: LocatorAssertions.toHaveText`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details. If you need to assert text on the page, prefer [`method: LocatorAssertions.toHaveText`] to avoid flakiness. See [assertions guide](../test-assertions.md) for more details.
::: :::

View File

@ -3146,7 +3146,7 @@ return value resolves to `[]`.
## async method: Page.addLocatorHandler ## async method: Page.addLocatorHandler
* since: v1.42 * since: v1.42
:::warning Experimental :::warning[Experimental]
This method is experimental and its behavior may change in the upcoming releases. This method is experimental and its behavior may change in the upcoming releases.
::: :::

View File

@ -999,11 +999,10 @@ disable timeout.
If specified, traces are saved into this directory. If specified, traces are saved into this directory.
## browser-option-devtools ## browser-option-devtools
* deprecated: Use [debugging tools](../debug.md) instead.
- `devtools` <[boolean]> - `devtools` <[boolean]>
**Deprecated, Chromium-only.** Use [debugging tools](../debug.md) instead. **Chromium-only** Whether to auto-open a Developer Tools panel for each tab. If this option is `true`, the
Whether to auto-open a Developer Tools panel for each tab. If this option is `true`, the
[`option: headless`] option will be set `false`. [`option: headless`] option will be set `false`.
## browser-option-slowmo ## browser-option-slowmo

View File

@ -52,7 +52,7 @@ var jsHandle = await page.EvaluateHandleAsync("window");
## Element Handles ## Element Handles
:::caution Discouraged :::warning[Discouraged]
The use of [ElementHandle] is discouraged, use [Locator] objects and web-first assertions instead. The use of [ElementHandle] is discouraged, use [Locator] objects and web-first assertions instead.
::: :::

View File

@ -264,7 +264,7 @@ Role locators include [buttons, checkboxes, headings, links, lists, tables, and
Note that role locators **do not replace** accessibility audits and conformance tests, but rather give early feedback about the ARIA guidelines. Note that role locators **do not replace** accessibility audits and conformance tests, but rather give early feedback about the ARIA guidelines.
:::note When to use role locators :::note[When to use role locators]
We recommend prioritizing role locators to locate elements, as it is the closest way to how users and assistive technology perceive the page. We recommend prioritizing role locators to locate elements, as it is the closest way to how users and assistive technology perceive the page.
::: :::
@ -301,7 +301,7 @@ page.get_by_label("Password").fill("secret")
await page.GetByLabel("Password").FillAsync("secret"); await page.GetByLabel("Password").FillAsync("secret");
``` ```
:::note When to use label locators :::note[When to use label locators]
Use this locator when locating form fields. Use this locator when locating form fields.
::: :::
### Locate by placeholder ### Locate by placeholder
@ -340,7 +340,7 @@ await page
.FillAsync("playwright@microsoft.com"); .FillAsync("playwright@microsoft.com");
``` ```
:::note When to use placeholder locators :::note[When to use placeholder locators]
Use this locator when locating form elements that do not have labels but do have placeholder texts. Use this locator when locating form elements that do not have labels but do have placeholder texts.
::: :::
@ -433,7 +433,7 @@ await Expect(Page
Matching by text always normalizes whitespace, even with exact match. For example, it turns multiple spaces into one, turns line breaks into spaces and ignores leading and trailing whitespace. Matching by text always normalizes whitespace, even with exact match. For example, it turns multiple spaces into one, turns line breaks into spaces and ignores leading and trailing whitespace.
::: :::
:::note When to use text locators :::note[When to use text locators]
We recommend using text locators to find non interactive elements like `div`, `span`, `p`, etc. For interactive elements like `button`, `a`, `input`, etc. use [role locators](#locate-by-role). We recommend using text locators to find non interactive elements like `div`, `span`, `p`, etc. For interactive elements like `button`, `a`, `input`, etc. use [role locators](#locate-by-role).
::: :::
@ -471,7 +471,7 @@ page.get_by_alt_text("playwright logo").click()
await page.GetByAltText("playwright logo").ClickAsync(); await page.GetByAltText("playwright logo").ClickAsync();
``` ```
:::note When to use alt locators :::note[When to use alt locators]
Use this locator when your element supports alt text such as `img` and `area` elements. Use this locator when your element supports alt text such as `img` and `area` elements.
::: :::
@ -507,7 +507,7 @@ expect(page.get_by_title("Issues count")).to_have_text("25 issues")
await Expect(Page.GetByTitle("Issues count")).toHaveText("25 issues"); await Expect(Page.GetByTitle("Issues count")).toHaveText("25 issues");
``` ```
:::note When to use title locators :::note[When to use title locators]
Use this locator when your element has the `title` attribute. Use this locator when your element has the `title` attribute.
::: :::
@ -543,7 +543,7 @@ page.get_by_test_id("directions").click()
await page.GetByTestId("directions").ClickAsync(); await page.GetByTestId("directions").ClickAsync();
``` ```
:::note When to use testid locators :::note[When to use testid locators]
You can also use test ids when you choose to use the test id methodology or when you can't locate by [role](#locate-by-role) or [text](#locate-by-text). You can also use test ids when you choose to use the test id methodology or when you can't locate by [role](#locate-by-role) or [text](#locate-by-text).
::: :::
@ -693,7 +693,7 @@ await page.Locator("#tsf > div:nth-child(2) > div.A8SBwf > div.RNNXgb > div > di
await page.Locator("//*[@id='tsf']/div[2]/div[1]/div[1]/div/div[2]/input").ClickAsync(); await page.Locator("//*[@id='tsf']/div[2]/div[1]/div[1]/div/div[2]/input").ClickAsync();
``` ```
:::note When to use this :::note[When to use this]
CSS and XPath are not recommended as the DOM can often change leading to non resilient tests. Instead, try to come up with a locator that is close to how the user perceives the page such as [role locators](#locate-by-role) or [define an explicit testing contract](#locate-by-test-id) using test ids. CSS and XPath are not recommended as the DOM can often change leading to non resilient tests. Instead, try to come up with a locator that is close to how the user perceives the page such as [role locators](#locate-by-role) or [define an explicit testing contract](#locate-by-test-id) using test ids.
::: :::

View File

@ -13173,10 +13173,9 @@ export interface BrowserType<Unused = {}> {
deviceScaleFactor?: number; deviceScaleFactor?: number;
/** /**
* **Deprecated, Chromium-only.** Use [debugging tools](https://playwright.dev/docs/debug) instead. * **Chromium-only** Whether to auto-open a Developer Tools panel for each tab. If this option is `true`, the
* * `headless` option will be set `false`.
* Whether to auto-open a Developer Tools panel for each tab. If this option is `true`, the `headless` option will be * @deprecated Use [debugging tools](https://playwright.dev/docs/debug) instead.
* set `false`.
*/ */
devtools?: boolean; devtools?: boolean;
@ -13579,10 +13578,9 @@ export interface BrowserType<Unused = {}> {
chromiumSandbox?: boolean; chromiumSandbox?: boolean;
/** /**
* **Deprecated, Chromium-only.** Use [debugging tools](https://playwright.dev/docs/debug) instead. * **Chromium-only** Whether to auto-open a Developer Tools panel for each tab. If this option is `true`, the
* * `headless` option will be set `false`.
* Whether to auto-open a Developer Tools panel for each tab. If this option is `true`, the `headless` option will be * @deprecated Use [debugging tools](https://playwright.dev/docs/debug) instead.
* set `false`.
*/ */
devtools?: boolean; devtools?: boolean;
@ -20278,10 +20276,9 @@ export interface LaunchOptions {
chromiumSandbox?: boolean; chromiumSandbox?: boolean;
/** /**
* **Deprecated, Chromium-only.** Use [debugging tools](https://playwright.dev/docs/debug) instead. * **Chromium-only** Whether to auto-open a Developer Tools panel for each tab. If this option is `true`, the
* * `headless` option will be set `false`.
* Whether to auto-open a Developer Tools panel for each tab. If this option is `true`, the `headless` option will be * @deprecated Use [debugging tools](https://playwright.dev/docs/debug) instead.
* set `false`.
*/ */
devtools?: boolean; devtools?: boolean;