fix: Treat header as banner role

The latest [aria-query version](https://github.com/A11yance/aria-query/releases/tag/v4.2.2) fixes the issue of failing to recognize `<header>` as a `banner` role.

Fixes: #578

Author: darekkay

package.json

@@ -39,7 +39,7 @@
   ],
   "dependencies": {
     "@babel/runtime": "^7.10.2",
-    "aria-query": "^4.0.2",
+    "aria-query": "^4.2.1",
     "dom-accessibility-api": "^0.4.5",
     "pretty-format": "^25.5.0"
   },

src/__tests__/queries.find.js

@@ -34,6 +34,7 @@ test('find asynchronously finds elements', async () => {
       <span title="test title" />
       <div role="dialog"></div>
       <div role="meter progressbar"></div>
+      <header>header</header>
     </div>
   `)
   await expect(findByLabelText('test-label')).resolves.toBeTruthy()
@@ -66,6 +67,9 @@ test('find asynchronously finds elements', async () => {
     findAllByRole('progressbar', {queryFallbacks: true}),
   ).resolves.toHaveLength(1)
 
+  await expect(findByRole('banner')).resolves.toBeTruthy()
+  await expect(findAllByRole('banner')).resolves.toHaveLength(1)
+
   await expect(findByTestId('test-id')).resolves.toBeTruthy()
   await expect(findAllByTestId('test-id')).resolves.toHaveLength(1)
 })