microsoft/playwright
1
1
Fork 0
mirror of https://github.com/microsoft/playwright.git synced 2024-12-15 06:02:57 +03:00
Code Issues Projects Releases Wiki Activity

docs: more clarity in the attribute selectors (#5621)

Browse Source 
Fixes #5615
This commit is contained in:
Andrey Lushnikov 2021-02-25 10:42:52 -08:00 committed by GitHub
parent f7e5db4d6e
commit b285936721
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 36 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
docs/src/selectors.md
View File

@ -449,7 +449,42 @@ converts `'//html/body'` to `'xpath=//html/body'`.
## id, data-testid, data-test-id, data-test selectors
Attribute engines are selecting based on the corresponding attribute value. For example: `data-test-id=foo` is equivalent to `css=[data-test-id="foo"]`, and `id:light=foo` is equivalent to `css:light=[id="foo"]`.
Playwright supports a shorthand for selecting elements using certain elements. Currently, only
the following attributes are supported:
- `id`
- `data-testid`
- `data-test-id`
- `data-test`
```js
// Fill an input with the id "username"
await page.fill('id=username', 'value');
// Click an element with data-test-id "submit"
await page.click('data-test-id=submit');
```
```python async
# Fill an input with the id "username"
await page.fill('id=username', 'value')
# Click an element with data-test-id "submit"
await page.click('data-test-id=submit')
```
```python sync
# Fill an input with the id "username"
page.fill('id=username', 'value')
# Click an element with data-test-id "submit"
page.click('data-test-id=submit')
```
:::note
Attribute selectors piece shadow DOM. To opt-out from this behavior, use `:light` suffix after attribute, for example `page.click('data-test-id:light=submit')
:::
## Pick n-th match from the query result