diff --git a/.gitignore b/.gitignore index 8e0c70cb..775d03c7 100644 --- a/.gitignore +++ b/.gitignore @@ -7,3 +7,5 @@ dist # when working with contributors package-lock.json yarn.lock + +.idea diff --git a/src/__tests__/element-queries.js b/src/__tests__/element-queries.js index 364de4aa..ba282664 100644 --- a/src/__tests__/element-queries.js +++ b/src/__tests__/element-queries.js @@ -28,21 +28,20 @@ test('query can return null', () => { expect(queryByAltText('LucyRicardo')).toBeNull() }) -test('get throws a useful error message', () => { - const { - getByLabelText, - getByDisplayValue, - getByPlaceholderText, - getByText, - getByTestId, - getByAltText, - getByTitle, - getByRole, - } = render( - `
`, + ) + }) + + test('ByLabelText', () => { + const {getByLabelText} = missingRenderResult + + expect(() => getByLabelText('LucyRicardo')) + .toThrowErrorMatchingInlineSnapshot(` Unable to find a label with the text of: LucyRicardo Ignored nodes: comments, script, style @@ -50,8 +49,13 @@ test('get throws a useful error message', () => {
`) - expect(() => getByPlaceholderText('LucyRicardo')) - .toThrowErrorMatchingInlineSnapshot(` + }) + + test('ByPlaceholderText', () => { + const {getByPlaceholderText} = missingRenderResult + + expect(() => getByPlaceholderText('LucyRicardo')) + .toThrowErrorMatchingInlineSnapshot(` Unable to find an element with the placeholder text of: LucyRicardo Ignored nodes: comments, script, style @@ -59,25 +63,69 @@ test('get throws a useful error message', () => {
`) - expect(() => getByText('LucyRicardo')).toThrowErrorMatchingInlineSnapshot(` - Unable to find an element with the text: LucyRicardo. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. + + expect(() => getByPlaceholderText(' LucyRicardo ')) + .toThrowErrorMatchingInlineSnapshot(` + Unable to find an element with the placeholder text of: LucyRicardo (normalized from ' LucyRicardo ') Ignored nodes: comments, script, style
`) - expect(() => getByText('Lucy Ricardo')) - .toThrowErrorMatchingInlineSnapshot(` - Unable to find an element with the text: Lucy Ricardo (normalized from 'Lucy Ricardo'). This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. + + expect(() => getByPlaceholderText(/LucyRicardo/)) + .toThrowErrorMatchingInlineSnapshot(` + Unable to find an element that its placeholder text match the regex: /LucyRicardo/ Ignored nodes: comments, script, style
`) - expect(() => getByText('LucyRicardo', {selector: 'span'})) - .toThrowErrorMatchingInlineSnapshot(` + + expect(() => getByPlaceholderText(() => false)) + .toThrowErrorMatchingInlineSnapshot(` + Unable to find an element that match the custom matcher: [anonymous function] + + Ignored nodes: comments, script, style +
+
+
+ `) + + function something() { + return false + } + something.customMatcherText = 'Lucy and Ricardo' + + expect(() => getByPlaceholderText(something)) + .toThrowErrorMatchingInlineSnapshot(` + Unable to find an element that match the custom matcher: Lucy and Ricardo + + Ignored nodes: comments, script, style +
+
+
+ `) + }) + + describe('ByText', () => { + test('Missing element', () => { + const {getByText} = missingRenderResult + + expect(() => getByText('LucyRicardo')) + .toThrowErrorMatchingInlineSnapshot(` + Unable to find an element with the text: LucyRicardo. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. + + Ignored nodes: comments, script, style +
+
+
+ `) + + expect(() => getByText('LucyRicardo', {selector: 'span'})) + .toThrowErrorMatchingInlineSnapshot(` Unable to find an element with the text: LucyRicardo, which matches selector 'span'. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. Ignored nodes: comments, script, style @@ -85,7 +133,121 @@ test('get throws a useful error message', () => {
`) - expect(() => getByTestId('LucyRicardo')).toThrowErrorMatchingInlineSnapshot(` + + expect(() => getByText(' LucyRicardo ', {})) + .toThrowErrorMatchingInlineSnapshot(` + Unable to find an element with the text: LucyRicardo (normalized from ' LucyRicardo '). This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. + + Ignored nodes: comments, script, style +
+
+
+ `) + + expect(() => getByText(/LucyRicardo/)) + .toThrowErrorMatchingInlineSnapshot(` + Unable to find an element that its text match the regex: /LucyRicardo/. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. + + Ignored nodes: comments, script, style +
+
+
+ `) + + expect(() => getByText(() => false)).toThrowErrorMatchingInlineSnapshot(` + Unable to find an element that match the custom matcher: [anonymous function]. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. + + Ignored nodes: comments, script, style +
+
+
+ `) + + function something() { + return false + } + something.customMatcherText = 'Lucy and Ricardo' + + expect(() => getByText(something)).toThrowErrorMatchingInlineSnapshot(` + Unable to find an element that match the custom matcher: Lucy and Ricardo. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible. + + Ignored nodes: comments, script, style +
+
+
+ `) + }) + + test('Multiple elements', () => { + const {getByText} = render( + `
LucyRicardoLucyRicardo