docs: release notes for 1.14 (#8190)

Co-authored-by: Andrey Lushnikov <aslushnikov@gmail.com>
2021-08-13 15:02:24 -07:00 · 2021-08-13 15:02:24 -07:00 · b15762aab6
parent f4337ffc1d
commit b15762aab6
4 changed files with 340 additions and 0 deletions
--- a/docs/src/release-notes-csharp.md
+++ b/docs/src/release-notes-csharp.md
@ -5,6 +5,68 @@ title: "Release notes"

 <!-- TOC -->

+## Version 1.14
+
+#### ⚡️ New "strict" mode
+
+Selector ambiguity is a common problem in automation testing. **"strict" mode**
+ensures that your selector points to a single element and throws otherwise.
+
+Set `setStrict(true)` in your action calls to opt in.
+
+```csharp
+// This will throw if you have more than one button!
+await page.ClickAsync("button", new Page.ClickOptions().setStrict(true));
+```
+
+#### 📍 New [**Locators API**](https://playwright.dev/docs/api/class-locator)
+
+Locator represents a view to the element(s) on the page. It captures the logic sufficient to retrieve the element at any given moment.
+
+The difference between the [Locator](https://playwright.dev/docs/api/class-locator) and [ElementHandle](https://playwright.dev/docs/api/class-elementhandle) is that the latter points to a particular element, while [Locator](https://playwright.dev/docs/api/class-locator) captures the logic of how to retrieve that element.
+
+Also, locators are **"strict" by default**!
+
+```csharp
+var locator = page.Locator("button");
+await locator.ClickAsync();
+```
+
+Learn more in the [documentation](https://playwright.dev/docs/api/class-locator).
+
+#### 🧩 Experimental [**React**](https://playwright.dev/docs/selectors#react-selectors) and [**Vue**](https://playwright.dev/docs/selectors#vue-selectors) selector engines
+
+React and Vue selectors allow selecting elements by its component name and/or property values. The syntax is very similar to [attribute selectors](https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors) and supports all attribute selector operators.
+
+```csharp
+await page.ClickAsync("_react=SubmitButton[enabled=true]");
+await page.ClickAsync("_vue=submit-button[enabled=true]");
+```
+
+Learn more in the [react selectors documentation](https://playwright.dev/docs/selectors#react-selectors) and the [vue selectors documentation](https://playwright.dev/docs/selectors#vue-selectors).
+
+#### ✨ New [**`nth`**](https://playwright.dev/docs/selectors#n-th-element-selector) and [**`visible`**](https://playwright.dev/docs/selectors#selecting-visible-elements) selector engines
+
+- [`nth`](https://playwright.dev/docs/selectors#n-th-element-selector) selector engine is equivalent to the `:nth-match` pseudo class, but could be combined with other selector engines.
+- [`visible`](https://playwright.dev/docs/selectors#selecting-visible-elements) selector engine is equivalent to the `:visible` pseudo class, but could be combined with other selector engines.
+
+```csharp
+// select the first button among all buttons
+await button.ClickAsync("button >> nth=0");
+// or if you are using locators, you can use First, Nth() and Last
+await page.Locator("button").First.ClickAsync();
+
+// click a visible button
+await button.ClickAsync("button >> visible=true");
+```
+
+### Browser Versions
+
+- Chromium 94.0.4595.0
+- Mozilla Firefox 91.0
+- WebKit 15.0
+
+
 ## Version 1.13

 #### Playwright
--- a/docs/src/release-notes-java.md
+++ b/docs/src/release-notes-java.md
@ -5,6 +5,68 @@ title: "Release notes"

 <!-- TOC -->

+## Version 1.14
+
+#### ⚡️ New "strict" mode
+
+Selector ambiguity is a common problem in automation testing. **"strict" mode**
+ensures that your selector points to a single element and throws otherwise.
+
+Set `setStrict(true)` in your action calls to opt in.
+
+```java
+// This will throw if you have more than one button!
+page.click("button", new Page.ClickOptions().setStrict(true));
+```
+
+#### 📍 New [**Locators API**](https://playwright.dev/docs/api/class-locator)
+
+Locator represents a view to the element(s) on the page. It captures the logic sufficient to retrieve the element at any given moment.
+
+The difference between the [Locator](https://playwright.dev/docs/api/class-locator) and [ElementHandle](https://playwright.dev/docs/api/class-elementhandle) is that the latter points to a particular element, while [Locator](https://playwright.dev/docs/api/class-locator) captures the logic of how to retrieve that element.
+
+Also, locators are **"strict" by default**!
+
+```java
+Locator locator = page.locator("button");
+locator.click();
+```
+
+Learn more in the [documentation](https://playwright.dev/docs/api/class-locator).
+
+#### 🧩 Experimental [**React**](https://playwright.dev/docs/selectors#react-selectors) and [**Vue**](https://playwright.dev/docs/selectors#vue-selectors) selector engines
+
+React and Vue selectors allow selecting elements by its component name and/or property values. The syntax is very similar to [attribute selectors](https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors) and supports all attribute selector operators.
+
+```java
+page.click("_react=SubmitButton[enabled=true]");
+page.click("_vue=submit-button[enabled=true]");
+```
+
+Learn more in the [react selectors documentation](https://playwright.dev/docs/selectors#react-selectors) and the [vue selectors documentation](https://playwright.dev/docs/selectors#vue-selectors).
+
+#### ✨ New [**`nth`**](https://playwright.dev/docs/selectors#n-th-element-selector) and [**`visible`**](https://playwright.dev/docs/selectors#selecting-visible-elements) selector engines
+
+- [`nth`](https://playwright.dev/docs/selectors#n-th-element-selector) selector engine is equivalent to the `:nth-match` pseudo class, but could be combined with other selector engines.
+- [`visible`](https://playwright.dev/docs/selectors#selecting-visible-elements) selector engine is equivalent to the `:visible` pseudo class, but could be combined with other selector engines.
+
+```java
+// select the first button among all buttons
+button.click("button >> nth=0");
+// or if you are using locators, you can use first(), nth() and last()
+page.locator("button").first().click();
+
+// click a visible button
+button.click("button >> visible=true");
+```
+
+### Browser Versions
+
+- Chromium 94.0.4595.0
+- Mozilla Firefox 91.0
+- WebKit 15.0
+
+
 ## Version 1.13

 #### Playwright
--- a/docs/src/release-notes-js.md
+++ b/docs/src/release-notes-js.md
@ -5,6 +5,160 @@ title: "Release notes"

 <!-- TOC -->

+## Version 1.14
+
+### 🎭 Playwright Library
+
+#### ⚡️ New "strict" mode
+
+Selector ambiguity is a common problem in automation testing. **"strict" mode**
+ensures that your selector points to a single element and throws otherwise.
+
+Pass `strict: true` into your action calls to opt in.
+
+```js
+// This will throw if you have more than one button!
+await page.click('button', { strict: true });
+```
+
+#### 📍 New [**Locators API**](https://playwright.dev/docs/api/class-locator)
+
+Locator represents a view to the element(s) on the page. It captures the logic sufficient to retrieve the element at any given moment.
+
+The difference between the [Locator](https://playwright.dev/docs/api/class-locator) and [ElementHandle](https://playwright.dev/docs/api/class-elementhandle) is that the latter points to a particular element, while [Locator](https://playwright.dev/docs/api/class-locator) captures the logic of how to retrieve that element.
+
+Also, locators are **"strict" by default**!
+
+```js
+const locator = page.locator('button');
+await locator.click();
+```
+
+Learn more in the [documentation](https://playwright.dev/docs/api/class-locator).
+
+#### 🧩 Experimental [**React**](https://playwright.dev/docs/selectors#react-selectors) and [**Vue**](https://playwright.dev/docs/selectors#vue-selectors) selector engines
+
+React and Vue selectors allow selecting elements by its component name and/or property values. The syntax is very similar to [attribute selectors](https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors) and supports all attribute selector operators.
+
+```js
+await page.click('_react=SubmitButton[enabled=true]');
+await page.click('_vue=submit-button[enabled=true]');
+```
+
+Learn more in the [react selectors documentation](https://playwright.dev/docs/selectors#react-selectors) and the [vue selectors documentation](https://playwright.dev/docs/selectors#vue-selectors).
+
+#### ✨ New [**`nth`**](https://playwright.dev/docs/selectors#n-th-element-selector) and [**`visible`**](https://playwright.dev/docs/selectors#selecting-visible-elements) selector engines
+
+- [`nth`](https://playwright.dev/docs/selectors#n-th-element-selector) selector engine is equivalent to the `:nth-match` pseudo class, but could be combined with other selector engines.
+- [`visible`](https://playwright.dev/docs/selectors#selecting-visible-elements) selector engine is equivalent to the `:visible` pseudo class, but could be combined with other selector engines.
+
+```js
+// select the first button among all buttons
+await button.click('button >> nth=0');
+// or if you are using locators, you can use first(), nth() and last()
+await page.locator('button').first().click();
+
+// click a visible button
+await button.click('button >> visible=true');
+```
+
+### 🎭 Playwright Test
+
+#### ✅ Web-First Assertions
+
+`expect` now supports lots of new web-first assertions.
+
+Consider the following example:
+
+```js
+await expect(page.locator('.status')).toHaveText('Submitted');
+```
+
+Playwright Test will be re-testing the node with the selector `.status` until fetched Node has the `"Submitted"` text. It will be re-fetching the node and checking it over and over, until the condition is met or until the timeout is reached. You can either pass this timeout or configure it once via the [`testProject.expect`](https://playwright.dev/docs/api/class-testproject/#test-project-expect) value in test config.
+
+By default, the timeout for assertions is not set, so it'll wait forever, until the whole test times out.
+
+List of all new assertions:
+
+- [`expect(locator).toBeChecked()`](https://playwright.dev/docs/test-assertions#expectlocatortobechecked)
+- [`expect(locator).toBeDisabled()`](https://playwright.dev/docs/test-assertions#expectlocatortobedisabled)
+- [`expect(locator).toBeEditable()`](https://playwright.dev/docs/test-assertions#expectlocatortobeeditable)
+- [`expect(locator).toBeEmpty()`](https://playwright.dev/docs/test-assertions#expectlocatortobeempty)
+- [`expect(locator).toBeEnabled()`](https://playwright.dev/docs/test-assertions#expectlocatortobeenabled)
+- [`expect(locator).toBeFocused()`](https://playwright.dev/docs/test-assertions#expectlocatortobefocused)
+- [`expect(locator).toBeHidden()`](https://playwright.dev/docs/test-assertions#expectlocatortobehidden)
+- [`expect(locator).toBeVisible()`](https://playwright.dev/docs/test-assertions#expectlocatortobevisible)
+- [`expect(locator).toContainText(text, options?)`](https://playwright.dev/docs/test-assertions#expectlocatortocontaintexttext-options)
+- [`expect(locator).toHaveAttribute(name, value)`](https://playwright.dev/docs/test-assertions#expectlocatortohaveattributename-value)
+- [`expect(locator).toHaveClass(expected)`](https://playwright.dev/docs/test-assertions#expectlocatortohaveclassexpected)
+- [`expect(locator).toHaveCount(count)`](https://playwright.dev/docs/test-assertions#expectlocatortohavecountcount)
+- [`expect(locator).toHaveCSS(name, value)`](https://playwright.dev/docs/test-assertions#expectlocatortohavecssname-value)
+- [`expect(locator).toHaveId(id)`](https://playwright.dev/docs/test-assertions#expectlocatortohaveidid)
+- [`expect(locator).toHaveJSProperty(name, value)`](https://playwright.dev/docs/test-assertions#expectlocatortohavejspropertyname-value)
+- [`expect(locator).toHaveText(expected, options)`](https://playwright.dev/docs/test-assertions#expectlocatortohavetextexpected-options)
+- [`expect(page).toHaveTitle(title)`](https://playwright.dev/docs/test-assertions#expectpagetohavetitletitle)
+- [`expect(page).toHaveURL(url)`](https://playwright.dev/docs/test-assertions#expectpagetohaveurlurl)
+- [`expect(locator).toHaveValue(value)`](https://playwright.dev/docs/test-assertions#expectlocatortohavevaluevalue)
+
+#### ⛓ Serial mode with [`describe.serial`](https://playwright.dev/docs/api/class-test#test-describe-serial)
+
+Declares a group of tests that should always be run serially. If one of the tests fails, all subsequent tests are skipped. All tests in a group are retried together.
+
+```ts
+test.describe.serial('group', () => {
+  test('runs first', async ({ page }) => { /* ... */ });
+  test('runs second', async ({ page }) => { /* ... */ });
+});
+```
+
+Learn more in the [documentation](https://playwright.dev/docs/api/class-test#test-describe-serial).
+
+#### 🐾 Steps API with [`test.step`](https://playwright.dev/docs/api/class-test#test-step)
+
+Split long tests into multiple steps using `test.step()` API:
+
+```ts
+import { test, expect } from '@playwright/test';
+
+test('test', async ({ page }) => {
+  await test.step('Log in', async () => {
+    // ...
+  });
+  await test.step('news feed', async () => {
+    // ...
+  });
+});
+```
+
+Step information is exposed in reporters API.
+
+#### 🌎 Launch web server before running tests
+
+To launch a server during the tests, use the [`webServer`](https://playwright.dev/docs/test-advanced/#launching-a-development-web-server-during-the-tests) option in the configuration file. The server will wait for a given port to be available before running the tests, and the port will be passed over to Playwright as a [`baseURL`](https://playwright.dev/docs/api/class-fixtures#fixtures-base-url) when creating a context.
+
+```ts
+// playwright.config.ts
+import { PlaywrightTestConfig } from '@playwright/test';
+const config: PlaywrightTestConfig = {
+  webServer: {
+    command: 'npm run start', // command to launch
+    port: 3000, // port to await for 
+    timeout: 120 * 1000, 
+    reuseExistingServer: !process.env.CI,
+  },
+};
+export default config;
+```
+
+Learn more in the [documentation](https://playwright.dev/docs/test-advanced#launching-a-development-web-server-during-the-tests).
+
+### Browser Versions
+
+- Chromium 94.0.4595.0
+- Mozilla Firefox 91.0
+- WebKit 15.0
+
+
 ## Version 1.13


--- a/docs/src/release-notes-python.md
+++ b/docs/src/release-notes-python.md
@ -5,6 +5,68 @@ title: "Release notes"

 <!-- TOC -->

+## Version 1.14
+
+#### ⚡️ New "strict" mode
+
+Selector ambiguity is a common problem in automation testing. **"strict" mode**
+ensures that your selector points to a single element and throws otherwise.
+
+Pass `strict=true` into your action calls to opt in.
+
+```py
+# This will throw if you have more than one button!
+page.click("button", strict=true)
+```
+
+#### 📍 New [**Locators API**](https://playwright.dev/docs/api/class-locator)
+
+Locator represents a view to the element(s) on the page. It captures the logic sufficient to retrieve the element at any given moment.
+
+The difference between the [Locator](https://playwright.dev/docs/api/class-locator) and [ElementHandle](https://playwright.dev/docs/api/class-elementhandle) is that the latter points to a particular element, while [Locator](https://playwright.dev/docs/api/class-locator) captures the logic of how to retrieve that element.
+
+Also, locators are **"strict" by default**!
+
+```py
+locator = page.locator("button")
+locator.click()
+```
+
+Learn more in the [documentation](https://playwright.dev/docs/api/class-locator).
+
+#### 🧩 Experimental [**React**](https://playwright.dev/docs/selectors#react-selectors) and [**Vue**](https://playwright.dev/docs/selectors#vue-selectors) selector engines
+
+React and Vue selectors allow selecting elements by its component name and/or property values. The syntax is very similar to [attribute selectors](https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors) and supports all attribute selector operators.
+
+```py
+page.click("_react=SubmitButton[enabled=true]");
+page.click("_vue=submit-button[enabled=true]");
+```
+
+Learn more in the [react selectors documentation](https://playwright.dev/docs/selectors#react-selectors) and the [vue selectors documentation](https://playwright.dev/docs/selectors#vue-selectors).
+
+#### ✨ New [**`nth`**](https://playwright.dev/docs/selectors#n-th-element-selector) and [**`visible`**](https://playwright.dev/docs/selectors#selecting-visible-elements) selector engines
+
+- [`nth`](https://playwright.dev/docs/selectors#n-th-element-selector) selector engine is equivalent to the `:nth-match` pseudo class, but could be combined with other selector engines.
+- [`visible`](https://playwright.dev/docs/selectors#selecting-visible-elements) selector engine is equivalent to the `:visible` pseudo class, but could be combined with other selector engines.
+
+```py
+# select the first button among all buttons
+button.click("button >> nth=0")
+# or if you are using locators, you can use first, nth() and last
+page.locator("button").first.click()
+
+# click a visible button
+button.click("button >> visible=true")
+```
+
+### Browser Versions
+
+- Chromium 94.0.4595.0
+- Mozilla Firefox 91.0
+- WebKit 15.0
+
+
 ## Version 1.13

 #### Playwright