vitest-dev / vitest-dev/vitest

Vitest browser errors suggest locator syntax that vitest doesn't support

Open
#8,309 3 comments 3 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

feat: browser pending triage
Dominant language
TypeScript
Stars
17.1k
Forks
2k
Avg merge
1d 22h
Merged PRs (30d)
94

Description

Describe the bug

I'm getting the following error when a getByText matches multiple elements:

Caused by: Error: strict mode violation: getByText('Country') resolved to 2 elements:
    1) <button type="button">…</button> aka locator('button').filter({ hasText: 'Country' })
    2) <span>…</span> aka locator('span').filter({ hasText: 'Country' })

Except, using either of those suggestions won't work, and results in:

TypeError: page.locator is not a function

It seems that Vitest is proxying only a limited set of functions to playwright, and the resulting playwright errors are suggesting things that vitest isn't proxying.

Reproduction

vitest-issue-8309.zip

Download, unzip, run yarn, then yarn test results in:

Caused by: Error: strict mode violation: getByText('Country') resolved to 4 elements:
    1) <button>Country of Birth</button> aka getByRole('button', { name: 'Country of Birth' })
    2) <span>Country of Birth</span> aka locator('span').filter({ hasText: 'Country of Birth' })
    3) <button>Country of Residence</button> aka getByRole('button', { name: 'Country of Residence' })
    4) <span>Country of Residence</span> aka locator('span').filter({ hasText: 'Country of Residence' })

But using the suggestions from lines 2 and 4 won't work, since vitest doesn't implement them.

System Info
System:
    OS: macOS 15.5
    CPU: (14) arm64 Apple M4 Pro
    Memory: 480.48 MB / 24.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.15.1 - ~/.asdf/installs/nodejs/22.15.1/bin/node
    Yarn: 4.9.2 - ~/.asdf/installs/nodejs/22.15.1/bin/yarn
    npm: 10.9.2 - ~/.asdf/plugins/nodejs/shims/npm
  Browsers:
    Brave Browser: 138.1.80.120
    Chrome: 138.0.7204.101
    Safari: 18.5
  npmPackages:
    @vitest/browser: ^3.2.4 => 3.2.4 
    @vitest/ui: ^3.2.4 => 3.2.4 
    playwright: ^1.54.1 => 1.54.1 
    vite: ^7.0.4 => 7.0.4 
    vitest: ^3.2.4 => 3.2.4 
    vitest-browser-svelte: ^1.0.0 => 1.0.0
Used Package Manager

yarn

Validations

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Download and unzip vitest-issue-8309.zip, then run yarn and yarn test to reproduce the locator error. Start by tracing how Vitest browser errors proxy Playwright suggestions and compare those suggestions with the supported functions; done means the reported guidance matches APIs available through Vitest. No source file or test path is named in the issue.

Written by the indexing model from the issue text.

Assessment

Tech stack
playwright, typescript
Domain
testing-qa
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.