docs: fix typos (#1947)

This commit is contained in:
Pavel Feldman 2020-04-23 13:40:34 -07:00 committed by GitHub
parent dc23c567c4
commit 40bed0f50c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 9 additions and 9 deletions

View file

@ -58,5 +58,5 @@
- Storybooks - Storybooks
1. [Extensibility](./extensibility.md) 1. [Extensibility](./extensibility.md)
- [Custom selector engines](./extensibility.md#custom-selector-engines) - [Custom selector engines](./extensibility.md#custom-selector-engines)
1. [Managing browser binaries](./browsers.md) 1. [Installation](./installation.md)
1. [API Reference](./api.md) 1. [API Reference](./api.md)

View file

@ -266,7 +266,7 @@ Playwright's [`ElementHandle`](./api.md#class-elementhandle) extends
Handles Lifetime: Handles Lifetime:
- Handles can we be acquired using the page methods [`page.evaluteHandle`](./api.md#pageevaluatehandlepagefunction-arg), [`page.$`](./api.md#pageselector) or [`page.$$`](./api.md#pageselector-1) or - Handles can we be acquired using the page methods [`page.evaluteHandle`](./api.md#pageevaluatehandlepagefunction-arg), [`page.$`](./api.md#pageselector) or [`page.$$`](./api.md#pageselector-1) or
their frame counterparts [`frame.evaluateHandle`](./api.md#frameevaluatehandlepagefunction-arg), [`frame.$`](./api.md#frameselector) or [`frame.$$`](./api.md#frameselector-1). their frame counterparts [`frame.evaluateHandle`](./api.md#frameevaluatehandlepagefunction-arg), [`frame.$`](./api.md#frameselector) or [`frame.$$`](./api.md#frameselector-1).
- Once created, handles will retain object from [grabage collection](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Memory_Management) - Once created, handles will retain object from [garbage collection](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Memory_Management)
- Handles will be **automatically disposed** once the page or frame they belong to navigates or closes. - Handles will be **automatically disposed** once the page or frame they belong to navigates or closes.
- Handles can be **manually disposed** using [`jsHandle.dispose`](./api.md#jshandledispose) method. - Handles can be **manually disposed** using [`jsHandle.dispose`](./api.md#jshandledispose) method.

View file

@ -14,7 +14,7 @@ Selector engine should have the following properties:
- `query` function to query first element matching `selector` relative to the `root`. - `query` function to query first element matching `selector` relative to the `root`.
- `queryAll` function to query all elements matching `selector` relative to the `root`. - `queryAll` function to query all elements matching `selector` relative to the `root`.
By default the engine is run directly in the frame's JavaScript context and, for example, can call an application-defined function. To isolate the engine from any JavaScript in the frame, but leave access to the DOM, resgister the engine with `{contentScript: true}` option. Content script engine is safer because it is protected from any tampering with the global objects, for example altering `Node.prototype` methods. All built-in selector engines run as content scripts. Note that running as a content script is not guaranteed when the engine is used together with other custom engines. By default the engine is run directly in the frame's JavaScript context and, for example, can call an application-defined function. To isolate the engine from any JavaScript in the frame, but leave access to the DOM, register the engine with `{contentScript: true}` option. Content script engine is safer because it is protected from any tampering with the global objects, for example altering `Node.prototype` methods. All built-in selector engines run as content scripts. Note that running as a content script is not guaranteed when the engine is used together with other custom engines.
An example of registering selector engine that queries elements based on a tag name: An example of registering selector engine that queries elements based on a tag name:
```js ```js

View file

@ -197,7 +197,7 @@ ArrowUp, F1 - F12, Digit0 - Digit9, KeyA - KeyZ, etc.
- You can alternatively specify a single character you'd like to produce such as `"a"` or `"#"`. - You can alternatively specify a single character you'd like to produce such as `"a"` or `"#"`.
- Following modification shortcuts are also suported: `Shift, Control, Alt, Meta`. - Following modification shortcuts are also supported: `Shift, Control, Alt, Meta`.
#### Variations #### Variations

View file

@ -82,7 +82,7 @@ Using these packages is as easy as using a regular Playwright:
$ npm i playwright-webkit $ npm i playwright-webkit
``` ```
2. Requre package 2. Require package
```js ```js
// Notice a proper package name in require // Notice a proper package name in require

View file

@ -6,7 +6,7 @@ Playwright is a cross-browser automation driver for end-to-end testing. Playwrig
The Playwright API is cross-browser: it works across **Chromium** (used in Chrome, Edge, and many other browsers), **Firefox** and **WebKit** (used in Safari) engines. The Playwright API is cross-browser: it works across **Chromium** (used in Chrome, Edge, and many other browsers), **Firefox** and **WebKit** (used in Safari) engines.
Playwright is free and open source. Playwright is also modular, and work with any JavaScript test runner framework. Playwright is free and open source. Playwright is also modular, and works with any JavaScript test runner framework.
### Capabilities ### Capabilities

View file

@ -8,7 +8,7 @@ Selector can be used to obtain `ElementHandle` (see [page.$()](api.md#pageselect
Selector is a string that consists of one or more clauses separated by `>>` token, e.g. `clause1 >> clause2 >> clause3`. When multiple clauses are present, next one is queried relative to the previous one's result. Selector is a string that consists of one or more clauses separated by `>>` token, e.g. `clause1 >> clause2 >> clause3`. When multiple clauses are present, next one is queried relative to the previous one's result.
Each clause contains a selector engine name and selector body, e.g. `engine=body`. Here `engine` is one of the supported engines (e.g. `css` or a custom one). Selector `body` follows the format of the particular engine, e.g. for `css` engine it should be a [css selector](https://developer.mozilla.org/en/docs/Web/CSS/CSS_Selectors). Body format is assumed to ignore leading and trailing whitespaces, so that extra whitespace can be added for readability. If selector engine needs to include `>>` in the body, it should be escaped inside a string to not be confused with clause separator, e.g. `text="some >> text"`. Each clause contains a selector engine name and selector body, e.g. `engine=body`. Here `engine` is one of the supported engines (e.g. `css` or a custom one). Selector `body` follows the format of the particular engine, e.g. for `css` engine it should be a [css selector](https://developer.mozilla.org/en/docs/Web/CSS/CSS_Selectors). Body format is assumed to ignore leading and trailing white spaces, so that extra whitespace can be added for readability. If selector engine needs to include `>>` in the body, it should be escaped inside a string to not be confused with clause separator, e.g. `text="some >> text"`.
For example, For example,
``` ```
@ -61,7 +61,7 @@ const handle = await divHandle.$('css=span');
`css` is a default engine - any malformed selector not starting with `//` nor with `"` is assumed to be a css selector. For example, Playwright converts `page.$('span > button')` to `page.$('css=span > button')`. `css` is a default engine - any malformed selector not starting with `//` nor with `"` is assumed to be a css selector. For example, Playwright converts `page.$('span > button')` to `page.$('css=span > button')`.
`css:light` engine is equivalent to [`Document.querySelector`](https://developer.mozilla.org/en/docs/Web/API/Document/querySelector) and behaves according to the CSS spec. However, it does not pierce shadow roots, which may be incovenient when working with [Shadow DOM and Web Components](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM). For that reason, `css` engine pierces shadow roots. More specifically, every [Descendant combinator](https://developer.mozilla.org/en-US/docs/Web/CSS/Descendant_combinator) pierces an arbitrary number of open shadow roots, including the implicit descendant combinator at the start of the selector. `css:light` engine is equivalent to [`Document.querySelector`](https://developer.mozilla.org/en/docs/Web/API/Document/querySelector) and behaves according to the CSS spec. However, it does not pierce shadow roots, which may be inconvenient when working with [Shadow DOM and Web Components](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM). For that reason, `css` engine pierces shadow roots. More specifically, every [Descendant combinator](https://developer.mozilla.org/en-US/docs/Web/CSS/Descendant_combinator) pierces an arbitrary number of open shadow roots, including the implicit descendant combinator at the start of the selector.
`css` engine first searches for elements in the light dom in the iteration order, and then recursively inside open shadow roots in the iteration order. It does not search inside closed shadow roots or iframes. `css` engine first searches for elements in the light dom in the iteration order, and then recursively inside open shadow roots in the iteration order. It does not search inside closed shadow roots or iframes.
@ -119,4 +119,4 @@ Malformed selector starting with `"` is assumed to be a text selector. For examp
### id, data-testid, data-test-id, data-test and their :light counterparts ### id, data-testid, data-test-id, data-test and their :light counterparts
Attribute engines are selecting based on the corresponding atrribute 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"]`. 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"]`.