Skip to content

Commit a8362cb

Browse files
author
davidsa
committed
feat(config): add showLogOnfail config option to configure
 logging Closes #360
1 parent cf57dcd commit a8362cb

File tree

4 files changed

+199
-1
lines changed

4 files changed

+199
-1
lines changed

‎src/__tests__/__snapshots__/get-by-errors.js.snap

Lines changed: 153 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,153 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`getAllByAltText query will throw expected error message when config.showLogOnFail is false 1`] = `"Unable to find an element with the alt text: TEST QUERY"`;
4+
5+
exports[`getAllByAltText query will throw expected error message when config.showLogOnFail is true 1`] = `
6+
"Unable to find an element with the alt text: TEST QUERY
7+
8+
<div>
9+
<div />
10+
</div>"
11+
`;
12+
13+
exports[`getAllByLabelText query will throw expected error message when config.showLogOnFail is false 1`] = `"Unable to find a label with the text of: TEST QUERY"`;
14+
15+
exports[`getAllByLabelText query will throw expected error message when config.showLogOnFail is true 1`] = `
16+
"Unable to find a label with the text of: TEST QUERY
17+
18+
<div>
19+
<div />
20+
</div>"
21+
`;
22+
23+
exports[`getAllByPlaceholderText query will throw expected error message when config.showLogOnFail is false 1`] = `"Unable to find an element with the placeholder text of: TEST QUERY"`;
24+
25+
exports[`getAllByPlaceholderText query will throw expected error message when config.showLogOnFail is true 1`] = `
26+
"Unable to find an element with the placeholder text of: TEST QUERY
27+
28+
<div>
29+
<div />
30+
</div>"
31+
`;
32+
33+
exports[`getAllByRole query will throw expected error message when config.showLogOnFail is false 1`] = `
34+
"Unable to find an accessible element with the role \\"TEST QUERY\\"
35+
36+
There are no accessible roles. But there might be some inaccessible roles. If you wish to access them, then set the \`hidden\` option to \`true\`. Learn more about this here: https://testing-library.com/docs/dom-testing-library/api-queries#byrole"
37+
`;
38+
39+
exports[`getAllByRole query will throw expected error message when config.showLogOnFail is true 1`] = `
40+
"Unable to find an accessible element with the role "TEST QUERY"
41+
42+
There are no accessible roles. But there might be some inaccessible roles. If you wish to access them, then set the \`hidden\` option to \`true\`. Learn more about this here: https://testing-library.com/docs/dom-testing-library/api-queries#byrole
43+
44+
<div>
45+
<div />
46+
</div>"
47+
`;
48+
49+
exports[`getAllByTestId query will throw expected error message when config.showLogOnFail is false 1`] = `"Unable to find an element by: [data-testid=\\"TEST QUERY\\"]"`;
50+
51+
exports[`getAllByTestId query will throw expected error message when config.showLogOnFail is true 1`] = `
52+
"Unable to find an element by: [data-testid="TEST QUERY"]
53+
54+
<div>
55+
<div />
56+
</div>"
57+
`;
58+
59+
exports[`getAllByText query will throw expected error message when config.showLogOnFail is false 1`] = `"Unable to find an element with the text: TEST QUERY. 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."`;
60+
61+
exports[`getAllByText query will throw expected error message when config.showLogOnFail is true 1`] = `
62+
"Unable to find an element with the text: TEST QUERY. 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.
63+
64+
<div>
65+
<div />
66+
</div>"
67+
`;
68+
69+
exports[`getAllByTitle query will throw expected error message when config.showLogOnFail is false 1`] = `"Unable to find an element with the title: TEST QUERY."`;
70+
71+
exports[`getAllByTitle query will throw expected error message when config.showLogOnFail is true 1`] = `
72+
"Unable to find an element with the title: TEST QUERY.
73+
74+
<div>
75+
<div />
76+
</div>"
77+
`;
78+
79+
exports[`getByAltText query will throw expected error message when config.showLogOnFail is false 1`] = `"Unable to find an element with the alt text: TEST QUERY"`;
80+
81+
exports[`getByAltText query will throw expected error message when config.showLogOnFail is true 1`] = `
82+
"Unable to find an element with the alt text: TEST QUERY
83+
84+
<div>
85+
<div />
86+
</div>"
87+
`;
88+
89+
exports[`getByLabelText query will throw expected error message when config.showLogOnFail is false 1`] = `"Unable to find a label with the text of: TEST QUERY"`;
90+
91+
exports[`getByLabelText query will throw expected error message when config.showLogOnFail is true 1`] = `
92+
"Unable to find a label with the text of: TEST QUERY
93+
94+
<div>
95+
<div />
96+
</div>"
97+
`;
98+
99+
exports[`getByPlaceholderText query will throw expected error message when config.showLogOnFail is false 1`] = `"Unable to find an element with the placeholder text of: TEST QUERY"`;
100+
101+
exports[`getByPlaceholderText query will throw expected error message when config.showLogOnFail is true 1`] = `
102+
"Unable to find an element with the placeholder text of: TEST QUERY
103+
104+
<div>
105+
<div />
106+
</div>"
107+
`;
108+
109+
exports[`getByRole query will throw expected error message when config.showLogOnFail is false 1`] = `
110+
"Unable to find an accessible element with the role \\"TEST QUERY\\"
111+
112+
There are no accessible roles. But there might be some inaccessible roles. If you wish to access them, then set the \`hidden\` option to \`true\`. Learn more about this here: https://testing-library.com/docs/dom-testing-library/api-queries#byrole"
113+
`;
114+
115+
exports[`getByRole query will throw expected error message when config.showLogOnFail is true 1`] = `
116+
"Unable to find an accessible element with the role "TEST QUERY"
117+
118+
There are no accessible roles. But there might be some inaccessible roles. If you wish to access them, then set the \`hidden\` option to \`true\`. Learn more about this here: https://testing-library.com/docs/dom-testing-library/api-queries#byrole
119+
120+
<div>
121+
<div />
122+
</div>"
123+
`;
124+
125+
exports[`getByTestId query will throw expected error message when config.showLogOnFail is false 1`] = `"Unable to find an element by: [data-testid=\\"TEST QUERY\\"]"`;
126+
127+
exports[`getByTestId query will throw expected error message when config.showLogOnFail is true 1`] = `
128+
"Unable to find an element by: [data-testid="TEST QUERY"]
129+
130+
<div>
131+
<div />
132+
</div>"
133+
`;
134+
135+
exports[`getByText query will throw expected error message when config.showLogOnFail is false 1`] = `"Unable to find an element with the text: TEST QUERY. 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."`;
136+
137+
exports[`getByText query will throw expected error message when config.showLogOnFail is true 1`] = `
138+
"Unable to find an element with the text: TEST QUERY. 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.
139+
140+
<div>
141+
<div />
142+
</div>"
143+
`;
144+
145+
exports[`getByTitle query will throw expected error message when config.showLogOnFail is false 1`] = `"Unable to find an element with the title: TEST QUERY."`;
146+
147+
exports[`getByTitle query will throw expected error message when config.showLogOnFail is true 1`] = `
148+
"Unable to find an element with the title: TEST QUERY.
149+
150+
<div>
151+
<div />
152+
</div>"
153+
`;

‎src/__tests__/get-by-errors.js

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,12 @@
11
import cases from 'jest-in-case'
2+
import {configure, getConfig} from '../config'
23
import {render} from './helpers/test-utils'
34

5+
const originalConfig = getConfig()
6+
beforeEach(() => {
7+
configure(originalConfig)
8+
})
9+
410
cases(
511
'getBy* queries throw an error when there are multiple elements returned',
612
({name, query, html}) => {
@@ -39,6 +45,38 @@ cases(
3945
},
4046
)
4147

48+
const GET_BY_QUERIES = [
49+
'getByLabelText',
50+
'getByPlaceholderText',
51+
'getByText',
52+
'getByAltText',
53+
'getByTitle',
54+
'getByRole',
55+
'getByTestId',
56+
]
57+
const GET_ALL_BY_QUERIES = [
58+
'getAllByLabelText',
59+
'getAllByPlaceholderText',
60+
'getAllByText',
61+
'getAllByAltText',
62+
'getAllByTitle',
63+
'getAllByRole',
64+
'getAllByTestId',
65+
]
66+
test.each([
67+
...[...GET_BY_QUERIES, ...GET_ALL_BY_QUERIES].reduce((acc, query) => {
68+
acc.push([query, true], [query, false])
69+
return acc
70+
}, []),
71+
])(
72+
'%s query will throw expected error message when config.showLogOnFail is %s',
73+
(query, showLogOnFail) => {
74+
configure({showLogOnFail})
75+
const utils = render('<div />')
76+
expect(() => utils[query]('TEST QUERY')).toThrowErrorMatchingSnapshot()
77+
},
78+
)
79+
4280
cases(
4381
'queryBy* queries throw an error when there are multiple elements returned',
4482
({name, query, html}) => {

‎src/config.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,9 @@ let config = {
1414
asyncWrapper: cb => cb(),
1515
// default value for the `hidden` option in `ByRole` queries
1616
defaultHidden: false,
17+
18+
// should the DOM be logged to the console when getBy* or getAllBy* query fail
19+
showLogOnFail: true,
1720
}
1821

1922
export function configure(newConfig) {

‎src/query-helpers.js

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,13 @@
11
import {prettyDOM} from './pretty-dom'
22
import {fuzzyMatches, matches, makeNormalizer} from './matches'
33
import {waitForElement} from './wait-for-element'
4+
import {getConfig} from './config'
45

56
function getElementError(message, container) {
6-
return new Error([message, prettyDOM(container)].filter(Boolean).join('\n\n'))
7+
const errorMessages = getConfig().showLogOnFail
8+
? [message, prettyDOM(container)]
9+
: [message]
10+
return new Error(errorMessages.filter(Boolean).join('\n\n'))
711
}
812

913
function getMultipleElementsFoundError(message, container) {

0 commit comments

Comments
 (0)