Description
Version
1.40.1
Steps to reproduce
We have a big web application and we've been using Playwright for almost all pages. But there is one particular page that's showing this error in Playwright.
I have this snippet that clicks this button
await page.getByRole('button', {
name: Label.SAVE,
exact: true
}).click()
The button is visible in plain sight.
Expected behavior
I just expect that the button is clicked. I've been using the .click() function to click thousands of buttons but any buttons in this particular page is not working. I'm not a dev that's working on this particular page so I'm not sure what's different
Actual behavior
It does not wait for the timeout to finish (10 seconds). It just shows the error right away.
Error: expect.toBeVisible: TypeError: element.tagName.toUpperCase is not a function
at getImplicitAriaRole (<anonymous>:360:70)
at getAriaRole (<anonymous>:484:12)
at match (<anonymous>:2958:9)
at query (<anonymous>:2993:7)
at queryRole (<anonymous>:2999:3)
at Object.queryAll (<anonymous>:3012:16)
at InjectedScript._queryEngineAll (<anonymous>:4949:49)
at InjectedScript.querySelectorAll (<anonymous>:4936:30)
at eval (eval at evaluate (:226:30), <anonymous>:6:44)
at UtilityScript.evaluate (<anonymous>:228:17)
Call log:
- expect.toBeVisible with timeout 10000ms
- waiting for getByRole('button', { name: '保存する', exact: true })
at getImplicitAriaRole (C:\Users\Juvar\Projects\meetsmore\proone\tests\e2e\web\<anonymous>:360:70)
at match (C:\Users\Juvar\Projects\meetsmore\proone\tests\e2e\web\<anonymous>:2958:9)
at query (C:\Users\Juvar\Projects\meetsmore\proone\tests\e2e\web\<anonymous>:2993:7)
at queryRole (C:\Users\Juvar\Projects\meetsmore\proone\tests\e2e\web\<anonymous>:2999:3)
at Object.queryAll (C:\Users\Juvar\Projects\meetsmore\proone\tests\e2e\web\<anonymous>:3012:16)
at InjectedScript._queryEngineAll (C:\Users\Juvar\Projects\meetsmore\proone\tests\e2e\web\<anonymous>:4949:49)
at InjectedScript.querySelectorAll (C:\Users\Juvar\Projects\meetsmore\proone\tests\e2e\web\<anonymous>:4936:30)
at eval (C:\Users\Juvar\Projects\meetsmore\proone\tests\e2e\web\eval at evaluate (:226:30), <anonymous>:6:44)
at UtilityScript.evaluate (C:\Users\Juvar\Projects\meetsmore\proone\tests\e2e\web\<anonymous>:228:17)
at path\to\test.spec.ts:20:70
Additional context
The Save button.
<button class="some-classes ..." tabindex="0" type="submit">保存する<span class="MuiTouchRipple-root css-w0pj6f"></span></button>
All buttons are like this in other pages but it works on other pages.
I unfortunately cannot disclose the web application for you to try but please let me know what information you need to debug this.
Environment
System:
OS: Windows 11 10.0.22631
CPU: (8) x64 11th Gen Intel(R) Core(TM) i7-1165G7 @ 2.80GHz
Memory: 2.51 GB / 15.70 GB
Binaries:
Node: 20.11.0 - C:\Program Files\nodejs\node.EXE
Yarn: 4.1.0 - C:\Program Files\nodejs\yarn.CMD
npm: 10.2.4 - C:\Program Files\nodejs\npm.CMD
pnpm: 9.0.5 - C:\Program Files\nodejs\pnpm.CMD
IDEs:
VSCode: 1.88.1 - C:\Users\Juvar\AppData\Local\Programs\Microsoft VS Code\bin\code.CMD
npmPackages:
@playwright/test: ^1.40.1 => 1.42.1