From 40520007d27a290b9897c71d7f9d81f65cfd6caa Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Fri, 21 Apr 2023 20:52:00 +0800
Subject: [PATCH 01/35] chore: bringing the name of options to a general form

---
 docs/helpers/Playwright.md |  4 ++--
 lib/helper/Playwright.js   | 16 ++++++++--------
 2 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/docs/helpers/Playwright.md b/docs/helpers/Playwright.md
index 20cc6a474..85421d64d 100644
--- a/docs/helpers/Playwright.md
+++ b/docs/helpers/Playwright.md
@@ -493,7 +493,7 @@ I.click({css: 'nav a.login'});
 -   `locator` **([string][8] | [object][5])** clickable link or button located by text, or any element located by CSS|XPath|strict locator.
 -   `context` **([string][8]? | [object][5] | null)** (optional, `null` by default) element to search in CSS|XPath|Strict locator.
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
--   `opts` **any?** [Additional options][10] for click available as 3rd argument.Examples:```js
+-   `options` **any?** [Additional options][10] for click available as 3rd argument.Examples:```js
     // click on element at position
     I.click('canvas', '.model', { position: { x: 20, y: 40 } })
 
@@ -2001,7 +2001,7 @@ See [Playwright's reference][31]
 
 #### Parameters
 
--   `opts` **any**  
+-   `options` **any**  
 
 ### waitForRequest
 
diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index 7f8061237..40f1452d4 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -1285,7 +1285,7 @@ class Playwright extends Helper {
   /**
    * {{> click }}
    *
-   * @param {any} [opts] [Additional options](https://playwright.dev/docs/api/class-page#page-click) for click available as 3rd argument.
+   * @param {any} [options] [Additional options](https://playwright.dev/docs/api/class-page#page-click) for click available as 3rd argument.
    *
    * Examples:
    *
@@ -1298,8 +1298,8 @@ class Playwright extends Helper {
    * ```
    *
    */
-  async click(locator, context = null, opts = {}) {
-    return proceedClick.call(this, locator, context, opts);
+  async click(locator, context = null, options = {}) {
+    return proceedClick.call(this, locator, context, options);
   }
 
   /**
@@ -2461,15 +2461,15 @@ class Playwright extends Helper {
    *
    * See [Playwright's reference](https://playwright.dev/docs/api/class-page?_highlight=waitfornavi#pagewaitfornavigationoptions)
    *
-   * @param {*} opts
+   * @param {*} options
    */
-  async waitForNavigation(opts = {}) {
-    opts = {
+  async waitForNavigation(options = {}) {
+    options = {
       timeout: this.options.getPageTimeout,
       waitUntil: this.options.waitForNavigation,
-      ...opts,
+      ...options,
     };
-    return this.page.waitForNavigation(opts);
+    return this.page.waitForNavigation(options);
   }
 
   async waitUntilExists(locator, sec) {

From eddae7c1f6fa8c767fea1dcb9f66e535d580c7b4 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 15 May 2023 16:26:06 +0800
Subject: [PATCH 02/35] FEATURE(new playwright api): add .blur()

---
 lib/helper/Playwright.js | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index 40f1452d4..d4e872566 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -1302,6 +1302,26 @@ class Playwright extends Helper {
     return proceedClick.call(this, locator, context, options);
   }
 
+  /**
+   * {{> blur }}
+   * Remove focus from a text input
+   * @param {any} [options] [Additional options](https://playwright.dev/docs/api/class-locator#locator-blur) for available options object as 2nd argument.
+   *
+   * Examples:
+   *
+   * ```js
+   * I.blur('.text-area')
+   * ```
+   *
+   */
+  async blur(locator, options = {}) {
+    const els = await this._locate(locator);
+    assertElementExists(els, locator, 'Element to blur');
+    const el = els[0];
+    await el.blur(options);
+    return this._waitForAction();
+  }
+
   /**
    * Clicks link and waits for navigation (deprecated)
    */

From 6d05ec980f8694329e8c1d4aacddfe0ef56fb219 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 15 May 2023 17:16:41 +0800
Subject: [PATCH 03/35] DOC(new playwright api): add .blur()

---
 docs/helpers/Playwright.md | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/docs/helpers/Playwright.md b/docs/helpers/Playwright.md
index 85421d64d..f6f611aa1 100644
--- a/docs/helpers/Playwright.md
+++ b/docs/helpers/Playwright.md
@@ -406,6 +406,18 @@ I.attachFile('form input[name=avatar]', 'data/avatar.jpg');
 -   `pathToFile` **[string][8]** local file path relative to codecept.conf.ts or codecept.conf.js config file.
     ⚠️ returns a _promise_ which is synchronized internally by recorder
 
+### blur
+
+{{> blur }}
+Remove focus from a text input
+
+#### Parameters
+
+-   `locator`  
+-   `options` **any?** [Additional options][9] for available options object as 2nd argument.Examples:```js
+    I.blur('.text-area')
+    ``` 
+
 ### cancelPopup
 
 Dismisses the active JavaScript popup, as created by window.alert|window.confirm|window.prompt.

From 3393c7683f5f3155d7a768b183b5803a8c249664 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 15 May 2023 19:41:31 +0800
Subject: [PATCH 04/35] FEATURE(new playwright api): add .blur()

---
 lib/helper/Playwright.js | 40 ++++++++++++++++++++--------------------
 1 file changed, 20 insertions(+), 20 deletions(-)

diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index d4e872566..872948680 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -1302,26 +1302,6 @@ class Playwright extends Helper {
     return proceedClick.call(this, locator, context, options);
   }
 
-  /**
-   * {{> blur }}
-   * Remove focus from a text input
-   * @param {any} [options] [Additional options](https://playwright.dev/docs/api/class-locator#locator-blur) for available options object as 2nd argument.
-   *
-   * Examples:
-   *
-   * ```js
-   * I.blur('.text-area')
-   * ```
-   *
-   */
-  async blur(locator, options = {}) {
-    const els = await this._locate(locator);
-    assertElementExists(els, locator, 'Element to blur');
-    const el = els[0];
-    await el.blur(options);
-    return this._waitForAction();
-  }
-
   /**
    * Clicks link and waits for navigation (deprecated)
    */
@@ -1519,6 +1499,26 @@ class Playwright extends Helper {
     return this._waitForAction();
   }
 
+  /**
+   * {{> blur }}
+   * Remove focus from a text input
+   * @param {any} [options] [Additional options](https://playwright.dev/docs/api/class-locator#locator-blur) for available options object as 2nd argument.
+   *
+   * Examples:
+   *
+   * ```js
+   * I.blur('.text-area')
+   * ```
+   *
+   */
+  async blur(locator, options = {}) {
+    const els = await this._locate(locator);
+    assertElementExists(els, locator, 'Element to blur');
+    const el = els[0];
+    await el.blur(options);
+    return this._waitForAction();
+  }
+
   /**
    * {{> seeInField }}
    */

From 24363458396984073fe0451502f5e3bf1eed3b4f Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 15 May 2023 20:09:59 +0800
Subject: [PATCH 05/35] FEATURE(new playwright api): add .focus()

---
 lib/helper/Playwright.js | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index 872948680..954a08022 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -905,6 +905,28 @@ class Playwright extends Helper {
     return this._waitForAction();
   }
 
+  /**
+   * {{> focus }}
+   * Calls [focus](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus) on the matching element.
+   * @param {any} [options] [Additional options](https://playwright.dev/docs/api/class-locator#locator-focus) for available options object as 2nd argument.
+   *
+   * Examples:
+   *
+   * ```js
+   * I.dontSee('#add-to-cart');
+   * I.focus('#product-tile')
+   * I.see('#add-to-cart');
+   * ```
+   *
+   */
+  async focus(locator, options = {}) {
+    const els = await this._locate(locator);
+    assertElementExists(els, locator, 'Element to focus');
+    const el = els[0];
+    await el.focus(options);
+    return this._waitForAction();
+  }
+
   /**
    * {{> dragAndDrop }}
    *

From 1a48bd4ad76dd8192aedc712bec4165bcd25e068 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 15 May 2023 20:12:23 +0800
Subject: [PATCH 06/35] DOC(new playwright api): add .focus()

---
 docs/helpers/Playwright.md | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/docs/helpers/Playwright.md b/docs/helpers/Playwright.md
index f6f611aa1..5ff284a02 100644
--- a/docs/helpers/Playwright.md
+++ b/docs/helpers/Playwright.md
@@ -779,6 +779,20 @@ I.fillField({css: 'form#login input[name=username]'}, 'John');
 -   `value` **([string][8] | [object][5])** text value to fill.
     ⚠️ returns a _promise_ which is synchronized internally by recorder
 
+### focus
+
+{{> focus }}
+Calls [focus][16] on the matching element.
+
+#### Parameters
+
+-   `locator`  
+-   `options` **any?** [Additional options][17] for available options object as 2nd argument.Examples:```js
+    I.dontSee('#add-to-cart');
+    I.focus('#product-tile')
+    I.see('#add-to-cart');
+    ``` 
+
 ### forceClick
 
 Perform an emulated click on a link or a button, given by a locator.

From 30cff4ce8dbad6e01cb55064ac56d11148e0efb2 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 15 May 2023 20:23:59 +0800
Subject: [PATCH 07/35] FEATURE(new playwright api): add .blur()

---
 lib/helper/Playwright.js | 47 +++++++++++++++++++++++-----------------
 1 file changed, 27 insertions(+), 20 deletions(-)

diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index 954a08022..c603c3cda 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -927,6 +927,33 @@ class Playwright extends Helper {
     return this._waitForAction();
   }
 
+  /**
+   * {{> blur }}
+   * Remove focus from a text input, button, etc
+   * Calls [blur](https://playwright.dev/docs/api/class-locator#locator-blur) on the element.
+   * @param {any} [options] [Additional options](https://playwright.dev/docs/api/class-locator#locator-blur) for available options object as 2nd argument.
+   *
+   * Examples:
+   *
+   * ```js
+   * I.blur('.text-area')
+   * ```
+   * ```js
+   * //element `#product-tile` is focused
+   * I.see('#add-to-cart-btn');
+   * I.blur('#product-tile')
+   * I.dontSee('#add-to-cart-btn');
+   * ```
+   *
+   */
+  async blur(locator, options = {}) {
+    const els = await this._locate(locator);
+    assertElementExists(els, locator, 'Element to blur');
+    const el = els[0];
+    await el.blur(options);
+    return this._waitForAction();
+  }
+
   /**
    * {{> dragAndDrop }}
    *
@@ -1521,26 +1548,6 @@ class Playwright extends Helper {
     return this._waitForAction();
   }
 
-  /**
-   * {{> blur }}
-   * Remove focus from a text input
-   * @param {any} [options] [Additional options](https://playwright.dev/docs/api/class-locator#locator-blur) for available options object as 2nd argument.
-   *
-   * Examples:
-   *
-   * ```js
-   * I.blur('.text-area')
-   * ```
-   *
-   */
-  async blur(locator, options = {}) {
-    const els = await this._locate(locator);
-    assertElementExists(els, locator, 'Element to blur');
-    const el = els[0];
-    await el.blur(options);
-    return this._waitForAction();
-  }
-
   /**
    * {{> seeInField }}
    */

From 0e3e49b05123d90c79758d029074e3fb56209b3c Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 15 May 2023 20:25:08 +0800
Subject: [PATCH 08/35] chore: .focus() example extend

---
 lib/helper/Playwright.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index c603c3cda..ef844226b 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -913,9 +913,9 @@ class Playwright extends Helper {
    * Examples:
    *
    * ```js
-   * I.dontSee('#add-to-cart');
+   * I.dontSee('#add-to-cart-btn');
    * I.focus('#product-tile')
-   * I.see('#add-to-cart');
+   * I.see('#add-to-cart-bnt');
    * ```
    *
    */

From c1bfe27548384066794f8f745da13e62ea54fef6 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 15 May 2023 21:50:42 +0800
Subject: [PATCH 09/35] TEST(new playwright api): focus(), blur()

---
 .../app/view/form/focus_blur_elements.php     | 54 +++++++++++++++++++
 test/helper/Playwright_test.js                | 27 ++++++++++
 2 files changed, 81 insertions(+)
 create mode 100644 test/data/app/view/form/focus_blur_elements.php

diff --git a/test/data/app/view/form/focus_blur_elements.php b/test/data/app/view/form/focus_blur_elements.php
new file mode 100644
index 000000000..bfb7c90e0
--- /dev/null
+++ b/test/data/app/view/form/focus_blur_elements.php
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Test Focus and Blur</title>
+    <style>
+        .message {
+            display: inline-block;
+            margin-left: 10px;
+        }
+    </style>
+</head>
+<body>
+
+<button id="button">Button</button>
+<span id="buttonMessage" class="message">Button not focused</span>
+
+<br/><br/>
+
+<input type="text" id="field" placeholder="Type Here">
+<span id="fieldMessage" class="message">Input field not focused</span>
+
+<br/><br/>
+
+<textarea id="textarea" placeholder="Write Here"></textarea>
+<span id="textareaMessage" class="message">Textarea not focused</span>
+
+<script>
+  document.getElementById('button').addEventListener('focus', function() {
+    document.getElementById('buttonMessage').innerText = 'Button is focused';
+  });
+
+  document.getElementById('button').addEventListener('blur', function() {
+    document.getElementById('buttonMessage').innerText = 'Button not focused';
+  });
+
+  document.getElementById('field').addEventListener('focus', function() {
+    document.getElementById('fieldMessage').innerText = 'Input field is focused';
+  });
+
+  document.getElementById('field').addEventListener('blur', function() {
+    document.getElementById('fieldMessage').innerText = 'Input field not focused';
+  });
+
+  document.getElementById('textarea').addEventListener('focus', function() {
+    document.getElementById('textareaMessage').innerText = 'Textarea is focused';
+  });
+
+  document.getElementById('textarea').addEventListener('blur', function() {
+    document.getElementById('textareaMessage').innerText = 'Textarea not focused';
+  });
+</script>
+
+</body>
+</html>
diff --git a/test/helper/Playwright_test.js b/test/helper/Playwright_test.js
index 9e274c9d5..6b48a6372 100644
--- a/test/helper/Playwright_test.js
+++ b/test/helper/Playwright_test.js
@@ -184,6 +184,33 @@ describe('Playwright', function () {
       .then(() => I.dontSee('Hovered', '#show')));
   });
 
+  describe('#focus, #blur', () => {
+    it('should focus a button, field and textarea', () => I.amOnPage('/form/focus_blur_elements')
+      .then(() => I.focus('#button'))
+      .then(() => I.see('Button is focused', '#buttonMessage'))
+      .then(() => I.focus('#field'))
+      .then(() => I.see('Button not focused', '#buttonMessage'))
+      .then(() => I.see('Input field is focused', '#fieldMessage'))
+      .then(() => I.focus('#textarea'))
+      .then(() => I.see('Button not focused', '#buttonMessage'))
+      .then(() => I.see('Input field not focused', '#fieldMessage'))
+      .then(() => I.see('Textarea is focused', '#textareaMessage')));
+
+    it('should blur focused button, field and textarea', () => I.amOnPage('/form/focus_blur_elements')
+      .then(() => I.focus('#button'))
+      .then(() => I.see('Button is focused', '#buttonMessage'))
+      .then(() => I.blur('#button'))
+      .then(() => I.see('Button not focused', '#buttonMessage'))
+      .then(() => I.focus('#field'))
+      .then(() => I.see('Input field is focused', '#fieldMessage'))
+      .then(() => I.blur('#field'))
+      .then(() => I.see('Input field not focused', '#fieldMessage'))
+      .then(() => I.focus('#textarea'))
+      .then(() => I.see('Textarea is focused', '#textareaMessage'))
+      .then(() => I.focus('#textarea'))
+      .then(() => I.see('Textarea not focused', '#textareaMessage')));
+  });
+
   describe('#switchToNextTab, #switchToPreviousTab, #openNewTab, #closeCurrentTab, #closeOtherTabs, #grabNumberOfOpenTabs', () => {
     it('should only have 1 tab open when the browser starts and navigates to the first page', () => I.amOnPage('/')
       .then(() => I.wait(1))

From e2e15ee2fabdf5cd5f1e64197ee91f12a7fa8c05 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 15 May 2023 21:51:18 +0800
Subject: [PATCH 10/35] bump playwright version

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 8c0712a17..a18f2dd24 100644
--- a/package.json
+++ b/package.json
@@ -122,7 +122,7 @@
     "json-server": "^0.10.1",
     "nightmare": "^3.0.2",
     "nodemon": "^1.19.4",
-    "playwright": "^1.23.2",
+    "playwright": "^1.32.3",
     "puppeteer": "^10.4.0",
     "qrcode-terminal": "^0.12.0",
     "rosie": "^1.6.0",

From b1f629799c026dc27a8a34e7c8ee11f25b24ce8f Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 15 May 2023 22:12:40 +0800
Subject: [PATCH 11/35] FEATURE(new playwright api): add .clear()

---
 lib/helper/Playwright.js | 25 +++++++++++++++++++++++++
 1 file changed, 25 insertions(+)

diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index ef844226b..c52c9ffbc 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -1530,11 +1530,36 @@ class Playwright extends Helper {
 
   /**
    * {{> clearField }}
+   * (deprecated) use `I.clear() instead`
    */
   async clearField(field) {
+    console.log('I.clearField() is DEPRECATED: use `I.clear()` to clear field or text area');
     return this.fillField(field, '');
   }
 
+  /**
+   * {{> clear }}
+   * Clear the <input>, <textarea> or [contenteditable] .
+   * @param {any} [options] [Additional options](https://playwright.dev/docs/api/class-locator#locator-clear) for available options object as 2nd argument.
+   *
+   * Examples:
+   *
+   * ```js
+   * I.clear('.text-area')
+   * ```
+   * ```js
+   * I.clear('#submit', { force: true }) // force to bypass the [actionability](https://playwright.dev/docs/actionability) checks.
+   * ```
+   *
+   */
+  async clear(locator, options = {}) {
+    const els = await this._locate(locator);
+    assertElementExists(els, locator, 'Input to clear');
+    const el = els[0];
+    await el.clear(options);
+    return this._waitForAction();
+  }
+
   /**
    * {{> appendField }}
    *

From 24a2f290b42de71859755d4cb592629ec842a8a2 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 15 May 2023 22:13:58 +0800
Subject: [PATCH 12/35] DOC(new playwright api): add .clear()

---
 docs/helpers/Playwright.md | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/docs/helpers/Playwright.md b/docs/helpers/Playwright.md
index 5ff284a02..e25926fba 100644
--- a/docs/helpers/Playwright.md
+++ b/docs/helpers/Playwright.md
@@ -445,6 +445,20 @@ I.checkOption('agree', '//form');
     ```> ⚠️ To avoid flakiness, option `force: true` is set by default 
 -   `options`   
 
+### clear
+
+{{> clear }}
+Clear the <input>, <textarea> or [contenteditable] .
+
+#### Parameters
+
+-   `locator`  
+-   `options` **any?** [Additional options][11] for available options object as 2nd argument.Examples:```js
+    I.clear('.text-area')
+    ``````js
+    I.clear('#submit', { force: true }) // force to bypass the [actionability](https://playwright.dev/docs/actionability) checks.
+    ``` 
+
 ### clearCookie
 
 Clears a cookie by name,

From 219eb7b332dfd01b65460510e1a2a61e6901f688 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 15 May 2023 22:29:54 +0800
Subject: [PATCH 13/35] TEST(new playwright api): add .clear()

---
 test/data/app/view/form/contenteditable.php | 19 ++++++++++++++++++
 test/helper/Playwright_test.js              | 22 +++++++++++++++++++++
 2 files changed, 41 insertions(+)
 create mode 100644 test/data/app/view/form/contenteditable.php

diff --git a/test/data/app/view/form/contenteditable.php b/test/data/app/view/form/contenteditable.php
new file mode 100644
index 000000000..a1f74e022
--- /dev/null
+++ b/test/data/app/view/form/contenteditable.php
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Content Editable</title>
+    <style>
+        #contenteditableDiv {
+            border: 1px solid #000;
+            padding: 10px;
+            width: 200px;
+            height: 200px;
+        }
+    </style>
+</head>
+<body>
+
+    <div id="contenteditableDiv" contenteditable="true">This is editable. Click here to edit this text.</div>
+
+</body>
+</html>
diff --git a/test/helper/Playwright_test.js b/test/helper/Playwright_test.js
index 6b48a6372..eb9ac3f86 100644
--- a/test/helper/Playwright_test.js
+++ b/test/helper/Playwright_test.js
@@ -481,6 +481,28 @@ describe('Playwright', function () {
     });
   });
 
+  describe('#clear', () => {
+    it('should clear input', async () => {
+      await I.amOnPage('/form/field');
+      await I.fillField('Name', 'value that is cleared using I.clear()');
+      await I.clear('Name');
+      await I.dontSeeInField('Name', 'value that is cleared using I.clear()');
+    });
+
+    it('should clear textarea', async () => {
+      await I.amOnPage('/form/textarea');
+      await I.fillField('#description', 'value that is cleared using I.clear()');
+      await I.clear('#description');
+      await I.dontSeeInField('#description', 'value that is cleared using I.clear()');
+    });
+
+    it('should clear contenteditable', async () => {
+      await I.amOnPage('/form/contenteditable');
+      await I.clear('#contenteditableDiv');
+      await I.dontSeeInField('#contenteditableDiv', 'This is editable. Click here to edit this text.');
+    });
+  });
+
   describe('#pressKey, #pressKeyDown, #pressKeyUp', () => {
     it('should be able to send special keys to element', async () => {
       await I.amOnPage('/form/field');

From 1cffaeefa011845fa79884a727ea0138ada191ca Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Wed, 17 May 2023 15:00:05 +0800
Subject: [PATCH 14/35] chore: change promises in tests to async/await style

---
 test/helper/Playwright_test.js | 58 ++++++++++++++++++++--------------
 1 file changed, 34 insertions(+), 24 deletions(-)

diff --git a/test/helper/Playwright_test.js b/test/helper/Playwright_test.js
index eb9ac3f86..03d81d2ff 100644
--- a/test/helper/Playwright_test.js
+++ b/test/helper/Playwright_test.js
@@ -185,30 +185,40 @@ describe('Playwright', function () {
   });
 
   describe('#focus, #blur', () => {
-    it('should focus a button, field and textarea', () => I.amOnPage('/form/focus_blur_elements')
-      .then(() => I.focus('#button'))
-      .then(() => I.see('Button is focused', '#buttonMessage'))
-      .then(() => I.focus('#field'))
-      .then(() => I.see('Button not focused', '#buttonMessage'))
-      .then(() => I.see('Input field is focused', '#fieldMessage'))
-      .then(() => I.focus('#textarea'))
-      .then(() => I.see('Button not focused', '#buttonMessage'))
-      .then(() => I.see('Input field not focused', '#fieldMessage'))
-      .then(() => I.see('Textarea is focused', '#textareaMessage')));
-
-    it('should blur focused button, field and textarea', () => I.amOnPage('/form/focus_blur_elements')
-      .then(() => I.focus('#button'))
-      .then(() => I.see('Button is focused', '#buttonMessage'))
-      .then(() => I.blur('#button'))
-      .then(() => I.see('Button not focused', '#buttonMessage'))
-      .then(() => I.focus('#field'))
-      .then(() => I.see('Input field is focused', '#fieldMessage'))
-      .then(() => I.blur('#field'))
-      .then(() => I.see('Input field not focused', '#fieldMessage'))
-      .then(() => I.focus('#textarea'))
-      .then(() => I.see('Textarea is focused', '#textareaMessage'))
-      .then(() => I.focus('#textarea'))
-      .then(() => I.see('Textarea not focused', '#textareaMessage')));
+    it('should focus a button, field and textarea', async () => {
+      await I.amOnPage('/form/focus_blur_elements');
+
+      await I.focus('#button');
+      await I.see('Button is focused', '#buttonMessage');
+
+      await I.focus('#field');
+      await I.see('Button not focused', '#buttonMessage');
+      await I.see('Input field is focused', '#fieldMessage');
+
+      await I.focus('#textarea');
+      await I.see('Button not focused', '#buttonMessage');
+      await I.see('Input field not focused', '#fieldMessage');
+      await I.see('Textarea is focused', '#textareaMessage');
+    });
+
+    it('should blur focused button, field and textarea', async () => {
+      await I.amOnPage('/form/focus_blur_elements');
+
+      await I.focus('#button');
+      await I.see('Button is focused', '#buttonMessage');
+      await I.blur('#button');
+      await I.see('Button not focused', '#buttonMessage');
+
+      await I.focus('#field');
+      await I.see('Input field is focused', '#fieldMessage');
+      await I.blur('#field');
+      await I.see('Input field not focused', '#fieldMessage');
+
+      await I.focus('#textarea');
+      await I.see('Textarea is focused', '#textareaMessage');
+      await I.blur('#textarea');
+      await I.see('Textarea not focused', '#textareaMessage');
+    });
   });
 
   describe('#switchToNextTab, #switchToPreviousTab, #openNewTab, #closeCurrentTab, #closeOtherTabs, #grabNumberOfOpenTabs', () => {

From 2eafe604492c8efcee45c24bd74c282d6e6a43cd Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Wed, 17 May 2023 18:29:02 +0800
Subject: [PATCH 15/35] FEATURE(new playwright api):generate both regular and
 promise-based helper definitions

---
 typings/tests/helpers/Playwright.types.ts   | 3 +++
 typings/tests/helpers/PlaywrightTs.types.ts | 3 +++
 2 files changed, 6 insertions(+)

diff --git a/typings/tests/helpers/Playwright.types.ts b/typings/tests/helpers/Playwright.types.ts
index 5cfbb30c3..b5de41246 100644
--- a/typings/tests/helpers/Playwright.types.ts
+++ b/typings/tests/helpers/Playwright.types.ts
@@ -58,6 +58,8 @@ playwright.click(str, str); // $ExpectType void
 playwright.click(str, null, { position }); // $ExpectType void
 playwright.clickLink(); // $ExpectType void
 playwright.forceClick(str); // $ExpectType void
+playwright.focus(str); // $ExpectType void
+playwright.blur(str); // $ExpectType void
 playwright.doubleClick(str); // $ExpectType void
 playwright.rightClick(str); // $ExpectType void
 playwright.checkOption(str); // $ExpectType void
@@ -70,6 +72,7 @@ playwright.pressKey(str); // $ExpectType void
 playwright.type(str); // $ExpectType void
 playwright.fillField(str, str); // $ExpectType void
 playwright.clearField(str); // $ExpectType void
+playwright.clear(str); // $ExpectType void
 playwright.appendField(str, str); // $ExpectType void
 playwright.seeInField(str, str); // $ExpectType void
 playwright.dontSeeInField(str, str); // $ExpectType void
diff --git a/typings/tests/helpers/PlaywrightTs.types.ts b/typings/tests/helpers/PlaywrightTs.types.ts
index 22a512129..8eefc83e3 100644
--- a/typings/tests/helpers/PlaywrightTs.types.ts
+++ b/typings/tests/helpers/PlaywrightTs.types.ts
@@ -54,6 +54,8 @@ playwright.click(str, str); // $ExpectType Promise<any>
 playwright.click(str, null, { position }); // $ExpectType Promise<any>
 playwright.clickLink(); // $ExpectType Promise<any>
 playwright.forceClick(str); // $ExpectType Promise<any>
+playwright.focus(str); // $ExpectType Promise<any>
+playwright.blur(str); // $ExpectType Promise<any>
 playwright.doubleClick(str); // $ExpectType Promise<any>
 playwright.rightClick(str); // $ExpectType Promise<any>
 playwright.checkOption(str); // $ExpectType Promise<any>
@@ -66,6 +68,7 @@ playwright.pressKey(str); // $ExpectType Promise<any>
 playwright.type(str); // $ExpectType Promise<any>
 playwright.fillField(str, str); // $ExpectType Promise<any>
 playwright.clearField(str); // $ExpectType Promise<any>
+playwright.clear(str); // $ExpectType Promise<any>
 playwright.appendField(str, str); // $ExpectType Promise<any>
 playwright.seeInField(str, str); // $ExpectType Promise<any>
 playwright.dontSeeInField(str, str); // $ExpectType Promise<any>

From b3ba843ca165cfbb514d5b0e0503e028e5345212 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Wed, 17 May 2023 19:38:59 +0800
Subject: [PATCH 16/35] FIX: use `findFields()` instead of default `_locate()`
 to locate an input

---
 lib/helper/Playwright.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index c52c9ffbc..12c4433b5 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -1553,7 +1553,7 @@ class Playwright extends Helper {
    *
    */
   async clear(locator, options = {}) {
-    const els = await this._locate(locator);
+    const els = await findFields.call(this, locator);
     assertElementExists(els, locator, 'Input to clear');
     const el = els[0];
     await el.clear(options);

From c358ccb0c2c9118f248f1c5849e8e54e2080f96f Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 29 May 2023 10:02:36 +0800
Subject: [PATCH 17/35] chore: replacing the old clearField method by new one

---
 lib/helper/Playwright.js       | 16 +++-------------
 test/helper/Playwright_test.js | 16 ++++++++--------
 2 files changed, 11 insertions(+), 21 deletions(-)

diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index 12c4433b5..73ee0d2f9 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -1530,29 +1530,19 @@ class Playwright extends Helper {
 
   /**
    * {{> clearField }}
-   * (deprecated) use `I.clear() instead`
-   */
-  async clearField(field) {
-    console.log('I.clearField() is DEPRECATED: use `I.clear()` to clear field or text area');
-    return this.fillField(field, '');
-  }
-
-  /**
-   * {{> clear }}
    * Clear the <input>, <textarea> or [contenteditable] .
    * @param {any} [options] [Additional options](https://playwright.dev/docs/api/class-locator#locator-clear) for available options object as 2nd argument.
    *
    * Examples:
    *
    * ```js
-   * I.clear('.text-area')
+   * I.clearField('.text-area')
    * ```
    * ```js
-   * I.clear('#submit', { force: true }) // force to bypass the [actionability](https://playwright.dev/docs/actionability) checks.
+   * I.clearField('#submit', { force: true }) // force to bypass the [actionability](https://playwright.dev/docs/actionability) checks.
    * ```
-   *
    */
-  async clear(locator, options = {}) {
+  async clearField(locator, options = {}) {
     const els = await findFields.call(this, locator);
     assertElementExists(els, locator, 'Input to clear');
     const el = els[0];
diff --git a/test/helper/Playwright_test.js b/test/helper/Playwright_test.js
index 03d81d2ff..be4e11a75 100644
--- a/test/helper/Playwright_test.js
+++ b/test/helper/Playwright_test.js
@@ -491,24 +491,24 @@ describe('Playwright', function () {
     });
   });
 
-  describe('#clear', () => {
+  describe('#clearField', () => {
     it('should clear input', async () => {
       await I.amOnPage('/form/field');
-      await I.fillField('Name', 'value that is cleared using I.clear()');
-      await I.clear('Name');
-      await I.dontSeeInField('Name', 'value that is cleared using I.clear()');
+      await I.fillField('Name', 'value that is cleared using I.clearField()');
+      await I.clearField('Name');
+      await I.dontSeeInField('Name', 'value that is cleared using I.clearField()');
     });
 
     it('should clear textarea', async () => {
       await I.amOnPage('/form/textarea');
-      await I.fillField('#description', 'value that is cleared using I.clear()');
-      await I.clear('#description');
-      await I.dontSeeInField('#description', 'value that is cleared using I.clear()');
+      await I.fillField('#description', 'value that is cleared using I.clearField()');
+      await I.clearField('#description');
+      await I.dontSeeInField('#description', 'value that is cleared using I.clearField()');
     });
 
     it('should clear contenteditable', async () => {
       await I.amOnPage('/form/contenteditable');
-      await I.clear('#contenteditableDiv');
+      await I.clearField('#contenteditableDiv');
       await I.dontSeeInField('#contenteditableDiv', 'This is editable. Click here to edit this text.');
     });
   });

From bde4a386b2008c738c8377114a8e93172fa47408 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 29 May 2023 10:25:06 +0800
Subject: [PATCH 18/35] chore: run docs script to regenerate doc. | Previous
 pool requests were merged without generating documentation.

---
 docs/helpers/Appium.md | 1 -
 1 file changed, 1 deletion(-)

diff --git a/docs/helpers/Appium.md b/docs/helpers/Appium.md
index 134cd93f9..4dbc724fd 100644
--- a/docs/helpers/Appium.md
+++ b/docs/helpers/Appium.md
@@ -25,7 +25,6 @@ Launch the daemon: `appium`
 
 This helper should be configured in codecept.conf.ts or codecept.conf.js
 
--   `appiumV2`: set this to true if you want to run with Appiumv2
 -   `app`: Application path. Local path or remote URL to an .ipa or .apk file, or a .zip containing one of these. Alias to desiredCapabilities.appPackage
 -   `host`: (default: 'localhost') Appium host
 -   `port`: (default: '4723') Appium port

From 18a49a4ceb663f34fa7ee873a39969180e79c8c4 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 29 May 2023 10:50:27 +0800
Subject: [PATCH 19/35] chore: remove definitions due to moving functionality
 to the old clearField method

---
 typings/tests/helpers/Playwright.types.ts   | 1 -
 typings/tests/helpers/PlaywrightTs.types.ts | 1 -
 2 files changed, 2 deletions(-)

diff --git a/typings/tests/helpers/Playwright.types.ts b/typings/tests/helpers/Playwright.types.ts
index b5de41246..f1c58de10 100644
--- a/typings/tests/helpers/Playwright.types.ts
+++ b/typings/tests/helpers/Playwright.types.ts
@@ -72,7 +72,6 @@ playwright.pressKey(str); // $ExpectType void
 playwright.type(str); // $ExpectType void
 playwright.fillField(str, str); // $ExpectType void
 playwright.clearField(str); // $ExpectType void
-playwright.clear(str); // $ExpectType void
 playwright.appendField(str, str); // $ExpectType void
 playwright.seeInField(str, str); // $ExpectType void
 playwright.dontSeeInField(str, str); // $ExpectType void
diff --git a/typings/tests/helpers/PlaywrightTs.types.ts b/typings/tests/helpers/PlaywrightTs.types.ts
index 8eefc83e3..4bc003391 100644
--- a/typings/tests/helpers/PlaywrightTs.types.ts
+++ b/typings/tests/helpers/PlaywrightTs.types.ts
@@ -68,7 +68,6 @@ playwright.pressKey(str); // $ExpectType Promise<any>
 playwright.type(str); // $ExpectType Promise<any>
 playwright.fillField(str, str); // $ExpectType Promise<any>
 playwright.clearField(str); // $ExpectType Promise<any>
-playwright.clear(str); // $ExpectType Promise<any>
 playwright.appendField(str, str); // $ExpectType Promise<any>
 playwright.seeInField(str, str); // $ExpectType Promise<any>
 playwright.dontSeeInField(str, str); // $ExpectType Promise<any>

From 882bfcd2682663ab102ecc31c9bb86457fda58c0 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 29 May 2023 11:42:46 +0800
Subject: [PATCH 20/35] CI: playwright install

---
 .github/workflows/playwright.yml | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml
index f393a4d0d..a6c308ec4 100644
--- a/.github/workflows/playwright.yml
+++ b/.github/workflows/playwright.yml
@@ -31,6 +31,8 @@ jobs:
     - uses: shivammathur/setup-php@v2
       with:
         php-version: 7.4
+    - name: playwright install
+      run: npx playwright@1.32.3 install
     - name: npm install
       run: |
         npm install --legacy-peer-deps

From 895d155d7f9e240a433b5a6dd1ad4cfeec03dfcc Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Mon, 29 May 2023 12:26:12 +0800
Subject: [PATCH 21/35] CI: playwright install

---
 .github/workflows/playwright.yml | 2 --
 1 file changed, 2 deletions(-)

diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml
index a6c308ec4..f393a4d0d 100644
--- a/.github/workflows/playwright.yml
+++ b/.github/workflows/playwright.yml
@@ -31,8 +31,6 @@ jobs:
     - uses: shivammathur/setup-php@v2
       with:
         php-version: 7.4
-    - name: playwright install
-      run: npx playwright@1.32.3 install
     - name: npm install
       run: |
         npm install --legacy-peer-deps

From 78f35c374b2e4bf7da9e0ab70d5b4a63ed135a7b Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Fri, 2 Jun 2023 20:02:01 +0800
Subject: [PATCH 22/35] FEATURE(new playwright api): add .clear() support of
 the old functionality in case of new codeceptjs version usage with old
 playwright

---
 lib/helper/Playwright.js | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index 73ee0d2f9..2ba7187e3 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -1543,11 +1543,19 @@ class Playwright extends Helper {
    * ```
    */
   async clearField(locator, options = {}) {
+    let result;
+
     const els = await findFields.call(this, locator);
     assertElementExists(els, locator, 'Input to clear');
     const el = els[0];
-    await el.clear(options);
-    return this._waitForAction();
+
+    if (typeof el.clear === 'function') {
+      await el.clear(options);
+      result = this._waitForAction();
+    } else {
+      result = this.fillField(locator, '');
+    }
+    return result;
   }
 
   /**

From 27a3eb01e277f57cf3e895b06b9ff2d0ae5f8c5c Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Fri, 2 Jun 2023 20:59:13 +0800
Subject: [PATCH 23/35] TEST(new playwright api): add support of the old
 functionality in case of new codeceptjs version usage with old playwright

---
 test/helper/Playwright_test.js | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/test/helper/Playwright_test.js b/test/helper/Playwright_test.js
index be4e11a75..6539cd474 100644
--- a/test/helper/Playwright_test.js
+++ b/test/helper/Playwright_test.js
@@ -508,6 +508,14 @@ describe('Playwright', function () {
 
     it('should clear contenteditable', async () => {
       await I.amOnPage('/form/contenteditable');
+
+      const isClearMethodPresent = await I.usePlaywrightTo('test', async ({ page }) => {
+        const contenteditableDiv = await page.locator('#contenteditableDiv');
+        return typeof contenteditableDiv.clear === 'function';
+      });
+      if (!isClearMethodPresent) {
+        this.skip();
+      }
       await I.clearField('#contenteditableDiv');
       await I.dontSeeInField('#contenteditableDiv', 'This is editable. Click here to edit this text.');
     });

From c307db60638271d19a5237ba2455b8b4fbc8d545 Mon Sep 17 00:00:00 2001
From: kobenguyent <kobenguyent@gmail.com>
Date: Fri, 2 Jun 2023 17:19:55 +0200
Subject: [PATCH 24/35] install playwright@1.32.3

---
 .github/workflows/playwright.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml
index f393a4d0d..472371c6e 100644
--- a/.github/workflows/playwright.yml
+++ b/.github/workflows/playwright.yml
@@ -34,6 +34,7 @@ jobs:
     - name: npm install
       run: |
         npm install --legacy-peer-deps
+        npm install playwright@1.32.3
       env:
         PUPPETEER_SKIP_CHROMIUM_DOWNLOAD: true
     - name: Install deps

From 9d6daa9a89daf5d417816d929188953a5c7f39e1 Mon Sep 17 00:00:00 2001
From: kobenguyent <kobenguyent@gmail.com>
Date: Fri, 2 Jun 2023 17:20:37 +0200
Subject: [PATCH 25/35] install playwright@1.32.3

---
 .github/workflows/playwright.yml | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml
index 472371c6e..f849bdb04 100644
--- a/.github/workflows/playwright.yml
+++ b/.github/workflows/playwright.yml
@@ -34,11 +34,10 @@ jobs:
     - name: npm install
       run: |
         npm install --legacy-peer-deps
-        npm install playwright@1.32.3
       env:
         PUPPETEER_SKIP_CHROMIUM_DOWNLOAD: true
     - name: Install deps
-      run: npx playwright install-deps
+      run: npm install playwright@1.32.3 & npx playwright install-deps
     - name: start a server
       run: "php -S 127.0.0.1:8000 -t test/data/app &"
     - name: run chromium tests

From 8523d875d5f69b754b1e854654d661fa85aad0b2 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Sun, 4 Jun 2023 12:22:16 +0800
Subject: [PATCH 26/35] TEST(new playwright api): check div editable text

---
 test/helper/Playwright_test.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/test/helper/Playwright_test.js b/test/helper/Playwright_test.js
index 6539cd474..f81ab705b 100644
--- a/test/helper/Playwright_test.js
+++ b/test/helper/Playwright_test.js
@@ -517,7 +517,7 @@ describe('Playwright', function () {
         this.skip();
       }
       await I.clearField('#contenteditableDiv');
-      await I.dontSeeInField('#contenteditableDiv', 'This is editable. Click here to edit this text.');
+      await I.dontSee('This is editable. Click here to edit this text.', '#contenteditableDiv');
     });
   });
 

From 2e66487551650e822197e2863bc0b814dc3816a1 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Sun, 4 Jun 2023 13:16:59 +0800
Subject: [PATCH 27/35] TEST(new playwright api): add support of the old
 functionality in case of new codeceptjs version usage with old playwright

---
 lib/helper/Playwright.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index 2ba7187e3..1d3783e82 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -1551,9 +1551,9 @@ class Playwright extends Helper {
 
     if (typeof el.clear === 'function') {
       await el.clear(options);
-      result = this._waitForAction();
+      result = await this._waitForAction();
     } else {
-      result = this.fillField(locator, '');
+      result = await this.fillField(locator, '');
     }
     return result;
   }

From 7d0d27cbe5cddc5aeccde1a55128c7c6de797bc6 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Sun, 4 Jun 2023 18:20:55 +0800
Subject: [PATCH 28/35] FIX(new playwright api): add .clear() support of the
 old functionality in case of new codeceptjs version usage with old playwright

---
 lib/helper/Playwright.js | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index 1d3783e82..d75e19347 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -1529,8 +1529,8 @@ class Playwright extends Helper {
   }
 
   /**
-   * {{> clearField }}
    * Clear the <input>, <textarea> or [contenteditable] .
+   * @param {CodeceptJS.LocatorOrString} locator field located by label|name|CSS|XPath|strict locator.
    * @param {any} [options] [Additional options](https://playwright.dev/docs/api/class-locator#locator-clear) for available options object as 2nd argument.
    *
    * Examples:
@@ -1544,13 +1544,14 @@ class Playwright extends Helper {
    */
   async clearField(locator, options = {}) {
     let result;
+    const isNewClearMethodPresent = typeof this.page.locator().clear === 'function';
 
-    const els = await findFields.call(this, locator);
-    assertElementExists(els, locator, 'Input to clear');
-    const el = els[0];
+    if (isNewClearMethodPresent) {
+      const els = await findFields.call(this, locator);
+      assertElementExists(els, locator, 'Field to clear');
 
-    if (typeof el.clear === 'function') {
-      await el.clear(options);
+      // TODO: locator change required after #3677 implementation
+      await this.page.locator(buildLocatorString(new Locator(locator))).clear(options);
       result = await this._waitForAction();
     } else {
       result = await this.fillField(locator, '');

From 772fb3694328dfa0e2c9a4044a5f34d296f6172a Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Sun, 4 Jun 2023 18:32:01 +0800
Subject: [PATCH 29/35] FEATURE(new playwright api): add .focus()

---
 lib/helper/Playwright.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index d75e19347..40f68e218 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -906,8 +906,8 @@ class Playwright extends Helper {
   }
 
   /**
-   * {{> focus }}
    * Calls [focus](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus) on the matching element.
+   * @param {CodeceptJS.LocatorOrString} locator field located by label|name|CSS|XPath|strict locator.
    * @param {any} [options] [Additional options](https://playwright.dev/docs/api/class-locator#locator-focus) for available options object as 2nd argument.
    *
    * Examples:
@@ -923,6 +923,7 @@ class Playwright extends Helper {
     const els = await this._locate(locator);
     assertElementExists(els, locator, 'Element to focus');
     const el = els[0];
+
     await el.focus(options);
     return this._waitForAction();
   }

From 4fd4d6082995b4058b67d9abf5d9c077d65a6522 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Sun, 4 Jun 2023 18:33:24 +0800
Subject: [PATCH 30/35] FEATURE(new playwright api): add .blur()

---
 lib/helper/Playwright.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index 40f68e218..cb4eeab53 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -929,9 +929,9 @@ class Playwright extends Helper {
   }
 
   /**
-   * {{> blur }}
    * Remove focus from a text input, button, etc
    * Calls [blur](https://playwright.dev/docs/api/class-locator#locator-blur) on the element.
+   * @param {CodeceptJS.LocatorOrString} locator field located by label|name|CSS|XPath|strict locator.
    * @param {any} [options] [Additional options](https://playwright.dev/docs/api/class-locator#locator-blur) for available options object as 2nd argument.
    *
    * Examples:
@@ -950,8 +950,9 @@ class Playwright extends Helper {
   async blur(locator, options = {}) {
     const els = await this._locate(locator);
     assertElementExists(els, locator, 'Element to blur');
-    const el = els[0];
-    await el.blur(options);
+
+    // TODO: locator change required after #3677 implementation
+    await this.page.locator(buildLocatorString(new Locator(locator))).blur(options);
     return this._waitForAction();
   }
 

From 057236913391a159e0414cda1dcbca622559692a Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Sun, 4 Jun 2023 18:34:18 +0800
Subject: [PATCH 31/35] DOC(new playwright api): add .focus()

---
 docs/helpers/Playwright.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/helpers/Playwright.md b/docs/helpers/Playwright.md
index e25926fba..2f059f700 100644
--- a/docs/helpers/Playwright.md
+++ b/docs/helpers/Playwright.md
@@ -413,7 +413,7 @@ Remove focus from a text input
 
 #### Parameters
 
--   `locator`  
+-   `locator` **([string][8] | [object][5])** field located by label|name|CSS|XPath|strict locator.
 -   `options` **any?** [Additional options][9] for available options object as 2nd argument.Examples:```js
     I.blur('.text-area')
     ``` 

From b4b06cc4ee1c8bbe80f91ea6a502304eb82f3a75 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Sun, 4 Jun 2023 18:42:31 +0800
Subject: [PATCH 32/35] TEST(new playwright api): skip test if using old
 version of the playwright.

---
 test/helper/Playwright_test.js | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/test/helper/Playwright_test.js b/test/helper/Playwright_test.js
index f81ab705b..b4f0d56ac 100644
--- a/test/helper/Playwright_test.js
+++ b/test/helper/Playwright_test.js
@@ -507,15 +507,14 @@ describe('Playwright', function () {
     });
 
     it('should clear contenteditable', async () => {
-      await I.amOnPage('/form/contenteditable');
-
-      const isClearMethodPresent = await I.usePlaywrightTo('test', async ({ page }) => {
-        const contenteditableDiv = await page.locator('#contenteditableDiv');
-        return typeof contenteditableDiv.clear === 'function';
+      const isClearMethodPresent = await I.usePlaywrightTo('check if new Playwright .clear() method present', async ({ page }) => {
+        return typeof page.locator().clear === 'function';
       });
       if (!isClearMethodPresent) {
         this.skip();
       }
+
+      await I.amOnPage('/form/contenteditable');
       await I.clearField('#contenteditableDiv');
       await I.dontSee('This is editable. Click here to edit this text.', '#contenteditableDiv');
     });

From fef31e51d94f00abcc50a23b767c2d9adc8e2dea Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Sun, 4 Jun 2023 18:46:37 +0800
Subject: [PATCH 33/35] chore: generate doc after merging

---
 docs/helpers/Playwright.md | 337 ++++++++++++++++++-------------------
 1 file changed, 166 insertions(+), 171 deletions(-)

diff --git a/docs/helpers/Playwright.md b/docs/helpers/Playwright.md
index 2f059f700..2a6a6bf41 100644
--- a/docs/helpers/Playwright.md
+++ b/docs/helpers/Playwright.md
@@ -41,40 +41,40 @@ Type: [object][5]
 
 -   `url` **[string][8]** base url of website to be tested
 -   `browser` **(`"chromium"` | `"firefox"` | `"webkit"` | `"electron"`)?** a browser to test on, either: `chromium`, `firefox`, `webkit`, `electron`. Default: chromium.
--   `show` **[boolean][26]?** show browser window.
--   `restart` **([string][8] | [boolean][26])?** restart strategy between tests. Possible values:-   'context' or **false** - restarts [browser context][33] but keeps running browser. Recommended by Playwright team to keep tests isolated.
+-   `show` **[boolean][30]?** show browser window.
+-   `restart` **([string][8] | [boolean][30])?** restart strategy between tests. Possible values:-   'context' or **false** - restarts [browser context][37] but keeps running browser. Recommended by Playwright team to keep tests isolated.
     -   'browser' or **true** - closes browser and opens it again between tests.
     -   'session' or 'keep' - keeps browser context and session, but cleans up cookies and localStorage between tests. The fastest option when running tests in windowed mode. Works with `keepCookies` and `keepBrowserState` options. This behavior was default before CodeceptJS 3.1
--   `timeout` **[number][12]?** -   [timeout][34] in ms of all Playwright actions .
--   `disableScreenshots` **[boolean][26]?** don't save screenshot on failure.
+-   `timeout` **[number][14]?** -   [timeout][38] in ms of all Playwright actions .
+-   `disableScreenshots` **[boolean][30]?** don't save screenshot on failure.
 -   `emulate` **any?** browser in device emulation mode.
--   `video` **[boolean][26]?** enables video recording for failed tests; videos are saved into `output/videos` folder
--   `keepVideoForPassedTests` **[boolean][26]?** save videos for passed tests; videos are saved into `output/videos` folder
--   `trace` **[boolean][26]?** record [tracing information][35] with screenshots and snapshots.
--   `keepTraceForPassedTests` **[boolean][26]?** save trace for passed tests.
--   `fullPageScreenshots` **[boolean][26]?** make full page screenshots on failure.
--   `uniqueScreenshotNames` **[boolean][26]?** option to prevent screenshot override if you have scenarios with the same name in different suites.
--   `keepBrowserState` **[boolean][26]?** keep browser state between tests when `restart` is set to 'session'.
--   `keepCookies` **[boolean][26]?** keep cookies between tests when `restart` is set to 'session'.
--   `waitForAction` **[number][12]?** how long to wait after click, doubleClick or PressKey actions in ms. Default: 100.
--   `waitForNavigation` **(`"load"` | `"domcontentloaded"` | `"networkidle"`)?** When to consider navigation succeeded. Possible options: `load`, `domcontentloaded`, `networkidle`. Choose one of those options is possible. See [Playwright API][36].
--   `pressKeyDelay` **[number][12]?** Delay between key presses in ms. Used when calling Playwrights page.type(...) in fillField/appendField
--   `getPageTimeout` **[number][12]?** config option to set maximum navigation time in milliseconds.
--   `waitForTimeout` **[number][12]?** default wait* timeout in ms. Default: 1000.
+-   `video` **[boolean][30]?** enables video recording for failed tests; videos are saved into `output/videos` folder
+-   `keepVideoForPassedTests` **[boolean][30]?** save videos for passed tests; videos are saved into `output/videos` folder
+-   `trace` **[boolean][30]?** record [tracing information][39] with screenshots and snapshots.
+-   `keepTraceForPassedTests` **[boolean][30]?** save trace for passed tests.
+-   `fullPageScreenshots` **[boolean][30]?** make full page screenshots on failure.
+-   `uniqueScreenshotNames` **[boolean][30]?** option to prevent screenshot override if you have scenarios with the same name in different suites.
+-   `keepBrowserState` **[boolean][30]?** keep browser state between tests when `restart` is set to 'session'.
+-   `keepCookies` **[boolean][30]?** keep cookies between tests when `restart` is set to 'session'.
+-   `waitForAction` **[number][14]?** how long to wait after click, doubleClick or PressKey actions in ms. Default: 100.
+-   `waitForNavigation` **(`"load"` | `"domcontentloaded"` | `"networkidle"`)?** When to consider navigation succeeded. Possible options: `load`, `domcontentloaded`, `networkidle`. Choose one of those options is possible. See [Playwright API][40].
+-   `pressKeyDelay` **[number][14]?** Delay between key presses in ms. Used when calling Playwrights page.type(...) in fillField/appendField
+-   `getPageTimeout` **[number][14]?** config option to set maximum navigation time in milliseconds.
+-   `waitForTimeout` **[number][14]?** default wait* timeout in ms. Default: 1000.
 -   `basicAuth` **[object][5]?** the basic authentication to pass to base url. Example: {username: 'username', password: 'password'}
 -   `windowSize` **[string][8]?** default window size. Set a dimension like `640x480`.
 -   `colorScheme` **(`"dark"` | `"light"` | `"no-preference"`)?** default color scheme. Possible values: `dark` | `light` | `no-preference`.
 -   `userAgent` **[string][8]?** user-agent string.
 -   `locale` **[string][8]?** locale string. Example: 'en-GB', 'de-DE', 'fr-FR', ...
--   `manualStart` **[boolean][26]?** do not start browser before a test, start it manually inside a helper with `this.helpers["Playwright"]._startBrowser()`.
+-   `manualStart` **[boolean][30]?** do not start browser before a test, start it manually inside a helper with `this.helpers["Playwright"]._startBrowser()`.
 -   `chromium` **[object][5]?** pass additional chromium options
 -   `firefox` **[object][5]?** pass additional firefox options
 -   `electron` **[object][5]?** (pass additional electron options
--   `channel` **any?** (While Playwright can operate against the stock Google Chrome and Microsoft Edge browsers available on the machine. In particular, current Playwright version will support Stable and Beta channels of these browsers. See [Google Chrome & Microsoft Edge][37].
--   `ignoreLog` **[Array][15]&lt;[string][8]>?** An array with console message types that are not logged to debug log. Default value is `['warning', 'log']`. E.g. you can set `[]` to log all messages. See all possible [values][38].
--   `ignoreHTTPSErrors` **[boolean][26]?** Allows access to untrustworthy pages, e.g. to a page with an expired certificate. Default value is `false`
--   `bypassCSP` **[boolean][26]?** bypass Content Security Policy or CSP
--   `highlightElement` **[boolean][26]?** highlight the interacting elements
+-   `channel` **any?** (While Playwright can operate against the stock Google Chrome and Microsoft Edge browsers available on the machine. In particular, current Playwright version will support Stable and Beta channels of these browsers. See [Google Chrome & Microsoft Edge][41].
+-   `ignoreLog` **[Array][19]&lt;[string][8]>?** An array with console message types that are not logged to debug log. Default value is `['warning', 'log']`. E.g. you can set `[]` to log all messages. See all possible [values][42].
+-   `ignoreHTTPSErrors` **[boolean][30]?** Allows access to untrustworthy pages, e.g. to a page with an expired certificate. Default value is `false`
+-   `bypassCSP` **[boolean][30]?** bypass Content Security Policy or CSP
+-   `highlightElement` **[boolean][30]?** highlight the interacting elements
 
 
 
@@ -408,14 +408,19 @@ I.attachFile('form input[name=avatar]', 'data/avatar.jpg');
 
 ### blur
 
-{{> blur }}
-Remove focus from a text input
+Remove focus from a text input, button, etc
+Calls [blur][9] on the element.
 
 #### Parameters
 
 -   `locator` **([string][8] | [object][5])** field located by label|name|CSS|XPath|strict locator.
 -   `options` **any?** [Additional options][9] for available options object as 2nd argument.Examples:```js
     I.blur('.text-area')
+    ``````js
+    //element `#product-tile` is focused
+    I.see('#add-to-cart-btn');
+    I.blur('#product-tile')
+    I.dontSee('#add-to-cart-btn');
     ``` 
 
 ### cancelPopup
@@ -439,26 +444,12 @@ I.checkOption('agree', '//form');
 
 -   `field` **([string][8] | [object][5])** checkbox located by label | name | CSS | XPath | strict locator.
 -   `context` **([string][8]? | [object][5])** (optional, `null` by default) element located by CSS | XPath | strict locator.
-    ⚠️ returns a _promise_ which is synchronized internally by recorder[Additional options][9] for check available as 3rd argument.Examples:```js
+    ⚠️ returns a _promise_ which is synchronized internally by recorder[Additional options][10] for check available as 3rd argument.Examples:```js
     // click on element at position
     I.checkOption('Agree', '.signup', { position: { x: 5, y: 5 } })
     ```> ⚠️ To avoid flakiness, option `force: true` is set by default 
 -   `options`   
 
-### clear
-
-{{> clear }}
-Clear the <input>, <textarea> or [contenteditable] .
-
-#### Parameters
-
--   `locator`  
--   `options` **any?** [Additional options][11] for available options object as 2nd argument.Examples:```js
-    I.clear('.text-area')
-    ``````js
-    I.clear('#submit', { force: true }) // force to bypass the [actionability](https://playwright.dev/docs/actionability) checks.
-    ``` 
-
 ### clearCookie
 
 Clears a cookie by name,
@@ -476,19 +467,16 @@ I.clearCookie('test');
 
 ### clearField
 
-Clears a `<textarea>` or text `<input>` element's value.
-
-```js
-I.clearField('Email');
-I.clearField('user[email]');
-I.clearField('#email');
-```
+Clear the <input>, <textarea> or [contenteditable] .
 
 #### Parameters
 
--   `field`  
--   `editable` **([string][8] | [object][5])** field located by label|name|CSS|XPath|strict locator.
-    ⚠️ returns a _promise_ which is synchronized internally by recorder.
+-   `locator` **([string][8] | [object][5])** field located by label|name|CSS|XPath|strict locator.
+-   `options` **any?** [Additional options][11] for available options object as 2nd argument.Examples:```js
+    I.clearField('.text-area')
+    ``````js
+    I.clearField('#submit', { force: true }) // force to bypass the [actionability](https://playwright.dev/docs/actionability) checks.
+    ``` 
 
 ### click
 
@@ -519,7 +507,7 @@ I.click({css: 'nav a.login'});
 -   `locator` **([string][8] | [object][5])** clickable link or button located by text, or any element located by CSS|XPath|strict locator.
 -   `context` **([string][8]? | [object][5] | null)** (optional, `null` by default) element to search in CSS|XPath|Strict locator.
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
--   `options` **any?** [Additional options][10] for click available as 3rd argument.Examples:```js
+-   `options` **any?** [Additional options][12] for click available as 3rd argument.Examples:```js
     // click on element at position
     I.click('canvas', '.model', { position: { x: 20, y: 40 } })
 
@@ -720,7 +708,7 @@ I.dragAndDrop('#dragHandle', '#container');
 -   `srcElement` **([string][8] | [object][5])** located by CSS|XPath|strict locator.
 -   `destElement` **([string][8] | [object][5])** located by CSS|XPath|strict locator.
     ⚠️ returns a _promise_ which is synchronized internally by recorder
--   `options` **any?** [Additional options][11] can be passed as 3rd argument.```js
+-   `options` **any?** [Additional options][13] can be passed as 3rd argument.```js
     // specify coordinates for source position
     I.dragAndDrop('img.src', 'img.dst', { sourcePosition: {x: 10, y: 10} })
     ```> By default option `force: true` is set 
@@ -738,7 +726,7 @@ I.dragSlider('#slider', -70);
 #### Parameters
 
 -   `locator` **([string][8] | [object][5])** located by label|name|CSS|XPath|strict locator.
--   `offsetX` **[number][12]** position to drag.
+-   `offsetX` **[number][14]** position to drag.
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
 
 ### executeScript
@@ -766,10 +754,10 @@ If a function returns a Promise it will wait for its resolution.
 
 #### Parameters
 
--   `fn` **([string][8] | [function][13])** function to be executed in browser context.
+-   `fn` **([string][8] | [function][15])** function to be executed in browser context.
 -   `arg` **any?** optional argument to pass to the function
 
-Returns **[Promise][14]&lt;any>** 
+Returns **[Promise][16]&lt;any>** 
 
 ### fillField
 
@@ -795,16 +783,15 @@ I.fillField({css: 'form#login input[name=username]'}, 'John');
 
 ### focus
 
-{{> focus }}
-Calls [focus][16] on the matching element.
+Calls [focus][17] on the matching element.
 
 #### Parameters
 
--   `locator`  
--   `options` **any?** [Additional options][17] for available options object as 2nd argument.Examples:```js
-    I.dontSee('#add-to-cart');
+-   `locator` **([string][8] | [object][5])** field located by label|name|CSS|XPath|strict locator.
+-   `options` **any?** [Additional options][18] for available options object as 2nd argument.Examples:```js
+    I.dontSee('#add-to-cart-btn');
     I.focus('#product-tile')
-    I.see('#add-to-cart');
+    I.see('#add-to-cart-bnt');
     ``` 
 
 ### forceClick
@@ -855,7 +842,7 @@ let hint = await I.grabAttributeFrom('#tooltip', 'title');
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
 -   `attr` **[string][8]** attribute name.
 
-Returns **[Promise][14]&lt;[string][8]>** attribute value
+Returns **[Promise][16]&lt;[string][8]>** attribute value
 
 ### grabAttributeFromAll
 
@@ -871,7 +858,7 @@ let hints = await I.grabAttributeFromAll('.tooltip', 'title');
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
 -   `attr` **[string][8]** attribute name.
 
-Returns **[Promise][14]&lt;[Array][15]&lt;[string][8]>>** attribute value
+Returns **[Promise][16]&lt;[Array][19]&lt;[string][8]>>** attribute value
 
 ### grabBrowserLogs
 
@@ -883,9 +870,9 @@ const errors = logs.map(l => ({ type: l.type(), text: l.text() })).filter(l => l
 console.log(JSON.stringify(errors));
 ```
 
-[Learn more about console messages][16]
+[Learn more about console messages][20]
 
-Returns **[Promise][14]&lt;[Array][15]&lt;any>>** 
+Returns **[Promise][16]&lt;[Array][19]&lt;any>>** 
 
 ### grabCookie
 
@@ -902,7 +889,7 @@ assert(cookie.value, '123456');
 
 -   `name` **[string][8]?** cookie name. 
 
-Returns **([Promise][14]&lt;[string][8]> | [Promise][14]&lt;[Array][15]&lt;[string][8]>>)** attribute valueReturns cookie in JSON format. If name not passed returns all cookies for this domain.
+Returns **([Promise][16]&lt;[string][8]> | [Promise][16]&lt;[Array][19]&lt;[string][8]>>)** attribute valueReturns cookie in JSON format. If name not passed returns all cookies for this domain.
 
 ### grabCssPropertyFrom
 
@@ -919,7 +906,7 @@ const value = await I.grabCssPropertyFrom('h3', 'font-weight');
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
 -   `cssProperty` **[string][8]** CSS property name.
 
-Returns **[Promise][14]&lt;[string][8]>** CSS value
+Returns **[Promise][16]&lt;[string][8]>** CSS value
 
 ### grabCssPropertyFromAll
 
@@ -935,7 +922,7 @@ const values = await I.grabCssPropertyFromAll('h3', 'font-weight');
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
 -   `cssProperty` **[string][8]** CSS property name.
 
-Returns **[Promise][14]&lt;[Array][15]&lt;[string][8]>>** CSS value
+Returns **[Promise][16]&lt;[Array][19]&lt;[string][8]>>** CSS value
 
 ### grabCurrentUrl
 
@@ -947,7 +934,7 @@ let url = await I.grabCurrentUrl();
 console.log(`Current URL is [${url}]`);
 ```
 
-Returns **[Promise][14]&lt;[string][8]>** current URL
+Returns **[Promise][16]&lt;[string][8]>** current URL
 
 ### grabDataFromPerformanceTiming
 
@@ -972,7 +959,7 @@ let data = await I.grabDataFromPerformanceTiming();
 }
 ```
 
-Returns **[Promise][14]&lt;any>** automatically synchronized promise through #recorder
+Returns **[Promise][16]&lt;any>** automatically synchronized promise through #recorder
 
 ### grabElementBoundingRect
 
@@ -1000,7 +987,7 @@ const width = await I.grabElementBoundingRect('h3', 'width');
 -   `prop`  
 -   `elementSize` **[string][8]?** x, y, width or height of the given element.
 
-Returns **([Promise][14]&lt;DOMRect> | [Promise][14]&lt;[number][12]>)** Element bounding rectangle
+Returns **([Promise][16]&lt;DOMRect> | [Promise][16]&lt;[number][14]>)** Element bounding rectangle
 
 ### grabHTMLFrom
 
@@ -1017,7 +1004,7 @@ let postHTML = await I.grabHTMLFrom('#post');
 -   `locator`  
 -   `element` **([string][8] | [object][5])** located by CSS|XPath|strict locator.
 
-Returns **[Promise][14]&lt;[string][8]>** HTML code for an element
+Returns **[Promise][16]&lt;[string][8]>** HTML code for an element
 
 ### grabHTMLFromAll
 
@@ -1033,7 +1020,7 @@ let postHTMLs = await I.grabHTMLFromAll('.post');
 -   `locator`  
 -   `element` **([string][8] | [object][5])** located by CSS|XPath|strict locator.
 
-Returns **[Promise][14]&lt;[Array][15]&lt;[string][8]>>** HTML code for an element
+Returns **[Promise][16]&lt;[Array][19]&lt;[string][8]>>** HTML code for an element
 
 ### grabNumberOfOpenTabs
 
@@ -1044,7 +1031,7 @@ Resumes test execution, so **should be used inside async function with `await`**
 let tabs = await I.grabNumberOfOpenTabs();
 ```
 
-Returns **[Promise][14]&lt;[number][12]>** number of open tabs
+Returns **[Promise][16]&lt;[number][14]>** number of open tabs
 
 ### grabNumberOfVisibleElements
 
@@ -1059,7 +1046,7 @@ let numOfElements = await I.grabNumberOfVisibleElements('p');
 
 -   `locator` **([string][8] | [object][5])** located by CSS|XPath|strict locator.
 
-Returns **[Promise][14]&lt;[number][12]>** number of visible elements
+Returns **[Promise][16]&lt;[number][14]>** number of visible elements
 
 ### grabPageScrollPosition
 
@@ -1070,7 +1057,7 @@ Resumes test execution, so **should be used inside an async function with `await
 let { x, y } = await I.grabPageScrollPosition();
 ```
 
-Returns **[Promise][14]&lt;PageScrollPosition>** scroll position
+Returns **[Promise][16]&lt;PageScrollPosition>** scroll position
 
 ### grabPopupText
 
@@ -1080,7 +1067,7 @@ Grab the text within the popup. If no popup is visible then it will return null
 await I.grabPopupText();
 ```
 
-Returns **[Promise][14]&lt;([string][8] | null)>** 
+Returns **[Promise][16]&lt;([string][8] | null)>** 
 
 ### grabSource
 
@@ -1091,7 +1078,7 @@ Resumes test execution, so **should be used inside async function with `await`**
 let pageSource = await I.grabSource();
 ```
 
-Returns **[Promise][14]&lt;[string][8]>** source code
+Returns **[Promise][16]&lt;[string][8]>** source code
 
 ### grabTextFrom
 
@@ -1108,7 +1095,7 @@ If multiple elements found returns first element.
 
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
 
-Returns **[Promise][14]&lt;[string][8]>** attribute value
+Returns **[Promise][16]&lt;[string][8]>** attribute value
 
 ### grabTextFromAll
 
@@ -1123,7 +1110,7 @@ let pins = await I.grabTextFromAll('#pin li');
 
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
 
-Returns **[Promise][14]&lt;[Array][15]&lt;[string][8]>>** attribute value
+Returns **[Promise][16]&lt;[Array][19]&lt;[string][8]>>** attribute value
 
 ### grabTitle
 
@@ -1134,7 +1121,7 @@ Resumes test execution, so **should be used inside async with `await`** operator
 let title = await I.grabTitle();
 ```
 
-Returns **[Promise][14]&lt;[string][8]>** title
+Returns **[Promise][16]&lt;[string][8]>** title
 
 ### grabValueFrom
 
@@ -1150,7 +1137,7 @@ let email = await I.grabValueFrom('input[name=email]');
 
 -   `locator` **([string][8] | [object][5])** field located by label|name|CSS|XPath|strict locator.
 
-Returns **[Promise][14]&lt;[string][8]>** attribute value
+Returns **[Promise][16]&lt;[string][8]>** attribute value
 
 ### grabValueFromAll
 
@@ -1165,14 +1152,14 @@ let inputs = await I.grabValueFromAll('//form/input');
 
 -   `locator` **([string][8] | [object][5])** field located by label|name|CSS|XPath|strict locator.
 
-Returns **[Promise][14]&lt;[Array][15]&lt;[string][8]>>** attribute value
+Returns **[Promise][16]&lt;[Array][19]&lt;[string][8]>>** attribute value
 
 ### handleDownloads
 
 Handles a file download. A file name is required to save the file on disk.
 Files are saved to "output" directory.
 
-Should be used with [FileSystem helper][17] to check that file were downloaded correctly.
+Should be used with [FileSystem helper][21] to check that file were downloaded correctly.
 
 ```js
 I.handleDownloads('downloads/avatar.jpg');
@@ -1185,7 +1172,7 @@ I.waitForFile('avatar.jpg', 5);
 
 -   `fileName` **[string][8]** set filename for downloaded file
 
-Returns **[Promise][14]&lt;void>** 
+Returns **[Promise][16]&lt;void>** 
 
 ### haveRequestHeaders
 
@@ -1203,7 +1190,7 @@ I.haveRequestHeaders({
 
 ### makeApiRequest
 
-Performs [api request][18] using
+Performs [api request][22] using
 the cookies from the current browser session.
 
 ```js
@@ -1220,22 +1207,22 @@ I.makeApiRequest('PATCH', )
 -   `url` **[string][8]** endpoint
 -   `options` **[object][5]** request options depending on method used
 
-Returns **[Promise][14]&lt;[object][5]>** response
+Returns **[Promise][16]&lt;[object][5]>** response
 
 ### mockRoute
 
-Mocks network request using [`browserContext.route`][19] of Playwright
+Mocks network request using [`browserContext.route`][23] of Playwright
 
 ```js
 I.mockRoute(/(.png$)|(.jpg$)/, route => route.abort());
 ```
 
-This method allows intercepting and mocking requests & responses. [Learn more about it][20]
+This method allows intercepting and mocking requests & responses. [Learn more about it][24]
 
 #### Parameters
 
--   `url` **([string][8] | [RegExp][21])?** URL, regex or pattern for to match URL
--   `handler` **[function][13]?** a function to process reques
+-   `url` **([string][8] | [RegExp][25])?** URL, regex or pattern for to match URL
+-   `handler` **[function][15]?** a function to process reques
 
 ### moveCursorTo
 
@@ -1250,8 +1237,8 @@ I.moveCursorTo('#submit', 5,5);
 #### Parameters
 
 -   `locator` **([string][8] | [object][5])** located by CSS|XPath|strict locator.
--   `offsetX` **[number][12]** (optional, `0` by default) X-axis offset. 
--   `offsetY` **[number][12]** (optional, `0` by default) Y-axis offset.
+-   `offsetX` **[number][14]** (optional, `0` by default) X-axis offset. 
+-   `offsetY` **[number][14]** (optional, `0` by default) Y-axis offset.
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
 
 ### openNewTab
@@ -1262,7 +1249,7 @@ Open new tab and automatically switched to new tab
 I.openNewTab();
 ```
 
-You can pass in [page options][22] to emulate device on this page
+You can pass in [page options][26] to emulate device on this page
 
 ```js
 // enable mobile
@@ -1277,7 +1264,7 @@ I.openNewTab({ isMobile: true });
 
 Presses a key in the browser (on a focused element).
 
-_Hint:_ For populating text field or textarea, it is recommended to use [`fillField`][23].
+_Hint:_ For populating text field or textarea, it is recommended to use [`fillField`][27].
 
 ```js
 I.pressKey('Backspace');
@@ -1336,14 +1323,14 @@ Some of the supported key names are:
 
 #### Parameters
 
--   `key` **([string][8] | [Array][15]&lt;[string][8]>)** key or array of keys to press.
-    ⚠️ returns a _promise_ which is synchronized internally by recorder_Note:_ Shortcuts like `'Meta'` + `'A'` do not work on macOS ([GoogleChrome/Puppeteer#1313][24]).
+-   `key` **([string][8] | [Array][19]&lt;[string][8]>)** key or array of keys to press.
+    ⚠️ returns a _promise_ which is synchronized internally by recorder_Note:_ Shortcuts like `'Meta'` + `'A'` do not work on macOS ([GoogleChrome/Puppeteer#1313][28]).
 
 ### pressKeyDown
 
 Presses a key in the browser and leaves it in a down state.
 
-To make combinations with modifier key and user operation (e.g. `'Control'` + [`click`][25]).
+To make combinations with modifier key and user operation (e.g. `'Control'` + [`click`][29]).
 
 ```js
 I.pressKeyDown('Control');
@@ -1360,7 +1347,7 @@ I.pressKeyUp('Control');
 
 Releases a key in the browser which was previously set to a down state.
 
-To make combinations with modifier key and user operation (e.g. `'Control'` + [`click`][25]).
+To make combinations with modifier key and user operation (e.g. `'Control'` + [`click`][29]).
 
 ```js
 I.pressKeyDown('Control');
@@ -1390,8 +1377,8 @@ First parameter can be set to `maximize`.
 
 #### Parameters
 
--   `width` **[number][12]** width in pixels or `maximize`.
--   `height` **[number][12]** height in pixels.
+-   `width` **[number][14]** width in pixels or `maximize`.
+-   `height` **[number][14]** height in pixels.
     ⚠️ returns a _promise_ which is synchronized internally by recorderUnlike other drivers Playwright changes the size of a viewport, not the window!
     Playwright does not control the window of a browser so it can't adjust its real size.
     It also can't maximize a window.Update configuration to change real window size on start:```js
@@ -1465,7 +1452,7 @@ I.saveScreenshot('debug.png', true) //resizes to available scrollHeight and scro
 #### Parameters
 
 -   `fileName` **[string][8]** file name to save.
--   `fullPage` **[boolean][26]** (optional, `false` by default) flag to enable fullscreen screenshot mode.
+-   `fullPage` **[boolean][30]** (optional, `false` by default) flag to enable fullscreen screenshot mode.
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
 
 ### scrollPageToBottom
@@ -1501,8 +1488,8 @@ I.scrollTo('#submit', 5, 5);
 #### Parameters
 
 -   `locator` **([string][8] | [object][5])** located by CSS|XPath|strict locator.
--   `offsetX` **[number][12]** (optional, `0` by default) X-axis offset. 
--   `offsetY` **[number][12]** (optional, `0` by default) Y-axis offset.
+-   `offsetX` **[number][14]** (optional, `0` by default) X-axis offset. 
+-   `offsetY` **[number][14]** (optional, `0` by default) Y-axis offset.
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
 
 ### see
@@ -1705,7 +1692,7 @@ I.seeNumberOfElements('#submitBtn', 1);
 #### Parameters
 
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
--   `num` **[number][12]** number of elements.
+-   `num` **[number][14]** number of elements.
     ⚠️ returns a _promise_ which is synchronized internally by recorder
 
 ### seeNumberOfVisibleElements
@@ -1720,7 +1707,7 @@ I.seeNumberOfVisibleElements('.buttons', 3);
 #### Parameters
 
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
--   `num` **[number][12]** number of elements.
+-   `num` **[number][14]** number of elements.
     ⚠️ returns a _promise_ which is synchronized internally by recorder
 
 ### seeTextEquals
@@ -1774,7 +1761,7 @@ I.selectOption('Which OS do you use?', ['Android', 'iOS']);
 #### Parameters
 
 -   `select` **([string][8] | [object][5])** field located by label|name|CSS|XPath|strict locator.
--   `option` **([string][8] | [Array][15]&lt;any>)** visible text or value of option.
+-   `option` **([string][8] | [Array][19]&lt;any>)** visible text or value of option.
     ⚠️ returns a _promise_ which is synchronized internally by recorder
 
 ### setCookie
@@ -1795,7 +1782,7 @@ I.setCookie([
 
 #### Parameters
 
--   `cookie` **(Cookie | [Array][15]&lt;Cookie>)** a cookie object or array of cookie objects.
+-   `cookie` **(Cookie | [Array][19]&lt;Cookie>)** a cookie object or array of cookie objects.
     ⚠️ returns a _promise_ which is synchronized internally by recorder
 
 ### stopMockingRoute
@@ -1811,8 +1798,8 @@ If no handler is passed, all mock requests for the rote are disabled.
 
 #### Parameters
 
--   `url` **([string][8] | [RegExp][21])?** URL, regex or pattern for to match URL
--   `handler` **[function][13]?** a function to process reques
+-   `url` **([string][8] | [RegExp][25])?** URL, regex or pattern for to match URL
+-   `handler` **[function][15]?** a function to process reques
 
 ### switchTo
 
@@ -1839,7 +1826,7 @@ I.switchToNextTab(2);
 
 #### Parameters
 
--   `num` **[number][12]**  
+-   `num` **[number][14]**  
 
 ### switchToPreviousTab
 
@@ -1852,13 +1839,13 @@ I.switchToPreviousTab(2);
 
 #### Parameters
 
--   `num` **[number][12]**  
+-   `num` **[number][14]**  
 
 ### type
 
 Types out the given text into an active field.
 To slow down typing use a second parameter, to set interval between key presses.
-_Note:_ Should be used when [`fillField`][23] is not an option.
+_Note:_ Should be used when [`fillField`][27] is not an option.
 
 ```js
 // passing in a string
@@ -1877,9 +1864,9 @@ I.type(secret('123456'));
 #### Parameters
 
 -   `keys`  
--   `delay` **[number][12]?** (optional) delay in ms between key presses
+-   `delay` **[number][14]?** (optional) delay in ms between key presses
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
--   `key` **([string][8] | [Array][15]&lt;[string][8]>)** or array of keys to type.
+-   `key` **([string][8] | [Array][19]&lt;[string][8]>)** or array of keys to type.
 
 ### uncheckOption
 
@@ -1898,7 +1885,7 @@ I.uncheckOption('agree', '//form');
 
 -   `field` **([string][8] | [object][5])** checkbox located by label | name | CSS | XPath | strict locator.
 -   `context` **([string][8]? | [object][5])** (optional, `null` by default) element located by CSS | XPath | strict locator.
-    ⚠️ returns a _promise_ which is synchronized internally by recorder[Additional options][27] for uncheck available as 3rd argument.Examples:```js
+    ⚠️ returns a _promise_ which is synchronized internally by recorder[Additional options][31] for uncheck available as 3rd argument.Examples:```js
     // click on element at position
     I.uncheckOption('Agree', '.signup', { position: { x: 5, y: 5 } })
     ```> ⚠️ To avoid flakiness, option `force: true` is set by default 
@@ -1911,7 +1898,7 @@ Use Playwright API inside a test.
 First argument is a description of an action.
 Second argument is async function that gets this helper as parameter.
 
-{ [`page`][28], [`browserContext`][29] [`browser`][30] } objects from Playwright API are available.
+{ [`page`][32], [`browserContext`][33] [`browser`][34] } objects from Playwright API are available.
 
 ```js
 I.usePlaywrightTo('emulate offline mode', async ({ browserContext }) => {
@@ -1922,7 +1909,7 @@ I.usePlaywrightTo('emulate offline mode', async ({ browserContext }) => {
 #### Parameters
 
 -   `description` **[string][8]** used to show in logs.
--   `fn` **[function][13]** async function that executed with Playwright helper as argumen
+-   `fn` **[function][15]** async function that executed with Playwright helper as argumen
 
 ### wait
 
@@ -1934,7 +1921,7 @@ I.wait(2); // wait 2 secs
 
 #### Parameters
 
--   `sec` **[number][12]** number of second to wait.
+-   `sec` **[number][14]** number of second to wait.
     ⚠️ returns a _promise_ which is synchronized internally by recorder
 
 ### waitForClickable
@@ -1951,7 +1938,7 @@ I.waitForClickable('.btn.continue', 5); // wait for 5 secs
 
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
 -   `waitTimeout`  
--   `sec` **[number][12]?** (optional, `1` by default) time in seconds to wait
+-   `sec` **[number][14]?** (optional, `1` by default) time in seconds to wait
     ⚠️ returns a _promise_ which is synchronized internally by recorder
 
 ### waitForDetached
@@ -1966,7 +1953,7 @@ I.waitForDetached('#popup');
 #### Parameters
 
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
--   `sec` **[number][12]** (optional, `1` by default) time in seconds to wait
+-   `sec` **[number][14]** (optional, `1` by default) time in seconds to wait
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
 
 ### waitForElement
@@ -1982,7 +1969,7 @@ I.waitForElement('.btn.continue', 5); // wait for 5 secs
 #### Parameters
 
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
--   `sec` **[number][12]?** (optional, `1` by default) time in seconds to wait
+-   `sec` **[number][14]?** (optional, `1` by default) time in seconds to wait
     ⚠️ returns a _promise_ which is synchronized internally by recorder
 
 ### waitForEnabled
@@ -1993,7 +1980,7 @@ Element can be located by CSS or XPath.
 #### Parameters
 
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
--   `sec` **[number][12]** (optional) time in seconds to wait, 1 by default.
+-   `sec` **[number][14]** (optional) time in seconds to wait, 1 by default.
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
 
 ### waitForFunction
@@ -2013,9 +2000,9 @@ I.waitForFunction((count) => window.requests == count, [3], 5) // pass args and
 
 #### Parameters
 
--   `fn` **([string][8] | [function][13])** to be executed in browser context.
--   `argsOrSec` **([Array][15]&lt;any> | [number][12])?** (optional, `1` by default) arguments for function or seconds. 
--   `sec` **[number][12]?** (optional, `1` by default) time in seconds to wait
+-   `fn` **([string][8] | [function][15])** to be executed in browser context.
+-   `argsOrSec` **([Array][19]&lt;any> | [number][14])?** (optional, `1` by default) arguments for function or seconds. 
+-   `sec` **[number][14]?** (optional, `1` by default) time in seconds to wait
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
 
 ### waitForInvisible
@@ -2030,14 +2017,14 @@ I.waitForInvisible('#popup');
 #### Parameters
 
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
--   `sec` **[number][12]** (optional, `1` by default) time in seconds to wait
+-   `sec` **[number][14]** (optional, `1` by default) time in seconds to wait
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
 
 ### waitForNavigation
 
 Waits for navigation to finish. By default takes configured `waitForNavigation` option.
 
-See [Playwright's reference][31]
+See [Playwright's reference][35]
 
 #### Parameters
 
@@ -2054,8 +2041,8 @@ I.waitForRequest(request => request.url() === 'http://example.com' && request.me
 
 #### Parameters
 
--   `urlOrPredicate` **([string][8] | [function][13])** 
--   `sec` **[number][12]?** seconds to wait 
+-   `urlOrPredicate` **([string][8] | [function][15])** 
+-   `sec` **[number][14]?** seconds to wait 
 
 ### waitForResponse
 
@@ -2068,8 +2055,8 @@ I.waitForResponse(response => response.url() === 'https://example.com' && respon
 
 #### Parameters
 
--   `urlOrPredicate` **([string][8] | [function][13])** 
--   `sec` **[number][12]?** number of seconds to wait 
+-   `urlOrPredicate` **([string][8] | [function][15])** 
+-   `sec` **[number][14]?** number of seconds to wait 
 
 ### waitForText
 
@@ -2085,7 +2072,7 @@ I.waitForText('Thank you, form has been submitted', 5, '#modal');
 #### Parameters
 
 -   `text` **[string][8]** to wait for.
--   `sec` **[number][12]** (optional, `1` by default) time in seconds to wait 
+-   `sec` **[number][14]** (optional, `1` by default) time in seconds to wait 
 -   `context` **([string][8] | [object][5])?** (optional) element located by CSS|XPath|strict locator.
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
 
@@ -2101,7 +2088,7 @@ I.waitForValue('//input', "GoodValue");
 
 -   `field` **([string][8] | [object][5])** input field.
 -   `value` **[string][8]** expected value.
--   `sec` **[number][12]** (optional, `1` by default) time in seconds to wait
+-   `sec` **[number][14]** (optional, `1` by default) time in seconds to wait
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
 
 ### waitForVisible
@@ -2116,8 +2103,8 @@ I.waitForVisible('#popup');
 #### Parameters
 
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
--   `sec` **[number][12]** (optional, `1` by default) time in seconds to wait
-    ⚠️ returns a _promise_ which is synchronized internally by recorderThis method accepts [React selectors][32]. 
+-   `sec` **[number][14]** (optional, `1` by default) time in seconds to wait
+    ⚠️ returns a _promise_ which is synchronized internally by recorderThis method accepts [React selectors][36]. 
 
 ### waitInUrl
 
@@ -2130,7 +2117,7 @@ I.waitInUrl('/info', 2);
 #### Parameters
 
 -   `urlPart` **[string][8]** value to check.
--   `sec` **[number][12]** (optional, `1` by default) time in seconds to wait
+-   `sec` **[number][14]** (optional, `1` by default) time in seconds to wait
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
 
 ### waitNumberOfVisibleElements
@@ -2144,8 +2131,8 @@ I.waitNumberOfVisibleElements('a', 3);
 #### Parameters
 
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
--   `num` **[number][12]** number of elements.
--   `sec` **[number][12]** (optional, `1` by default) time in seconds to wait
+-   `num` **[number][14]** number of elements.
+-   `sec` **[number][14]** (optional, `1` by default) time in seconds to wait
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
 
 ### waitToHide
@@ -2160,7 +2147,7 @@ I.waitToHide('#popup');
 #### Parameters
 
 -   `locator` **([string][8] | [object][5])** element located by CSS|XPath|strict locator.
--   `sec` **[number][12]** (optional, `1` by default) time in seconds to wait
+-   `sec` **[number][14]** (optional, `1` by default) time in seconds to wait
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
 
 ### waitUrlEquals
@@ -2175,7 +2162,7 @@ I.waitUrlEquals('http://127.0.0.1:8000/info');
 #### Parameters
 
 -   `urlPart` **[string][8]** value to check.
--   `sec` **[number][12]** (optional, `1` by default) time in seconds to wait
+-   `sec` **[number][14]** (optional, `1` by default) time in seconds to wait
     ⚠️ returns a _promise_ which is synchronized internally by recorder 
 
 [1]: https://github.com/microsoft/playwright
@@ -2194,62 +2181,70 @@ I.waitUrlEquals('http://127.0.0.1:8000/info');
 
 [8]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String
 
-[9]: https://playwright.dev/docs/api/class-elementhandle#element-handle-check
+[9]: https://playwright.dev/docs/api/class-locator#locator-blur
+
+[10]: https://playwright.dev/docs/api/class-elementhandle#element-handle-check
+
+[11]: https://playwright.dev/docs/api/class-locator#locator-clear
+
+[12]: https://playwright.dev/docs/api/class-page#page-click
+
+[13]: https://playwright.dev/docs/api/class-page#page-drag-and-drop
 
-[10]: https://playwright.dev/docs/api/class-page#page-click
+[14]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number
 
-[11]: https://playwright.dev/docs/api/class-page#page-drag-and-drop
+[15]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function
 
-[12]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number
+[16]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise
 
-[13]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function
+[17]: https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus
 
-[14]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise
+[18]: https://playwright.dev/docs/api/class-locator#locator-focus
 
-[15]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array
+[19]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array
 
-[16]: https://playwright.dev/docs/api/class-consolemessage
+[20]: https://playwright.dev/docs/api/class-consolemessage
 
-[17]: https://codecept.io/helpers/FileSystem
+[21]: https://codecept.io/helpers/FileSystem
 
-[18]: https://playwright.dev/docs/api/class-apirequestcontext#api-request-context-get
+[22]: https://playwright.dev/docs/api/class-apirequestcontext#api-request-context-get
 
-[19]: https://playwright.dev/docs/api/class-browsercontext#browser-context-route
+[23]: https://playwright.dev/docs/api/class-browsercontext#browser-context-route
 
-[20]: https://playwright.dev/docs/network#handle-requests
+[24]: https://playwright.dev/docs/network#handle-requests
 
-[21]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/RegExp
+[25]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/RegExp
 
-[22]: https://github.com/microsoft/playwright/blob/main/docs/api.md#browsernewpageoptions
+[26]: https://github.com/microsoft/playwright/blob/main/docs/api.md#browsernewpageoptions
 
-[23]: #fillfield
+[27]: #fillfield
 
-[24]: https://github.com/GoogleChrome/puppeteer/issues/1313
+[28]: https://github.com/GoogleChrome/puppeteer/issues/1313
 
-[25]: #click
+[29]: #click
 
-[26]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean
+[30]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean
 
-[27]: https://playwright.dev/docs/api/class-elementhandle#element-handle-uncheck
+[31]: https://playwright.dev/docs/api/class-elementhandle#element-handle-uncheck
 
-[28]: https://github.com/microsoft/playwright/blob/main/docs/src/api/class-page.md
+[32]: https://github.com/microsoft/playwright/blob/main/docs/src/api/class-page.md
 
-[29]: https://github.com/microsoft/playwright/blob/main/docs/src/api/class-browsercontext.md
+[33]: https://github.com/microsoft/playwright/blob/main/docs/src/api/class-browsercontext.md
 
-[30]: https://github.com/microsoft/playwright/blob/main/docs/src/api/class-browser.md
+[34]: https://github.com/microsoft/playwright/blob/main/docs/src/api/class-browser.md
 
-[31]: https://playwright.dev/docs/api/class-page?_highlight=waitfornavi#pagewaitfornavigationoptions
+[35]: https://playwright.dev/docs/api/class-page?_highlight=waitfornavi#pagewaitfornavigationoptions
 
-[32]: https://codecept.io/react
+[36]: https://codecept.io/react
 
-[33]: https://playwright.dev/docs/api/class-browsercontext
+[37]: https://playwright.dev/docs/api/class-browsercontext
 
-[34]: https://playwright.dev/docs/api/class-page#page-set-default-timeout
+[38]: https://playwright.dev/docs/api/class-page#page-set-default-timeout
 
-[35]: https://playwright.dev/docs/trace-viewer
+[39]: https://playwright.dev/docs/trace-viewer
 
-[36]: https://playwright.dev/docs/api/class-page#page-wait-for-navigation
+[40]: https://playwright.dev/docs/api/class-page#page-wait-for-navigation
 
-[37]: https://playwright.dev/docs/browsers/#google-chrome--microsoft-edge
+[41]: https://playwright.dev/docs/browsers/#google-chrome--microsoft-edge
 
-[38]: https://playwright.dev/docs/api/class-consolemessage#console-message-type
+[42]: https://playwright.dev/docs/api/class-consolemessage#console-message-type

From c4efd65f6dfb281d30650ee1b27b332f7f22c85b Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Sun, 4 Jun 2023 20:26:10 +0800
Subject: [PATCH 34/35] FEATURE(playwright new api): temporary migrate solution
 before full migration to Locator from old ElementHandle ( see #3677)

---
 lib/helper/Playwright.js | 37 ++++++++++++++++++++++++++++++++++---
 1 file changed, 34 insertions(+), 3 deletions(-)

diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index cb4eeab53..5b297f94b 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -1551,9 +1551,10 @@ class Playwright extends Helper {
     if (isNewClearMethodPresent) {
       const els = await findFields.call(this, locator);
       assertElementExists(els, locator, 'Field to clear');
-
       // TODO: locator change required after #3677 implementation
-      await this.page.locator(buildLocatorString(new Locator(locator))).clear(options);
+      const elXpath = await getXPathForElement(els[0]);
+
+      await this.page.locator(elXpath).clear(options);
       result = await this._waitForAction();
     } else {
       result = await this.fillField(locator, '');
@@ -2637,11 +2638,41 @@ function buildLocatorString(locator) {
   if (locator.isCustom()) {
     return `${locator.type}=${locator.value}`;
   } if (locator.isXPath()) {
-    // dont rely on heuristics of playwright for figuring out xpath
     return `xpath=${locator.value}`;
   }
   return locator.simplify();
 }
+// TODO: locator change required after #3677 implementation. Temporary solution before migration. Should be deleted after #3677 implementation
+async function getXPathForElement(elementHandle) {
+  function calculateIndex(node) {
+    let index = 1;
+    let sibling = node.previousElementSibling;
+    while (sibling) {
+      if (sibling.tagName === node.tagName) {
+        index++;
+      }
+      sibling = sibling.previousElementSibling;
+    }
+    return index;
+  }
+
+  function generateXPath(node) {
+    const segments = [];
+    while (node && node.nodeType === Node.ELEMENT_NODE) {
+      if (node.hasAttribute('id')) {
+        segments.unshift(`*[@id="${node.getAttribute('id')}"]`);
+        break;
+      } else {
+        const index = calculateIndex(node);
+        segments.unshift(`${node.localName}[${index}]`);
+        node = node.parentNode;
+      }
+    }
+    return `//${segments.join('/')}`;
+  }
+
+  return elementHandle.evaluate(generateXPath);
+}
 
 async function findElements(matcher, locator) {
   if (locator.react) return findReact(matcher, locator);

From 12ac20223eb6193a6e455a7748db76fa8dc9c471 Mon Sep 17 00:00:00 2001
From: EgorBodnar <maxameron@gmail.com>
Date: Sun, 4 Jun 2023 20:29:01 +0800
Subject: [PATCH 35/35] FEATURE(playwright new api): temporary migrate solution
 before full migration to Locator from old ElementHandle ( see #3677)

---
 lib/helper/Playwright.js | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/lib/helper/Playwright.js b/lib/helper/Playwright.js
index 5b297f94b..20a111af4 100644
--- a/lib/helper/Playwright.js
+++ b/lib/helper/Playwright.js
@@ -950,9 +950,10 @@ class Playwright extends Helper {
   async blur(locator, options = {}) {
     const els = await this._locate(locator);
     assertElementExists(els, locator, 'Element to blur');
-
     // TODO: locator change required after #3677 implementation
-    await this.page.locator(buildLocatorString(new Locator(locator))).blur(options);
+    const elXpath = await getXPathForElement(els[0]);
+
+    await this.page.locator(elXpath).blur(options);
     return this._waitForAction();
   }