getByRole does not recognise <progress /> element

[mush159]

• DOM Testing Library version: 6.10.1
• node version: 12.14.1
• npm (or yarn) version: 6.13.4

Relevant code or config:

Component:

export default () => (
  <progress value={10} max={100}>
    10%
  </progress>
);

Test:

test("Progress bar in document", () => {
  const { getByRole } = render(<App />);
  expect(getByRole("progressbar")).toBeInTheDocument();
});

What you did:

Attempt to get the <progress> element using the getByRole query API with "progressbar" as the role

What happened:

Test fails stating no elements with the role of "progressbar" could be found.

Reproduction:

https://codesandbox.io/s/react-testing-library-demo-5ybdb

Problem description:

The html progress element has an implicit role of "progressbar", dom-testing-library does not seem to be picking this up via its getByRole query.

Suggested solution:

[mush159]

Will be resolved by #446