diff --git a/docs/commands/browser/assertView.mdx b/docs/commands/browser/assertView.mdx index 7036009..3c8570b 100644 --- a/docs/commands/browser/assertView.mdx +++ b/docs/commands/browser/assertView.mdx @@ -12,7 +12,8 @@ import Admonition from "@theme/Admonition"; ## Использование {#usage} -```javascript +```typescript +await browser.assertView(state, options); await browser.assertView(state, selector, options); ``` @@ -24,7 +25,7 @@ await browser.assertView(state, selector, options); [state](#state)StringОбязательный параметр. Название состояния теста. Должно быть уникальным в пределах одного теста. -[selector](#selector)String или String[]Обязательный параметр. Селектор DOM-элемента, который необходимо заснять. +[selector](#selector)String или String[]Необязательный параметр. Может быть пропущен. Селектор DOM-элемента, который необходимо заснять. При отсутствии команда скриншотит viewport. [options](#options)ObjectНастройки команды _assertView_. @@ -36,7 +37,17 @@ await browser.assertView(state, selector, options); ### selector -Обязательный параметр. Задает селектор DOM-элемента, который необходимо заснять. +Необязательный параметр. Может быть пропущен. Задает селектор DOM-элемента, который необходимо заснять. По умолчанию `body`. При его отсутствии `assertView` применяет следующие опции, которые имеют приоритет над `assertViewOpts` из конфига, но не над параметром `options`: + +``` +{ + allowViewportOverflow: true, + compositeImage: false, + captureElementFromTop: false +} +``` + +Таким образом, по умолчанию без параметра `options` `assertView` скриншотит viewport. ### options @@ -147,9 +158,9 @@ await browser.assertView(state, selector, options); ## Примеры использования {#examples} -**example-1.js** +**Визуальная проверка элемента** -```javascript +```typescript it("should assert view", async ({ browser }) => { await browser.url("some/url"); await browser.assertView("plain", ".button"); @@ -159,9 +170,22 @@ it("should assert view", async ({ browser }) => { }); ``` -**example-2.js** +**Визуальная проверка всего вьюпорта** + +```typescript +it("should assert viewport without selector", async ({ browser }) => { + await browser.url("some/url"); + await browser.execute(() => window.scrollTo(0, 1000)); + await browser.assertView("plain"); + + await browser.$(".button").click(); + await browser.assertView("clicked", { ignoreDiffPixelCount: 5 }); +}); +``` + +**Визуальная проверка с дополнительными опциями** -```javascript +```typescript it("should assert view with given options", async ({ browser }) => { await browser.url("some/url"); await browser.assertView("plain", ".form", { diff --git a/i18n/en/docusaurus-plugin-content-docs/current/commands/browser/assertView.mdx b/i18n/en/docusaurus-plugin-content-docs/current/commands/browser/assertView.mdx index b098130..567fdc9 100644 --- a/i18n/en/docusaurus-plugin-content-docs/current/commands/browser/assertView.mdx +++ b/i18n/en/docusaurus-plugin-content-docs/current/commands/browser/assertView.mdx @@ -13,7 +13,8 @@ Use the `assertView` command to take a screenshot for a specific test state and ## Usage {#usage} -```javascript +```typescript +await browser.assertView(state, options); await browser.assertView(state, selector, options); ``` @@ -25,7 +26,7 @@ await browser.assertView(state, selector, options); [state](#state)StringRequired parameter. The name of the test state. It must be unique within a single test. -[selector](#selector)String or String[]Required parameter. The DOM element selector to capture. +[selector](#selector)String or String[]Optional parameter. Can be skipped. The DOM element selector to capture. If skipped, current viewport is captured. [options](#options)ObjectSettings for the _assertView_ command. @@ -37,7 +38,18 @@ Required parameter. Specifies the name of the test state. The name must be uniqu ### selector -Required parameter. Specifies the selector of the DOM element to capture. +Required parameter. Specifies the selector of the DOM element to capture. If not specified or skipped, will be set to `body` and the following options will be automatically added to `options`: + +``` +{ + allowViewportOverflow: true, + compositeImage: false, + captureElementFromTop: false +} +``` + +These additional options will have higher priority than `assertViewOpts` from config, but lower priority than options from `options` parameter passed by user. +So, assertView without `selector` parameter will take a screenshot of the current viewport. ### options @@ -148,9 +160,9 @@ Specifies the settings for the `assertView` command: ## Usage Examples {#examples} -**example-1.js** +**Visual check of certain element** -```javascript +```typescript it("should assert view", async ({ browser }) => { await browser.url("some/url"); await browser.assertView("plain", ".button"); @@ -160,9 +172,22 @@ it("should assert view", async ({ browser }) => { }); ``` -**example-2.js** +**Visual check of current viewport** + +```typescript +it("should assert viewport without selector", async ({ browser }) => { + await browser.url("some/url"); + await browser.execute(() => window.scrollTo(0, 1000)); + await browser.assertView("plain"); + + await browser.$(".button").click(); + await browser.assertView("clicked", { ignoreDiffPixelCount: 5 }); +}); +``` + +**Visual check with additional options** -```javascript +```typescript it("should assert view with given options", async ({ browser }) => { await browser.url("some/url"); await browser.assertView("plain", ".form", {