Skip to content

Commit

Permalink
feat: migrate docs
Browse files Browse the repository at this point in the history
  • Loading branch information
shadowusr committed Jun 19, 2024
1 parent 52f5135 commit 7a3dffa
Show file tree
Hide file tree
Showing 227 changed files with 21,181 additions and 159 deletions.
Empty file removed blog/.empty
Empty file.
176 changes: 176 additions & 0 deletions blog/component-testing.mdx

Large diffs are not rendered by default.

24 changes: 24 additions & 0 deletions blog/rebranding.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
---
title: Ребрендинг
slug: testplane-rebranding
hide_table_of_contents: false
date: 2024-05-20T13:00
---

Представляем вашему вниманию... **Testplane**. Наш проект Hermione решил сменить имя — встречайте проверенный годами продукт в свежем образе!

<!-- truncate -->

После рассмотрения всех за и против мы остановились на этом новом имени, которое, на наш взгляд, лучше всего подходит нашему продукту. Но не волнуйтесь, в самой сути ничего не изменилось. Testplane тот же проект, который вы знали многие годы как Hermione, просто в новом обличье. Мы решили сделать сквозную нумерацию версий: Testplane v8.x это эквивалент Hermione v8.x.

Если вы уже работаете с Hermione, обновление на Testplane должно занять не больше нескольких минут мы проектировали его как drop-in замену:

- умеет работать с существующими плагинами hermione
- понимает все опции и переменные окружения hermione
- конфиги полностью совместимы
- предоставляет сразу 2 бинаря (testplane и hermione) для плавного переезда (т.е. можно запускать и как `hermione gui`, и как `testplane gui`)
- для TS экспортирует и свои типы, и типы hermione т.ч. hermioneCtx)

Если же вы еще не пробовали Testplane загляните в документацию и начните путешествие с Testplane всего за пару минут!

Спасибо вам за то, что остаётесь с нами! ✈️
87 changes: 87 additions & 0 deletions docs/commands/browser/$$.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,87 @@
import Admonition from "@theme/Admonition";

# $$

## Обзор {#overview}

Используйте команду `$$` вместо [findElements][find-elements] как более краткую команду, чтобы получить несколько элементов на странице.

Команда `$$` возвращает массив с искомыми элементами, на каждом из которых можно вызывать команды действия без передачи селектора. Однако, если вы все же передадите селектор, то сначала будет найден соответствующий элемент, а затем вызвано действие для этого элемента.

Вы можете связать `$` или `$$` вместе, чтобы спуститься по дереву DOM.

<Admonition type="info">
Подробнее о том, как выбрать определенные элементы, смотрите в рецепте «[Как использовать
селекторы][how-to-use-selectors]».
</Admonition>

## Использование {#usage}

```javascript
await browser.$$(selector);
```

## Параметры команды {#parameters}

<table>
<thead>
<tr><td>**Имя**</td><td>**Тип**</td><td>**Описание**</td></tr>
</thead>
<tbody>
<tr><td>selector</td><td>String или Function</td><td>Селектор или JS-функция для получения множества элементов.</td></tr>

</tbody>
</table>

## Примеры использования {#examples}

**index.html**

```javascript
<ul id="menu">
<li>
<a href="/">Home</a>
</li>
<li>
<a href="/">Developer Guide</a>
</li>
<li>
<a href="/">API</a>
</li>
<li>
<a href="/">Contribute</a>
</li>
</ul>
```

**$.js**

```javascript
it("should get text a menu link", async ({ browser }) => {
const text = await browser.$$("#menu")[0];

console.log(await text.$$("li")[2].$("a").getText()); // выведет: "API"
});

it("should get text a menu link - JS Function", async ({ browser }) => {
const text = await browser.$$(function () {
// Использовать здесь стрелочную функцию нельзя.
// Это Window – https://developer.mozilla.org/en-US/docs/Web/API/Window
//
// TypeScript-пользователи могут сделать что-нибудь вроде:
// return (this as Window).document.querySelectorAll('#menu')
return this.document.querySelectorAll("#menu"); // Element[]
})[0];

console.log(await text.$$("li")[2].$("a").getText()); // выведет: "API"
});
```

## Связанные команды {#related}

- [browser.$](./$)
- [element.$](../element/$)
- [element.$$](../element/$$)

[find-elements]: https://v7.webdriver.io/docs/api/webdriver/#findelements
[how-to-use-selectors]: https://v7.webdriver.io/docs/selectors
114 changes: 114 additions & 0 deletions docs/commands/browser/$.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,114 @@
---
sidebar_position: 1
---

import Admonition from "@theme/Admonition";

# $

## Обзор {#overview}

Используйте команду `$` вместо [findElement][find-element] как более краткую команду, чтобы получить один элемент на странице.

Команда `$` возвращает объект, описывающий элемент, на котором можно вызывать команды действия без передачи селектора. Однако, если вы все же передадите селектор, то сначала будет найден соответствующий элемент, а затем вызвано действие для этого элемента. Вы также можете передать объект в качестве селектора, где объект содержит свойство `element-6066-11e4-a52e-4f735466cecf` со значением ссылки на элемент. Затем команда преобразует ссылку в расширенный элемент WebdriverIO.

Вы можете связать `$` или `$$` вместе, чтобы спуститься по дереву DOM.

<Admonition type="info">
Подробнее о том, как выбрать определенные элементы, читайте в рецепте «[Как использовать
селекторы][how-to-use-selectors]».
</Admonition>

## Использование {#usage}

```javascript
await browser.$(selector);
```

## Параметры команды {#parameters}

<table>
<thead>
<tr><td>**Имя**</td><td>**Тип**</td><td>**Описание**</td></tr>
</thead>
<tbody>
<tr><td>selector</td><td>String или Function или Matcher</td><td>Селектор или JS-функция для получения конкретного элемента.</td></tr>

</tbody>
</table>

## Примеры использования {#examples}

**index.html**

```javascript
<ul id="menu">
<li>
<a href="/">Home</a>
</li>
<li>
<a href="/">Developer Guide</a>
</li>
<li>
<a href="/">API</a>
</li>
<li>
<a href="/">Contribute</a>
</li>
</ul>
```

**$.js**

```javascript
it("should get text a menu link", async ({ browser }) => {
const text = await browser.$("#menu");

console.log(await text.$$("li")[2].$("a").getText()); // выведет: "API"
});

it("should get text a menu link - JS Function", async ({ browser }) => {
const text = await browser.$(function () {
// Использовать здесь стрелочную функцию нельзя.
// Это Window – https://developer.mozilla.org/en-US/docs/Web/API/Window
//
// TypeScript-пользователи могут сделать что-нибудь вроде:
// return (this as Window).document.querySelector('#menu')
return this.document.querySelector("#menu"); // Element
});

console.log(await text.$$("li")[2].$("a").getText()); // выведет: "API"
});

it("should allow to convert protocol result of an element into a WebdriverIO element", async ({
browser,
}) => {
const activeElement = await browser.getActiveElement();

console.log(await browser.$(activeElement).getTagName()); // выведет активный элемент
});

it("should use Androids DataMatcher or ViewMatcher selector", async ({ browser }) => {
const menuItem = await browser.$({
name: "hasEntry",
args: ["title", "ViewTitle"],
class: "androidx.test.espresso.matcher.ViewMatchers",
});
await menuItem.click();

const menuItem = await browser.$({
name: "hasEntry",
args: ["title", "ViewTitle"],
});
await menuItem.click();
});
```

## Связанные команды {#related}

- [browser.$$](./$$)
- [element.$](../element/$)
- [element.$$](../element/$$)

[find-element]: https://v7.webdriver.io/docs/api/webdriver/#findelement
[how-to-use-selectors]: https://v7.webdriver.io/docs/selectors
159 changes: 159 additions & 0 deletions docs/commands/browser/action.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,159 @@
import Admonition from "@theme/Admonition";

# action

## Обзор {#overview}

Используйте команду `action`, чтобы выполнить действия ввода в одном из виртуализируемых устройств в веб-браузере.

В отличие от высокоуровневых команд [scrollIntoView][scrollIntoView] и [doubleClick][doubleClick], Actions API обеспечивает более гранулярное управление устройствами ввода. Доступны следующие источники ввода:

- ввод текста с клавиатуры для клавиатурных устройств;
- управление мышью, пером или сенсорным устройством;
- управление скроллом для устройств с колесом прокрутки.

Каждая цепочка вызовов `action` команд должна завершаться вызовом команды `perform`, чтобы начать выполнение указанного набора действий. Также это приводит к высвобождению всех нажатых клавиш, кнопок и т.д. на виртуальных устройствах ввода и запускает необходимые события. Высвобождение можно пропустить, передав аргумент `true` в команду `perform`. Пример:

```typescript
await browser.action(...).perform(true);
```

<Admonition type="info">
Поддержка данной команды и конкретных действий может различаться в зависимости от среды
выполнения. За ходом разработки можно следить на [wpt.fyi][web-platform-tests]. Для мобильных
устройств вы можете использовать специальные команды жестов [Appium][appium] на
[iOS][appium-ios] и [Android][appium-android].
</Admonition>

## Управление клавиатурой {#keyboard_control}

Используется при указании `key` в качестве аргумента команды `action`. Пример:

```typescript
await browser.action("key");
```

Возвращает объект `KeyAction`, который поддерживает следующие действия:

- `down(value: string)` &mdash; создает действие нажатия клавиши;
- `up(value: string)` &mdash; создает действие отпускания клавиши;
- `pause(ms: number)` &mdash; указывает, что источник ввода ничего не делает указанное количество времени.

### Специальные символы {#special_symbols}

Для использования специальных символов (`Control`, `Page Up`, `Shift` и т.д.) можно использовать объект `Key` из пакета [webdriverio][webdriverio-npm]. В нем содержатся unicode представления всех нужных специальных символов. Пример:

```typescript
import { Key } from "webdriverio";

await browser.action("key").down(Key.Ctrl).perform();
```

### Примеры использования {#keyboard_examples}

```typescript
import { Key } from "webdriverio";

it("should emit key events using key action commands", async ({ browser }) => {
const elem = await browser.$("input");
await elem.click(); // сделать элемент активным

await browser.action("key").down("f").down("o").down("o").up("f").up("o").up("o").perform();

console.log(await elem.getValue()); // возвращает "foo"

// скопировать значение из элемента input
await browser.action("key").down(Key.Ctrl).down("c").pause(10).up(Key.Ctrl).up("c").perform();
});
```

## Управление указателем {#pointer_control}

Используется при указании `pointer` в качестве аргумента команды `action`, также можно указать тип указателя. Пример:

```typescript
await browser.action("pointer", {
parameters: { pointerType: "mouse" }, // "mouse" значение по умолчанию, также доступны: "pen" or "touch"
});
```

Возвращает объект `PointerAction`, который поддерживает следующие действия:

- `down(button: 'left' | 'middle' | 'right')` &mdash; создает действие для нажатия одной клавиши;
- `down(params: PointerActionParams)` &mdash; создает действие для нажатия одной клавиши с подробными параметрами;
- `move(x: number, y: number)` &mdash; создает действие для перемещения указателя на `x` и `y` пикселей относительно вьюпорта;
- `move(params: PointerActionMoveParams)` &mdash; создает действие для перемещения указателя на `x` и `y` пикселей из указанного начала координат. Начало координат может быть определено как текущая позиция указателя, вьюпорта или центр определенного элемента;
- `up(button: 'left' | 'middle' | 'right')` &mdash; создает действие для отпускания одной клавиши;
- `up(params: PointerActionUpParams)` &mdash; создает действие для отпускания одной клавиши с подробными параметрами;
- `cancel()` &mdash; создает действие, которое отменяет текущее положение указателя;
- `pause(ms: number)` &mdash; указывает, что источник ввода ничего не делает указанное количество времени.

Подробную информацию о типах параметров [PointerActionParams][pointer-action-params], [PointerActionMoveParams][pointer-action-move-params] и [PointerActionUpParams][pointer-action-up-params] можно найти в исходном коде webdriverio.

### Примеры использования {#pointer_examples}

```typescript
it("drag and drop using pointer action command", async ({ browser }) => {
const origin = await browser.$("#source");
const targetOrigin = await browser.$("#target");

await browser
.action("pointer")
.move({ duration: 0, origin, x: 0, y: 0 })
.down({ button: 0 }) // левая кнопка
.pause(10)
.move({ duration: 0, origin: targetOrigin })
.up({ button: 0 })
.perform();
});
```

## Управление колесом прокрутки {#scroll_wheel_control}

Используется при указании `wheel` в качестве аргумента команды `action`. Пример:

```typescript
await browser.action("wheel");
```

Возвращает объект `WheelAction`, который поддерживает следующие действия:

- `scroll(params: ScrollParams)` &mdash; прокручивает страницу до указанных координат или до начала координат;
- `pause(ms: number)` &mdash; указывает, что источник ввода ничего не делает указанное количество времени.

Подробную информацию о типе параметра [ScrollParams][scroll-params] можно найти в исходном коде webdriverio.

### Примеры использования {#scroll_examples}

```typescript
it("should scroll using wheel action commands", async ({ browser }) => {
console.log(await browser.execute(() => window.scrollY)); // возвращает 0

await browser
.action("wheel")
.scroll({
deltaX: 0,
deltaY: 500,
duration: 200,
})
.perform();

console.log(await browser.execute(() => window.scrollY)); // возвращает 500
});
```

## Связанные команды {#related}

- [actions](./actions)

[scrollIntoView]: ../element/scrollIntoView
[doubleClick]: ../element/doubleClick
[web-platform-tests]: https://wpt.fyi/results/webdriver/tests/perform_actions?label=experimental&label=master&aligned
[appium]: http://appium.io
[appium-ios]: https://github.com/appium/appium-xcuitest-driver#mobile-pinch
[appium-android]: https://github.com/appium/appium-uiautomator2-driver#mobile-gesture-commands
[webdriverio-npm]: https://www.npmjs.com/package/webdriverio
[pointer-action-params]: https://github.com/webdriverio/webdriverio/blob/8ca026c75bf7c27ef9d574f0ec48d8bc13658602/packages/webdriverio/src/utils/actions/pointer.ts#L20-L35
[pointer-action-move-params]: https://github.com/webdriverio/webdriverio/blob/8ca026c75bf7c27ef9d574f0ec48d8bc13658602/packages/webdriverio/src/utils/actions/pointer.ts#L20-L42
[pointer-action-up-params]: https://github.com/webdriverio/webdriverio/blob/8ca026c75bf7c27ef9d574f0ec48d8bc13658602/packages/webdriverio/src/utils/actions/pointer.ts#L13-L19
[scroll-params]: https://github.com/webdriverio/webdriverio/blob/8ca026c75bf7c27ef9d574f0ec48d8bc13658602/packages/webdriverio/src/utils/actions/wheel.ts#L4-L29
Loading

0 comments on commit 7a3dffa

Please sign in to comment.