[BUG] `page.locator.isVisible` returns `true` on hidden element

Context:

System:

• OS: Windows 10 10.0.19044
• Memory: 926.38 MB / 15.78 GB

Binaries:

• Node: 18.0.0 - C:\Program Files\nodejs\node.EXE
• npm: 8.7.0 - C:\Program Files\nodejs\npm.CMD

Languages:

• Bash: 5.0.17 - C:\WINDOWS\system32\bash.EXE

npmPackages:

• playwright: ^1.23.0 => 1.23.0

Code Snippet

test('test', async ({ page }) => {
    await page.goto('C:\\page.html')
    const selector = '.sapUiLocalBusyIndicatorAnimStandard'
    const isVisible = await page.locator(selector).isVisible()
    console.log(isVisible) // true
    await page.waitForSelector(selector, {state: 'hidden'}) // success
  })

Describe the bug this SAPUI5 busy indicator is not visible, and page.waitForSelector(selector, {state: 'hidden'}) succeeds, however page.locator.isVisible incorrectly returns true. the bounding box seems to also be empty:

unfortunately i’m not able to share the full html as it’s for an internal site, though i’m open to suggestions to try and provide a minimal example.

[pavelfeldman]

Thanks for the report! isVisible was not working correctly for elements that are inside <button> (role=button in your case).

[DetachHead]

@pavelfeldman

ok i was able to reproduce it with the example elements on the sapui5 docs

test('test', async ({ page }) => {
    await page.goto('https://sapui5.hana.ondemand.com/1.98.0/#/entity/sap.m.PullToRefresh/sample/sap.m.sample.PullToRefresh')
    await page.click('"Reject All"')
    await page.waitForSelector("span:text-is('Refresh')")
    const selector = '.sapUiLocalBusyIndicatorAnimStandard'
    const isVisible = await page.locator(selector).isVisible()
    await page.waitForSelector(selector, {state: 'hidden'})
    console.log('selector was hidden, but isVisible was', isVisible) // selector was hidden, but isVisible was true
})