docs: add en versions of browser commands (#17)

* docs: add en versions of browser commands

docs/quickstart/index.mdx

@@ -3,8 +3,6 @@ import TabItem from "@theme/TabItem";
 
 # Быстрый старт
 
-Прежде всего, убедитесь, что ваша система удовлетворяет нужным требованиям.
-
 ## Установка {#install}
 
 Запустите установщик testplane с помощью `npm`.

i18n/en/docusaurus-plugin-content-docs/current/commands/browser/$$.mdx

@@ -0,0 +1,96 @@
+---
+slug: _dollardollar
+sidebar_label: $$
+---
+
+import Admonition from "@theme/Admonition";
+
+# $$
+
+## Overview {#overview}
+
+Use the `$$` command instead of [findElements][find-elements] as a shorter command to get multiple elements on the page.
+
+The `$$` command returns an array with the desired elements, on each of which you can call action commands without passing the selector. However, if you do pass a selector, it will first find the corresponding element and then call the action for that element.
+
+You can chain `$` or `$$` together to traverse down the DOM tree.
+
+<Admonition type="info">
+    Read more about how to select specific elements in the recipe "[How to use
+    selectors][how-to-use-selectors]".
+</Admonition>
+
+## Usage {#usage}
+
+```javascript
+await browser.$$(selector);
+```
+
+## Command Parameters {#parameters}
+
+<table>
+<thead>
+<tr><td>**Name**</td><td>**Type**</td><td>**Description**</td></tr>
+</thead>
+<tbody>
+<tr><td>selector</td><td>String or Function</td><td>Selector or JS function to get multiple elements.</td></tr>
+
+</tbody>
+</table>
+
+## Examples {#examples}
+
+**index.html**
+
+```html
+<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 of a menu link", async ({ browser }) => {
+    const text = await browser.$$("#menu")[0];
+
+    console.log(await text.$$("li")[2].$("a").getText()); // outputs: "API"
+});
+
+it("should get text of a menu link - JS Function", async ({ browser }) => {
+    const text = await browser.$$(function () {
+        // Arrow function cannot be used here.
+        // This is Window – https://developer.mozilla.org/en-US/docs/Web/API/Window
+        //
+        // TypeScript users can do something like:
+        // return (this as Window).document.querySelectorAll('#menu')
+        return this.document.querySelectorAll("#menu"); // Element[]
+    })[0];
+
+    console.log(await text.$$("li")[2].$("a").getText()); // outputs: "API"
+});
+```
+
+## Related Commands {#related}
+
+-   [browser.$](../_dollar)
+-   [element.$](../../element/_dollar)
+-   [element.$$](../../element/_dollardollar)
+
+## References
+
+We'd like to give credit to the original WebdriverIO docs [article](https://webdriver.io/docs/api/browser/$$), from which we drew some information while writing our version.
+
+[find-elements]: https://webdriver.io/docs/api/webdriver/#findelements
+[how-to-use-selectors]: https://webdriver.io/docs/selectors

i18n/en/docusaurus-plugin-content-docs/current/commands/browser/$.mdx

@@ -0,0 +1,119 @@
+---
+slug: _dollar
+sidebar_position: 1
+---
+
+import Admonition from "@theme/Admonition";
+
+# $
+
+## Overview {#overview}
+
+Use the `$` command instead of [findElement][find-element] as a shorter command to get a single element on the page.
+
+The `$` command returns an object describing the element, on which you can call action commands without passing the selector. However, if you pass a selector, it will first find the corresponding element and then call the action for that element. You can also pass an object as the selector, where the object contains the property `element-6066-11e4-a52e-4f735466cecf` with the value of the element reference. The command will then convert the reference into an extended WebdriverIO element.
+
+You can chain `$` or `$$` together to traverse down the DOM tree.
+
+<Admonition type="info">
+    Read more about how to select specific elements in the recipe "[How to use
+    selectors][how-to-use-selectors]".
+</Admonition>
+
+## Usage {#usage}
+
+```javascript
+await browser.$(selector);
+```
+
+## Command Parameters {#parameters}
+
+<table>
+<thead>
+<tr><td>**Name**</td><td>**Type**</td><td>**Description**</td></tr>
+</thead>
+<tbody>
+<tr><td>selector</td><td>String or Function or Matcher</td><td>Selector or JS function to get a specific element.</td></tr>
+
+</tbody>
+</table>
+
+## Examples {#examples}
+
+**index.html**
+
+```html
+<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 of a menu link", async ({ browser }) => {
+    const text = await browser.$("#menu");
+
+    console.log(await text.$$("li")[2].$("a").getText()); // outputs: "API"
+});
+
+it("should get text of a menu link - JS Function", async ({ browser }) => {
+    const text = await browser.$(function () {
+        // Arrow function cannot be used here.
+        // This is Window – https://developer.mozilla.org/en-US/docs/Web/API/Window
+        //
+        // TypeScript users can do something like:
+        // return (this as Window).document.querySelector('#menu')
+        return this.document.querySelector("#menu"); // Element
+    });
+
+    console.log(await text.$$("li")[2].$("a").getText()); // outputs: "API"
+});
+
+it("should allow converting the protocol result of an element into a WebdriverIO element", async ({
+    browser,
+}) => {
+    const activeElement = await browser.getActiveElement();
+
+    console.log(await browser.$(activeElement).getTagName()); // outputs the active element
+});
+
+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 Commands {#related}
+
+-   [browser.$$](../_dollardollar)
+-   [element.$](../../element/_dollar)
+-   [element.$$](../../element/_dollardollar)
+
+## References
+
+We'd like to give credit to the original WebdriverIO docs [article](https://webdriver.io/docs/api/browser/$), from which we drew some information while writing our version.
+
+[find-element]: https://webdriver.io/docs/api/webdriver/#findelement
+[how-to-use-selectors]: https://webdriver.io/docs/selectors

i18n/en/docusaurus-plugin-content-docs/current/commands/browser/action.mdx

@@ -0,0 +1,165 @@
+import Admonition from "@theme/Admonition";
+
+# action
+
+## Overview {#overview}
+
+Use the `action` command to perform input actions on one of the virtualizable devices in the web browser.
+
+Unlike high-level commands like [scrollIntoView][scrollIntoView] and [doubleClick][doubleClick], the Actions API provides more granular control of input devices. The following input sources are available:
+
+-   text input for keyboard devices;
+-   control of mouse, pen, or touch device;
+-   scroll control for devices with a scroll wheel.
+
+Each chain of `action` commands must end with a `perform` command to execute the specified set of actions. This also releases all pressed keys, buttons, etc., on virtual input devices and triggers the necessary events. The release can be skipped by passing the argument `true` to the `perform` command. Example:
+
+```typescript
+await browser.action(...).perform(true);
+```
+
+<Admonition type="info">
+    Support for this command and specific actions may vary depending on the execution environment.
+    The development progress can be tracked on [wpt.fyi][web-platform-tests]. For mobile devices,
+    you can use specialized gesture commands with [Appium][appium] on [iOS][appium-ios] and
+    [Android][appium-android].
+</Admonition>
+
+## Keyboard Control {#keyboard_control}
+
+Used when specifying `key` as the argument for the `action` command. Example:
+
+```typescript
+await browser.action("key");
+```
+
+Returns a `KeyAction` object that supports the following actions:
+
+-   `down(value: string)` — creates a key press action;
+-   `up(value: string)` — creates a key release action;
+-   `pause(ms: number)` — specifies that the input source does nothing for the specified amount of time.
+
+### Special Symbols {#special_symbols}
+
+To use special symbols (`Control`, `Page Up`, `Shift`, etc.), you can use the `Key` object from the [webdriverio][webdriverio-npm] package. It contains Unicode representations of all necessary special symbols. Example:
+
+```typescript
+import { Key } from "webdriverio";
+
+await browser.action("key").down(Key.Ctrl).perform();
+```
+
+### Usage Examples {#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(); // make the element active
+
+    await browser.action("key").down("f").down("o").down("o").up("f").up("o").up("o").perform();
+
+    console.log(await elem.getValue()); // returns "foo"
+
+    // copy value from input element
+    await browser.action("key").down(Key.Ctrl).down("c").pause(10).up(Key.Ctrl).up("c").perform();
+});
+```
+
+Instead of a series of `down/up` events, it is better to use the `setValue` command. The example is purely for demonstrating the principles of the `action` command.
+
+## Pointer Control {#pointer_control}
+
+Used when specifying `pointer` as the argument for the `action` command, and you can also specify the pointer type. Example:
+
+```typescript
+await browser.action("pointer", {
+    parameters: { pointerType: "mouse" }, // "mouse" is the default value, also available: "pen" or "touch"
+});
+```
+
+Returns a `PointerAction` object that supports the following actions:
+
+-   `down(button: 'left' | 'middle' | 'right')` — creates an action to press a key;
+-   `down(params: PointerActionParams)` — creates an action to press a key with detailed parameters;
+-   `move(x: number, y: number)` — creates an action to move the pointer by `x` and `y` pixels relative to the viewport;
+-   `move(params: PointerActionMoveParams)` — creates an action to move the pointer by `x` and `y` pixels from the specified origin. The origin can be defined as the current pointer position, the viewport, or the center of a specific element;
+-   `up(button: 'left' | 'middle' | 'right')` — creates an action to release a key;
+-   `up(params: PointerActionUpParams)` — creates an action to release a key with detailed parameters;
+-   `cancel()` — creates an action that cancels the current pointer position;
+-   `pause(ms: number)` — specifies that the input source does nothing for the specified amount of time.
+
+Detailed information on the parameter types [PointerActionParams][pointer-action-params], [PointerActionMoveParams][pointer-action-move-params], and [PointerActionUpParams][pointer-action-up-params] can be found in the webdriverio source code.
+
+### Usage Examples {#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 }) // left button
+        .pause(10)
+        .move({ duration: 0, origin: targetOrigin })
+        .up({ button: 0 })
+        .perform();
+});
+```
+
+## Scroll Wheel Control {#scroll_wheel_control}
+
+Used when specifying `wheel` as the argument for the `action` command. Example:
+
+```typescript
+await browser.action("wheel");
+```
+
+Returns a `WheelAction` object that supports the following actions:
+
+-   `scroll(params: ScrollParams)` — scrolls the page to the specified coordinates or origin;
+-   `pause(ms: number)` — specifies that the input source does nothing for the specified amount of time.
+
+Detailed information on the parameter type [ScrollParams][scroll-params] can be found in the webdriverio source code.
+
+### Usage Examples {#scroll_examples}
+
+```typescript
+it("should scroll using wheel action commands", async ({ browser }) => {
+    console.log(await browser.execute(() => window.scrollY)); // returns 0
+
+    await browser
+        .action("wheel")
+        .scroll({
+            deltaX: 0,
+            deltaY: 500,
+            duration: 200,
+        })
+        .perform();
+
+    console.log(await browser.execute(() => window.scrollY)); // returns 500
+});
+```
+
+## Related Commands {#related}
+
+-   [actions](../actions)
+
+## References
+
+We'd like to give credit to the original WebdriverIO docs [article](https://webdriver.io/docs/api/browser/action), from which we drew some information while writing our version.
+
+[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://appium.github.io/appium-xcuitest-driver/latest/reference/execute-methods/#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