Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Bug: getByRole('paragraph') doesn't work

See original GitHub issue

test(
  'getByRole("paragraph")',
  withBrowser.headed(async ({ utils, screen }) => {
    await utils.injectHTML(`<p>This is a paragraph</p>`);
    // throws
    const paragraph = await screen.getByRole('paragraph');
  })
);

The paragraph role is added automatically to the element by the browser. It shows up in the accessibility tree in Chrome DevTools. But the above fails.

Issue Analytics

State:
Created 2 years ago
Comments:5 (5 by maintainers)

Top GitHub Comments

1reaction

calebebycommented, Dec 2, 2021

I think this role was added in the latest aria spec which isn’t widely supported by tooling/browsers yet. I could be misremembering though, I will look into it

0reactions

calebebycommented, Dec 6, 2021

Oh now I am noticing that aria 1.1 is not the latest version, aria 1.2 is the latest published version. 1.2 lists the paragraph role: https://www.w3.org/TR/wai-aria-1.2/#paragraph. It shows <p> as a “related concept” which I don’t know if that means it is applied automatically. The HTML-aria spec still says <p> has no implicit role: https://www.w3.org/TR/html-aria/#el-p