toHaveAccessibleDescription does not include aria-label text

[greypants]

• @testing-library/jest-dom: "5.16.5"
• @testing-library/react: "13.4.0"
• node version: 18

Relevant code or config:

  it("includes svg aria-label in description text", () => {
    render(
      <>
        <label htmlFor="input-id">input</label>
        <input id="input-id" aria-describedby="description-id" />
        <div id="description-id">
          <svg role="img" aria-label="error" /> message
        </div>
      </>
    );

    expect(screen.getByLabelText("input")).toHaveAccessibleDescription("error message");
  });

What you did:

Screen readers include the svg aria-label in the accessible description, but jest-dom does not.

What happened:

    Expected element to have accessible description:
      error message
    Received:
      message

Reproduction:

https://codesandbox.io/s/react-testing-library-demo-forked-45xzdn?file=/src/__tests__/toHaveAccessibleDescription.js

Problem description:

aria-label contents are not included in the accessible description.

Suggested solution:

aria-label contents should be included in accessible descriptions.

[gnapse]

This library does not compute the accessible description itself. It relies on dom-accessibility-api for this.

@eps1lon as the owner of the repo for dom-accessibility-api, would you be able to chime in? I'm not sure if this is a known issue, or if we can transfer this issue to your repository.

I'm going to close this one, just because the fix does not lie in this library. But we can continue the discussion or even re-open if we need to.

[eps1lon]

@greypants Can you file this against https://github.com/eps1lon/dom-accessibility-api please so that we can track (we can't move the issue there unfortunately)?

[greypants]

Thanks! Moved here: eps1lon/dom-accessibility-api#955