diff --git a/src/__tests__/suggestions.js b/src/__tests__/suggestions.js index 75c9ae56..fc871ce8 100644 --- a/src/__tests__/suggestions.js +++ b/src/__tests__/suggestions.js @@ -485,3 +485,26 @@ test('getSuggestedQuery does not create suggestions for script and style element expect(getSuggestedQuery(script, 'get', 'TestId')).toBeUndefined() expect(getSuggestedQuery(style, 'get', 'TestId')).toBeUndefined() }) + +// this is only a temporary fix. The problem is that at the moment @testing-library/dom +// not support label concatenation +// see https://github.com/testing-library/dom-testing-library/issues/545 +test('should get the first label with aria-labelledby contains multiple ids', () => { + const {container} = renderIntoDocument(` +
One
+
One
+ + `) + + expect( + getSuggestedQuery(container.querySelector('input'), 'get', 'labelText'), + ).toMatchObject({ + queryName: 'LabelText', + queryMethod: 'getByLabelText', + queryArgs: [/one/i], + variant: 'get', + }) +}) diff --git a/src/suggestions.js b/src/suggestions.js index 3e93fa5a..730cb9e0 100644 --- a/src/suggestions.js +++ b/src/suggestions.js @@ -15,9 +15,13 @@ function getLabelTextFor(element) { if (!label) { const ariaLabelledBy = element.getAttribute('aria-labelledby') if (ariaLabelledBy) { + // this is only a temporary fix. The problem is that at the moment @testing-library/dom + // not support label concatenation + // see https://github.com/testing-library/dom-testing-library/issues/545 + const firstId = ariaLabelledBy.split(' ')[0] // we're using this notation because with the # selector we would have to escape special characters e.g. user.name // see https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector#Escaping_special_characters - label = document.querySelector(`[id=${ariaLabelledBy}]`) + label = document.querySelector(`[id="${firstId}"]`) } }