Can't find dt / dd tags by role `definition`

Describe the bug

This is partly a (possible) bug report and partly a question that I'm not able to figure out.

Question - What is the appropriate way to find a dt/dd pair using accessible finders? In our existing code we structure it like this

<dl>
  <dt id="whatever">hello</dt>
  <dd aria-labelledby="whatever">world</dd>
</dl>

And then with @testing-library/react we are able to do

expect(screen.getByRole('definition', { name: "hello" })).toHaveTextContent("world");

It feels like this should be achievable without adding the aria-labelledby but I can't figure out appropriate finders to make these assertions.

Possible bug - This equivalent assertion above does not work with vitest-browser-react or vitest/browser/context. I can't find any good way of finding these elements using these libraries. In both libraries I get

❯ vitest-example/HelloWorld.test.tsx:13:9
     11|       await expect
     12|         .element(getByRole(role, { name: "hello" }))
     13|         .toHaveTextContent("world");
       |         ^
     14|     });
     15|

Caused by: VitestBrowserElementError: Cannot find element with locator: locator('body').getByRole('definition', { name: 'hello' })

I'm not sure if the testing-library behaviour is correct, so maybe this isn't technically a bug, but I can't figure out what the correct way to find them would be. Looking at chromes accessibility tool I'd expect to find it with

page.findByRole('term', { name: 'hello' })

but that doesn't work either.

(screenshot from https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/dd)

Reproduction

https://github.com/mjewell/vitest-find-definition

Is it possible to get a Stackblitz example set up that has browser mode working? That'd be great so it was easier to report browser related bugs without having to create a github repo.

System Info

System:
    OS: macOS 15.6
    CPU: (10) arm64 Apple M1 Max
    Memory: 19.47 GB / 64.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.18.1 - ~/.asdf/installs/nodejs/20.18.1/bin/node
    Yarn: 1.22.22 - ~/.asdf/installs/nodejs/20.18.1/bin/yarn
    npm: 10.8.2 - ~/.asdf/plugins/nodejs/shims/npm
    pnpm: 9.15.5 - ~/.asdf/installs/nodejs/20.18.1/bin/pnpm
    Watchman: 2024.12.02.00 - /opt/homebrew/bin/watchman
  Browsers:
    Chrome: 139.0.7258.66
    Safari: 18.6
  npmPackages:
    @vitejs/plugin-react: ^4.7.0 => 4.7.0
    @vitest/browser: ^3.2.4 => 3.2.4
    playwright: ^1.54.2 => 1.54.2
    vitest: ^3.2.4 => 3.2.4
    vitest-browser-react: ^1.0.1 => 1.0.1

Used Package Manager

npm

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

Start with the HelloWorld.test.tsx reproduction in https://github.com/mjewell/vitest-find-definition and run the browser-mode test using the reported vitest-browser-react setup. Compare the getByRole('definition', { name: 'hello' }) and getByRole('term', { name: 'hello' }) cases, then verify the expected locator behavior against the accessible finder results shown in the report.