fix(playwright): some wait funcs draw error due to switchTo iframe (#3918)

Author: kobenguyent

lib/helper/Playwright.js

@@ -2380,7 +2380,23 @@ class Playwright extends Helper {
     const waitTimeout = sec ? sec * 1000 : this.options.waitForTimeout;
     locator = new Locator(locator, 'css');
     const context = await this._getContext();
-    const waiter = context.waitForSelector(buildLocatorString(locator), { timeout: waitTimeout, state: 'visible' });
+    let waiter;
+    let count = 0;
+
+    // we have this as https://github.com/microsoft/playwright/issues/26829 is not yet implemented
+    if (this.frame) {
+      do {
+        waiter = await this.frame.locator(buildLocatorString(locator)).first().isVisible();
+        await this.wait(1);
+        count += 1000;
+        if (waiter) break;
+      } while (count <= waitTimeout);
+
+      if (!waiter) throw new Error(`element (${locator.toString()}) still not visible after ${waitTimeout / 1000} sec.`);
+      return;
+    }
+
+    waiter = context.waitForSelector(buildLocatorString(locator), { timeout: waitTimeout, state: 'visible' });
     return waiter.catch((err) => {
       throw new Error(`element (${locator.toString()}) still not visible after ${waitTimeout / 1000} sec\n${err.message}`);
     });
@@ -2393,7 +2409,23 @@ class Playwright extends Helper {
     const waitTimeout = sec ? sec * 1000 : this.options.waitForTimeout;
     locator = new Locator(locator, 'css');
     const context = await this._getContext();
-    const waiter = context.waitForSelector(buildLocatorString(locator), { timeout: waitTimeout, state: 'hidden' });
+    let waiter;
+    let count = 0;
+
+    // we have this as https://github.com/microsoft/playwright/issues/26829 is not yet implemented
+    if (this.frame) {
+      do {
+        waiter = await this.frame.locator(buildLocatorString(locator)).first().isHidden();
+        await this.wait(1);
+        count += 1000;
+        if (waiter) break;
+      } while (count <= waitTimeout);
+
+      if (!waiter) throw new Error(`element (${locator.toString()}) still visible after ${waitTimeout / 1000} sec.`);
+      return;
+    }
+
+    waiter = context.waitForSelector(buildLocatorString(locator), { timeout: waitTimeout, state: 'hidden' });
     return waiter.catch((err) => {
       throw new Error(`element (${locator.toString()}) still visible after ${waitTimeout / 1000} sec\n${err.message}`);
     });
@@ -2406,6 +2438,23 @@ class Playwright extends Helper {
     const waitTimeout = sec ? sec * 1000 : this.options.waitForTimeout;
     locator = new Locator(locator, 'css');
     const context = await this._getContext();
+
+    let waiter;
+    let count = 0;
+
+    // we have this as https://github.com/microsoft/playwright/issues/26829 is not yet implemented
+    if (this.frame) {
+      do {
+        waiter = await this.frame.locator(buildLocatorString(locator)).first().isHidden();
+        await this.wait(1);
+        count += 1000;
+        if (waiter) break;
+      } while (count <= waitTimeout);
+
+      if (!waiter) throw new Error(`element (${locator.toString()}) still not hidden after ${waitTimeout / 1000} sec.`);
+      return;
+    }
+
     return context.waitForSelector(buildLocatorString(locator), { timeout: waitTimeout, state: 'hidden' }).catch((err) => {
       throw new Error(`element (${locator.toString()}) still not hidden after ${waitTimeout / 1000} sec\n${err.message}`);
     });
@@ -2487,12 +2536,17 @@ class Playwright extends Helper {
     } else {
       // we have this as https://github.com/microsoft/playwright/issues/26829 is not yet implemented
       if (this.frame) {
-        const { setTimeout } = require('timers/promises');
-        await setTimeout(waitTimeout);
-        waiter = await this.frame.locator(`:has-text('${text}')`).first().isVisible();
+        let count = 0;
+        do {
+          waiter = await this.frame.locator(`:has-text('${text}')`).first().isVisible();
+          await this.wait(1);
+          count += 1000;
+        } while (count <= waitTimeout);
+
         if (!waiter) throw new Error(`Text "${text}" was not found on page after ${waitTimeout / 1000} sec`);
         return;
       }
+
       waiter = contextObject.waitForFunction(text => document.body && document.body.innerText.indexOf(text) > -1, text, { timeout: waitTimeout });
     }
     return waiter.catch((err) => {

test/helper/Playwright_test.js

@@ -130,6 +130,35 @@ describe('Playwright', function () {
     });
   });
 
+  describe('#waitForVisible #waitForInvisible - within block', () => {
+    it('should wait for visible element', async () => {
+      await I.amOnPage('/iframe');
+      await I._withinBegin({
+        frame: '#number-frame-1234',
+      });
+
+      await I.waitForVisible('h1');
+    });
+
+    it('should wait for invisible element', async () => {
+      await I.amOnPage('/iframe');
+      await I._withinBegin({
+        frame: '#number-frame-1234',
+      });
+
+      await I.waitForInvisible('h9');
+    });
+
+    it('should wait for element to hide', async () => {
+      await I.amOnPage('/iframe');
+      await I._withinBegin({
+        frame: '#number-frame-1234',
+      });
+
+      await I.waitToHide('h9');
+    });
+  });
+
   describe('#waitToHide', () => {
     it('should wait for hidden element', () => {
       return I.amOnPage('/form/wait_invisible')