docs: fix typos in docs (#16370)

Co-authored-by: Debbie O'Brien <debs-obrien@users.noreply.github.com>
Co-authored-by: Max Schmitt <max@schmitt.mx>

docs/src/api/class-apirequestcontext.md

@@ -10,13 +10,13 @@ It is also possible to create a new APIRequestContext instance manually by calli
 
 **Cookie management**
 
-[APIRequestContext] retuned by [`property: BrowserContext.request`] and [`property: Page.request`] shares cookie
+[APIRequestContext] returned by [`property: BrowserContext.request`] and [`property: Page.request`] shares cookie
 storage with the corresponding [BrowserContext]. Each API request will have `Cookie` header populated with the
 values from the browser context. If the API response contains `Set-Cookie` header it will automatically update
 [BrowserContext] cookies and requests made from the page will pick them up. This means that if you log in using
 this API, your e2e test will be logged in and vice versa.
 
-If you want API requests to not interfere with the browser cookies you shoud create a new [APIRequestContext] by
+If you want API requests to not interfere with the browser cookies you should create a new [APIRequestContext] by
 calling [`method: APIRequest.newContext`]. Such `APIRequestContext` object will have its own isolated cookie
 storage.
 
@@ -32,7 +32,7 @@ API_TOKEN = os.getenv("GITHUB_API_TOKEN")
 async def run(playwright: Playwright):
     # This will launch a new browser, create a context and page. When making HTTP
     # requests with the internal APIRequestContext (e.g. `context.request` or `page.request`)
-    # it will automatically set the cookies to the browser page and vise versa.
+    # it will automatically set the cookies to the browser page and vice versa.
     browser = await playwright.chromium.launch()
     context = await browser.new_context(base_url="https://api.github.com")
     api_request_context = context.request
@@ -84,7 +84,7 @@ API_TOKEN = os.getenv("GITHUB_API_TOKEN")
 with sync_playwright() as p:
     # This will launch a new browser, create a context and page. When making HTTP
     # requests with the internal APIRequestContext (e.g. `context.request` or `page.request`)
-    # it will automatically set the cookies to the browser page and vise versa.
+    # it will automatically set the cookies to the browser page and vice versa.
     browser = p.chromium.launch()
     context = browser.new_context(base_url="https://api.github.com")
     api_request_context = context.request

docs/src/api/class-browser.md

@@ -169,7 +169,7 @@ Returns the newly created browser session.
 Creates a new browser context. It won't share cookies/cache with other browser contexts.
 
 :::note
-If directly using this method to create [BrowserContext]s, it is best practice to explicilty close the returned context via [`method: BrowserContext.close`] when your code is done with the [BrowserContext],
+If directly using this method to create [BrowserContext]s, it is best practice to explicitly close the returned context via [`method: BrowserContext.close`] when your code is done with the [BrowserContext],
 and before calling [`method: Browser.close`]. This will ensure the `context` is closed gracefully and any artifacts—like HARs and videos—are fully flushed and saved.
 :::
 
@@ -196,7 +196,7 @@ BrowserContext context = browser.newContext();
 Page page = context.newPage();
 page.navigate('https://example.com');
 
-// Gracefull close up everything
+// Graceful close up everything
 context.close();
 browser.close();
 ```

docs/src/api/class-playwrightassertions.md

@@ -147,7 +147,7 @@ await Expect(page).ToHaveTitleAsync("News");
 * since: v1.25
 * langs: java
 
-Changes default timeout for Playwright assertions from 5 seconds to the speicified value.
+Changes default timeout for Playwright assertions from 5 seconds to the specified value.
 
 ```java
 PlaywrightAssertions.setDefaultAssertionTimeout(30_000);

docs/src/api/class-response.md

@@ -31,7 +31,7 @@ Returns the [Frame] that initiated this response.
 * since: v1.23
 - returns: <[boolean]>
 
-Indicates whether this Response was fullfilled by a Service Worker's Fetch Handler (i.e. via [FetchEvent.respondWith](https://developer.mozilla.org/en-US/docs/Web/API/FetchEvent/respondWith)).
+Indicates whether this Response was fulfilled by a Service Worker's Fetch Handler (i.e. via [FetchEvent.respondWith](https://developer.mozilla.org/en-US/docs/Web/API/FetchEvent/respondWith)).
 
 ## method: Response.headers
 * since: v1.8

docs/src/api/params.md

@@ -1008,7 +1008,7 @@ Specify screenshot type, defaults to `png`.
 ## screenshot-option-mask
 - `mask` <[Array]<[Locator]>>
 
-Specify locators that should be masked when the screenshot is taken. Masked elements will be overlayed with
+Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with
 a pink box `#FF00FF` that completely covers its bounding box.
 
 ## screenshot-option-full-page

docs/src/ci.md

@@ -256,7 +256,7 @@ steps:
 #### Sharding
 * langs: js
 
-GitHub Actions supports [sharding tests between multiple jobs](https://docs.github.com/en/actions/using-jobs/using-a-matrix-for-your-jobs) using the [`jobs.<job_id>.strategy.matrix`](https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#jobsjob_idstrategymatrix) option. The `matrix` option will run a seperate job for every possible combination of the provided options. In the example below, we have 2 `project` values, 10 `shardIndex` values and 1 `shardTotal` value, resulting in a total of 20 jobs to be run.
+GitHub Actions supports [sharding tests between multiple jobs](https://docs.github.com/en/actions/using-jobs/using-a-matrix-for-your-jobs) using the [`jobs.<job_id>.strategy.matrix`](https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#jobsjob_idstrategymatrix) option. The `matrix` option will run a separate job for every possible combination of the provided options. In the example below, we have 2 `project` values, 10 `shardIndex` values and 1 `shardTotal` value, resulting in a total of 20 jobs to be run.
 
 ```yml js
 steps:

docs/src/debug-selectors.md

@@ -74,7 +74,7 @@ Query Playwright element using the actual Playwright query engine, for example:
 Highlight the first occurrence of the locator:
 
 ```txt
-> playwright.hightlight('.auth-form');
+> playwright.highlight('.auth-form');
 ```
 
 ### playwright.clear()

docs/src/mock-js.md

@@ -111,7 +111,7 @@ would. The following test demonstrates how to achieve that:
 ```js
 test('update battery status (no golden)', async ({ page }) => {
   await page.addInitScript(() => {
-    // Mock class that will notify corresponding listners when battery status changes.
+    // Mock class that will notify corresponding listeners when battery status changes.
     class BatteryMock {
       level = 0.10;
       charging = false;

docs/src/service-workers-experimental-network-events-js.md

@@ -129,15 +129,15 @@ page.evaluate(
 
 Any network request made by the **Service Worker** will have:
 
-* [`event: BrowserContext.request`] and its correponding events ([`event: BrowserContext.requestFinished`] and [`event: BrowserContext.response`], or [`event: BrowserContext.requestFailed`])
+* [`event: BrowserContext.request`] and its corresponding events ([`event: BrowserContext.requestFinished`] and [`event: BrowserContext.response`], or [`event: BrowserContext.requestFailed`])
 * [`method: BrowserContext.route`] will see the request
 * [`method: Request.serviceWorker`] will be set to the Service [Worker] instance, and [`method: Request.frame`] will **throw**
 * [`method: Response.fromServiceWorker`] will return `false`
 
 Additionally, any network request made by the **Page** (including its sub-[Frame]s) will have:
 
-* [`event: BrowserContext.request`] and its correponding events ([`event: BrowserContext.requestFinished`] and [`event: BrowserContext.response`], or [`event: BrowserContext.requestFailed`])
+* [`event: BrowserContext.request`] and its corresponding events ([`event: BrowserContext.requestFinished`] and [`event: BrowserContext.response`], or [`event: BrowserContext.requestFailed`])
-* [`event: Page.request`] and its correponding events ([`event: Page.requestFinished`] and [`event: Page.response`], or [`event: Page.requestFailed`])
+* [`event: Page.request`] and its corresponding events ([`event: Page.requestFinished`] and [`event: Page.response`], or [`event: Page.requestFailed`])
 * [`method: Page.route`] and [`method: Page.route`] will **not** see the request (if a Service Worker's fetch handler was registered)
 * [`method: Request.serviceWorker`] will be set to `null`, and [`method: Request.frame`] will return the [Frame]
 * [`method: Response.fromServiceWorker`] will return `true` (if a Service Worker's fetch handler was registered)
@@ -192,7 +192,7 @@ It's important to note: calling [`method: Request.frame`] or [`method: Response.
 
 #### Advanced Example
 
-When a Service Worker handles a page's request, the Service Worker can make 0 to n requests to the external network. The Service Worker might respond directly from a cache, generate a reponse in memory, rewrite the request, make two requests and then combine into 1, etc.
+When a Service Worker handles a page's request, the Service Worker can make 0 to n requests to the external network. The Service Worker might respond directly from a cache, generate a response in memory, rewrite the request, make two requests and then combine into 1, etc.
 
 Consider the code snippets below to understand Playwright's view into the Request/Responses and how it impacts routing in some of these cases.
 
@@ -319,7 +319,7 @@ The following Request/Response events would be emitted:
 It's important to note:
 
 * The page requested `/foo`, but the Service Worker requested `/bar`, so there are only [Frame]-owned events for `/foo`, but not `/bar`.
-* Likewise, the Service Worker never hit the network for `tracker.js`, so ony [Frame]-owned events were emitted for that request.
+* Likewise, the Service Worker never hit the network for `tracker.js`, so only [Frame]-owned events were emitted for that request.
 
 ## Routing Service Worker Requests Only
 

docs/src/test-api/class-test.md

@@ -353,7 +353,7 @@ test('runs second', async ({ page }) => {});
 ## method: Test.describe.fixme
 * since: v1.25
 
-Declares a test group similarly to [`method: Test.describe#1`]. Tests in this group are maked as "fixme" and will not be executed.
+Declares a test group similarly to [`method: Test.describe#1`]. Tests in this group are marked as "fixme" and will not be executed.
 
 ```js tab=js-js
 test.describe.fixme('broken tests', () => {

docs/src/test-parameterize-js.md

@@ -224,7 +224,7 @@ $env:PASSWORD=secret
 npx playwright test
 ```
 
-Similarly, configuration file can also read environment variables passed throught the command line.
+Similarly, configuration file can also read environment variables passed through the command line.
 
 
 ```js tab=js-js

docs/src/test-reporters-js.md

@@ -391,7 +391,7 @@ const config: PlaywrightTestConfig = {
 export default config;
 ```
 
-The JUnit reporter provides support for embedding additional information on the `testcase` elements using inner `properties`. This is based on an [evolved JUnit XML format](https://docs.getxray.app/display/XRAYCLOUD/Taking+advantage+of+JUnit+XML+reports) from Xray Test Management, but can also be used by other tools if they support this way of embedding additonal information for test results; please check it first.
+The JUnit reporter provides support for embedding additional information on the `testcase` elements using inner `properties`. This is based on an [evolved JUnit XML format](https://docs.getxray.app/display/XRAYCLOUD/Taking+advantage+of+JUnit+XML+reports) from Xray Test Management, but can also be used by other tools if they support this way of embedding additional information for test results; please check it first.
 
 In configuration file, a set of options can be used to configure this behavior. A full example, in this case for Xray, follows ahead.
 
@@ -483,7 +483,7 @@ test('using specific annotations for passing test metadata to Xray', async ({},
 
 Please note that the semantics of these properties will depend on the tool that will process this evoled report format; there are no standard property names/annotations.
 
-If the configuration option `embedAttachmentsAsProperty` is defined, then a `property` with its name is created. Attachments, including their contents, will be embeded on the JUnit XML report inside `<item>` elements under this `property`. Attachments are obtained from the `TestInfo` object, using either a path or a body, and are added as base64 encoded content.
+If the configuration option `embedAttachmentsAsProperty` is defined, then a `property` with its name is created. Attachments, including their contents, will be embedded on the JUnit XML report inside `<item>` elements under this `property`. Attachments are obtained from the `TestInfo` object, using either a path or a body, and are added as base64 encoded content.
 Embedding attachments can be used to attach screenshots or any other relevant evidence; nevertheless, use it wisely as it affects the report size.
 
 The following configuration sample enables embedding attachments by using the `testrun_evidence` element on the JUnit XML report:

docs/src/test-runners-java.md

@@ -94,7 +94,7 @@ instance per thread and use it on that thread exclusively. Here is an example ho
 
 Use [`@TestInstance(TestInstance.Lifecycle.PER_CLASS)`](https://junit.org/junit5/docs/current/api/org.junit.jupiter.api/org/junit/jupiter/api/TestInstance.html)
 annotation to make JUnit create one instance of a class for all test methods within that class (by default each JUnit will create a new instance of the class
-for each test method). Store [Playwright] and [Browser] objects in instance fields. They will be shared between tests. Each instace of the class will use its
+for each test method). Store [Playwright] and [Browser] objects in instance fields. They will be shared between tests. Each instance of the class will use its
 own copy of Playwright.
 
 

packages/playwright-core/types/types.d.ts

@@ -8532,7 +8532,7 @@ export interface ElementHandle<T=Node> extends JSHandle<T> {
     caret?: "hide"|"initial";
 
     /**
-     * Specify locators that should be masked when the screenshot is taken. Masked elements will be overlayed with a pink box
+     * Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box
      * `#FF00FF` that completely covers its bounding box.
      */
     mask?: Array<Locator>;
@@ -12593,7 +12593,7 @@ export interface APIRequest {
  *
  * **Cookie management**
  *
- * [APIRequestContext] retuned by
+ * [APIRequestContext] returned by
  * [browserContext.request](https://playwright.dev/docs/api/class-browsercontext#browser-context-request) and
  * [page.request](https://playwright.dev/docs/api/class-page#page-request) shares cookie storage with the corresponding
  * [BrowserContext]. Each API request will have `Cookie` header populated with the values from the browser context. If the
@@ -12601,9 +12601,9 @@ export interface APIRequest {
  * the page will pick them up. This means that if you log in using this API, your e2e test will be logged in and vice
  * versa.
  *
- * If you want API requests to not interfere with the browser cookies you shoud create a new [APIRequestContext] by calling
+ * If you want API requests to not interfere with the browser cookies you should create a new [APIRequestContext] by
- * [apiRequest.newContext([options])](https://playwright.dev/docs/api/class-apirequest#api-request-new-context). Such
+ * calling [apiRequest.newContext([options])](https://playwright.dev/docs/api/class-apirequest#api-request-new-context).
- * `APIRequestContext` object will have its own isolated cookie storage.
+ * Such `APIRequestContext` object will have its own isolated cookie storage.
  *
  */
 export interface APIRequestContext {
@@ -13269,7 +13269,7 @@ export interface Browser extends EventEmitter {
   /**
    * Creates a new browser context. It won't share cookies/cache with other browser contexts.
    *
-   * > NOTE: If directly using this method to create [BrowserContext]s, it is best practice to explicilty close the returned
+   * > NOTE: If directly using this method to create [BrowserContext]s, it is best practice to explicitly close the returned
    * context via [browserContext.close()](https://playwright.dev/docs/api/class-browsercontext#browser-context-close) when
    * your code is done with the [BrowserContext], and before calling
    * [browser.close()](https://playwright.dev/docs/api/class-browser#browser-close). This will ensure the `context` is closed
@@ -15137,7 +15137,7 @@ export interface Response {
   frame(): Frame;
 
   /**
-   * Indicates whether this Response was fullfilled by a Service Worker's Fetch Handler (i.e. via
+   * Indicates whether this Response was fulfilled by a Service Worker's Fetch Handler (i.e. via
    * [FetchEvent.respondWith](https://developer.mozilla.org/en-US/docs/Web/API/FetchEvent/respondWith)).
    */
   fromServiceWorker(): boolean;
@@ -16531,7 +16531,7 @@ export interface LocatorScreenshotOptions {
   caret?: "hide"|"initial";
 
   /**
-   * Specify locators that should be masked when the screenshot is taken. Masked elements will be overlayed with a pink box
+   * Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box
    * `#FF00FF` that completely covers its bounding box.
    */
   mask?: Array<Locator>;
@@ -16716,7 +16716,7 @@ export interface PageScreenshotOptions {
   fullPage?: boolean;
 
   /**
-   * Specify locators that should be masked when the screenshot is taken. Masked elements will be overlayed with a pink box
+   * Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box
    * `#FF00FF` that completely covers its bounding box.
    */
   mask?: Array<Locator>;

packages/playwright-test/types/test.d.ts

@@ -1901,7 +1901,7 @@ export interface TestType<TestArgs extends KeyValue, WorkerArgs extends KeyValue
     /**
    * Declares a test group similarly to
    * [test.describe(title, callback)](https://playwright.dev/docs/api/class-test#test-describe-1). Tests in this group are
-   * maked as "fixme" and will not be executed.
+   * marked as "fixme" and will not be executed.
    *
    * ```js
    * test.describe.fixme('broken tests', () => {
@@ -3563,7 +3563,7 @@ interface LocatorAssertions {
     caret?: "hide"|"initial";
 
     /**
-     * Specify locators that should be masked when the screenshot is taken. Masked elements will be overlayed with a pink box
+     * Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box
      * `#FF00FF` that completely covers its bounding box.
      */
     mask?: Array<Locator>;
@@ -3637,7 +3637,7 @@ interface LocatorAssertions {
     caret?: "hide"|"initial";
 
     /**
-     * Specify locators that should be masked when the screenshot is taken. Masked elements will be overlayed with a pink box
+     * Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box
      * `#FF00FF` that completely covers its bounding box.
      */
     mask?: Array<Locator>;
@@ -3881,7 +3881,7 @@ interface PageAssertions {
     fullPage?: boolean;
 
     /**
-     * Specify locators that should be masked when the screenshot is taken. Masked elements will be overlayed with a pink box
+     * Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box
      * `#FF00FF` that completely covers its bounding box.
      */
     mask?: Array<Locator>;
@@ -3985,7 +3985,7 @@ interface PageAssertions {
     fullPage?: boolean;
 
     /**
-     * Specify locators that should be masked when the screenshot is taken. Masked elements will be overlayed with a pink box
+     * Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box
      * `#FF00FF` that completely covers its bounding box.
      */
     mask?: Array<Locator>;