fix(isVisible): do not wait for the selector to be resolved (#5393) (#5398)

docs/src/api/class-frame.md

@@ -761,7 +761,7 @@ Returns whether the element is [enabled](./actionability.md#enabled).
 ## async method: Frame.isHidden
 - returns: <[boolean]>
 
-Returns whether the element is hidden, the opposite of [visible](./actionability.md#visible).
+Returns whether the element is hidden, the opposite of [visible](./actionability.md#visible).  [`option: selector`] that does not match any elements is considered hidden.
 
 ### param: Frame.isHidden.selector = %%-input-selector-%%
 
@@ -770,7 +770,7 @@ Returns whether the element is hidden, the opposite of [visible](./actionability
 ## async method: Frame.isVisible
 - returns: <[boolean]>
 
-Returns whether the element is [visible](./actionability.md#visible).
+Returns whether the element is [visible](./actionability.md#visible). [`option: selector`] that does not match any elements is considered not visible.
 
 ### param: Frame.isVisible.selector = %%-input-selector-%%
 

docs/src/api/class-page.md

@@ -1477,7 +1477,7 @@ Returns whether the element is [enabled](./actionability.md#enabled).
 ## async method: Page.isHidden
 - returns: <[boolean]>
 
-Returns whether the element is hidden, the opposite of [visible](./actionability.md#visible).
+Returns whether the element is hidden, the opposite of [visible](./actionability.md#visible).  [`option: selector`] that does not match any elements is considered hidden.
 
 ### param: Page.isHidden.selector = %%-input-selector-%%
 
@@ -1486,7 +1486,7 @@ Returns whether the element is hidden, the opposite of [visible](./actionability
 ## async method: Page.isVisible
 - returns: <[boolean]>
 
-Returns whether the element is [visible](./actionability.md#visible).
+Returns whether the element is [visible](./actionability.md#visible). [`option: selector`] that does not match any elements is considered not visible.
 
 ### param: Page.isVisible.selector = %%-input-selector-%%
 

src/server/frames.ts

@@ -928,11 +928,10 @@ export class Frame extends EventEmitter {
   }
 
   async isVisible(selector: string, options: types.TimeoutOptions = {}): Promise<boolean> {
-    const info = this._page.selectors._parseSelector(selector);
-    const task = dom.visibleTask(info);
     return runAbortableTask(async progress => {
       progress.log(`  checking visibility of "${selector}"`);
-      return this._scheduleRerunnableTask(progress, info.world, task);
+      const element = await this.$(selector);
+      return element ? await element.isVisible() : false;
     }, this._page._timeoutSettings.timeout(options));
   }
 

test/elementhandle-convenience.spec.ts

@@ -159,16 +159,21 @@ it('getAttribute should be atomic', async ({ playwright, page }) => {
 
 it('isVisible and isHidden should work', async ({ page }) => {
   await page.setContent(`<div>Hi</div><span></span>`);
+
   const div = await page.$('div');
   expect(await div.isVisible()).toBe(true);
   expect(await div.isHidden()).toBe(false);
   expect(await page.isVisible('div')).toBe(true);
   expect(await page.isHidden('div')).toBe(false);
+
   const span = await page.$('span');
   expect(await span.isVisible()).toBe(false);
   expect(await span.isHidden()).toBe(true);
   expect(await page.isVisible('span')).toBe(false);
   expect(await page.isHidden('span')).toBe(true);
+
+  expect(await page.isVisible('no-such-element')).toBe(false);
+  expect(await page.isHidden('no-such-element')).toBe(true);
 });
 
 it('isEnabled and isDisabled should work', async ({ page }) => {

types/types.d.ts

@@ -2028,7 +2028,8 @@ export interface Page {
   }): Promise<boolean>;
 
   /**
-   * Returns whether the element is hidden, the opposite of [visible](https://github.com/microsoft/playwright/blob/master/docs/actionability.md#visible).
+   * Returns whether the element is hidden, the opposite of [visible](https://github.com/microsoft/playwright/blob/master/docs/actionability.md#visible).  `selector` that does not
+   * match any elements is considered hidden.
    * @param selector A selector to search for element. If there are multiple elements satisfying the selector, the first will be used. See [working with selectors](https://github.com/microsoft/playwright/blob/master/docs/selectors.md#working-with-selectors) for more details.
    * @param options 
    */
@@ -2044,7 +2045,8 @@ export interface Page {
   }): Promise<boolean>;
 
   /**
-   * Returns whether the element is [visible](https://github.com/microsoft/playwright/blob/master/docs/actionability.md#visible).
+   * Returns whether the element is [visible](https://github.com/microsoft/playwright/blob/master/docs/actionability.md#visible). `selector` that does not match any elements is
+   * considered not visible.
    * @param selector A selector to search for element. If there are multiple elements satisfying the selector, the first will be used. See [working with selectors](https://github.com/microsoft/playwright/blob/master/docs/selectors.md#working-with-selectors) for more details.
    * @param options 
    */
@@ -3992,7 +3994,8 @@ export interface Frame {
   }): Promise<boolean>;
 
   /**
-   * Returns whether the element is hidden, the opposite of [visible](https://github.com/microsoft/playwright/blob/master/docs/actionability.md#visible).
+   * Returns whether the element is hidden, the opposite of [visible](https://github.com/microsoft/playwright/blob/master/docs/actionability.md#visible).  `selector` that does not
+   * match any elements is considered hidden.
    * @param selector A selector to search for element. If there are multiple elements satisfying the selector, the first will be used. See [working with selectors](https://github.com/microsoft/playwright/blob/master/docs/selectors.md#working-with-selectors) for more details.
    * @param options 
    */
@@ -4008,7 +4011,8 @@ export interface Frame {
   }): Promise<boolean>;
 
   /**
-   * Returns whether the element is [visible](https://github.com/microsoft/playwright/blob/master/docs/actionability.md#visible).
+   * Returns whether the element is [visible](https://github.com/microsoft/playwright/blob/master/docs/actionability.md#visible). `selector` that does not match any elements is
+   * considered not visible.
    * @param selector A selector to search for element. If there are multiple elements satisfying the selector, the first will be used. See [working with selectors](https://github.com/microsoft/playwright/blob/master/docs/selectors.md#working-with-selectors) for more details.
    * @param options 
    */