[Bug]: getByRole can't find element with the accessible name from label element when aria-labelledby is not valid #33644
Description
Version
1.48.2
Steps to reproduce
- clone https://github.com/mehm8128/playwright-getByRole-repro
- run
npm i - start
src/index.htmlwith live server or such tools and visithttp://127.0.0.1:5500/src/index.html(port may depend on your environment - run
npm run test - you will see such result below
Running 1 test using 1 worker
[chromium] › repro.spec.ts:3:5 › click two textboxes
textbox1 1
textbox2 0
1) [chromium] › repro.spec.ts:3:5 › click two textboxes ────────────────────────────────────────────────────
Test timeout of 30000ms exceeded.
Error: locator.click: Test timeout of 30000ms exceeded.
Call log:
- waiting for getByRole('textbox', { name: 'TestField2' })
9 | const textbox2 = page.getByRole("textbox", { name: "TestField2" });
10 | console.log("textbox2", await textbox2.count());
> 11 | await textbox2.click();
| ^
12 | });
13 |
at /Users/y_oyama/Desktop/playwright-getByRole-repro/tests/repro.spec.ts:11:17
Slow test file: [chromium] › repro.spec.ts (30.0s)
Consider splitting slow test files to speed up parallel execution
1 failed
[chromium] › repro.spec.ts:3:5 › click two textboxes ─────────────────────────────────────────────────────
Expected behavior
We want to see such result below and want test to pass (number represents the count of found elements).
textbox1 1
textbox2 1
Actual behavior
textbox2 is not found by getByRole and test is fail.
Additional context
In Chrome browser, when we check the input element of TextField2 with devtools, we can see such a11y information.
This shows this input element has accessible name 'TestField2' from wrapped label and invalid aria-labelledby is disabled, so we want to get this element with getByRole('textbox', { name: 'TestField2' }. But playwright can't find this element with such query probably because getByRole doesn't find it by proper way.
Thank you for checking my issue.
Environment
System:
OS: macOS 14.2
CPU: (8) arm64 Apple M2
Memory: 363.39 MB / 16.00 GB
Binaries:
Node: 22.11.0 - ~/.local/share/mise/installs/node/latest/bin/node
npm: 10.9.0 - ~/.local/share/mise/installs/node/latest/bin/npm
IDEs:
VSCode: 1.94.2 - /usr/local/bin/code
Languages:
Bash: 3.2.57 - /bin/bash
npmPackages:
@playwright/test: ^1.48.2 => 1.48.2