fix: null labels on hidden inputs (#804)

* Ensure hidden inputs are not labelable The `labels` property on `input` elements of type `hidden` is `null` rather than `NodeList` [1]. This meant the `getRealLabels` function would return `null` causing `queryAllByLabelText` to throw an error when it tried to call `length` on `null` [2]. This commit fixes the issue by ensuring the element is labelable before calling `labels` on it, and adds a test case for this specific scenario. [1]: https://html.spec.whatwg.org/multipage/forms.html#dom-lfe-labels [2]: https://github.com/testing-library/dom-testing-library/blob/62f4e5e09a4b81ef66679560b540523edccdef98/src/queries/label-text.js#L52 * squash! Ensure hidden inputs are not labelable This commit fixes the issue by retuning an empty array if the `labels` property is `null`, and adds a test case for this specific scenario.

Author: thomasmarshall

src/__tests__/label-helpers.js

@@ -0,0 +1,7 @@
+import {getRealLabels} from '../label-helpers'
+
+test('hidden inputs are not labelable', () => {
+ const element = document.createElement('input')
+ element.type = 'hidden'
+ expect(getRealLabels(element)).toEqual([])
+})

src/__tests__/queries.find.js

@@ -35,6 +35,7 @@ test('find asynchronously finds elements', async () => {
  <div role="dialog"></div>
  <div role="meter progressbar"></div>
  <header>header</header>
+ <input type="hidden" />
  </div>
  `)
  await expect(findByLabelText('test-label')).resolves.toBeTruthy()

src/label-helpers.js

@@ -34,7 +34,7 @@ function getLabelContent(node) {
 
 // Based on https://github.com/eps1lon/dom-accessibility-api/pull/352
 function getRealLabels(element) {
- if (element.labels !== undefined) return element.labels
+ if (element.labels !== undefined) return element.labels ?? []
 
  if (!isLabelable(element)) return []