diff --git a/src/__tests__/byText.test.js b/src/__tests__/byText.test.js index b64b81c76..52e0a770a 100644 --- a/src/__tests__/byText.test.js +++ b/src/__tests__/byText.test.js @@ -436,3 +436,36 @@ describe('Supports normalization', () => { expect(getByText('A text', { normalizer: normalizerFn })).toBeTruthy(); }); }); + +test('getByText and queryByText work properly with text nested in React.Fragment', () => { + const { getByText, queryByText } = render( + + <>Hello + + ); + expect(getByText('Hello')).toBeTruthy(); + expect(queryByText('Hello')).not.toBeNull(); +}); + +test('getByText and queryByText work properly with text partially nested in React.Fragment', () => { + const { getByText, queryByText } = render( + + He<>llo + + ); + expect(getByText('Hello')).toBeTruthy(); + expect(queryByText('Hello')).not.toBeNull(); +}); + +test('getByText and queryByText work properly with multiple nested fragments', () => { + const { getByText, queryByText } = render( + + He + <> + l<>lo + + + ); + expect(getByText('Hello')).toBeTruthy(); + expect(queryByText('Hello')).not.toBeNull(); +}); diff --git a/src/helpers/byText.js b/src/helpers/byText.js index 11de1113c..8615f0507 100644 --- a/src/helpers/byText.js +++ b/src/helpers/byText.js @@ -30,11 +30,15 @@ const getChildrenAsText = (children, TextComponent) => { // has no text. In such situations, react-test-renderer will traverse down // this tree in a separate call and run this query again. As a result, the // query will match the deepest text node that matches requested text. - if (filterNodeByType(child, TextComponent) && textContent.length === 0) { + if (filterNodeByType(child, TextComponent)) { return; } - getChildrenAsText(child.props.children, TextComponent); + if (filterNodeByType(child, React.Fragment)) { + textContent.push( + ...getChildrenAsText(child.props.children, TextComponent) + ); + } } });