Skip to content

Commit 0bd1ed9

Browse files
kiranjdgnapse
andauthored
fix: Adds expected text for toContainHTML checks that fail (#299) (#318)
Co-authored-by: Ernesto García <[email protected]>
1 parent 4179117 commit 0bd1ed9

File tree

2 files changed

+97
-66
lines changed

2 files changed

+97
-66
lines changed

src/__tests__/to-contain-html.js

Lines changed: 94 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
import {render} from './helpers/test-utils'
22

33
/* eslint-disable max-statements */
4-
test('.toContainHTML', () => {
5-
const {queryByTestId} = render(`
4+
describe('.toContainHTML', () => {
5+
test('handles positive and negative cases', () => {
6+
const {queryByTestId} = render(`
67
<span data-testid="grandparent">
78
<span data-testid="parent">
89
<span data-testid="child"></span>
@@ -11,69 +12,97 @@ test('.toContainHTML', () => {
1112
</span>
1213
`)
1314

14-
const grandparent = queryByTestId('grandparent')
15-
const parent = queryByTestId('parent')
16-
const child = queryByTestId('child')
17-
const nonExistantElement = queryByTestId('not-exists')
18-
const fakeElement = {thisIsNot: 'an html element'}
19-
const stringChildElement = '<span data-testid="child"></span>'
20-
const incorrectStringHtml = '<span data-testid="child"></div>'
21-
const nonExistantString = '<span> Does not exists </span>'
22-
const svgElement = queryByTestId('svg-element')
15+
const grandparent = queryByTestId('grandparent')
16+
const parent = queryByTestId('parent')
17+
const child = queryByTestId('child')
18+
const nonExistantElement = queryByTestId('not-exists')
19+
const fakeElement = {thisIsNot: 'an html element'}
20+
const stringChildElement = '<span data-testid="child"></span>'
21+
const incorrectStringHtml = '<span data-testid="child"></div>'
22+
const nonExistantString = '<span> Does not exists </span>'
23+
const svgElement = queryByTestId('svg-element')
2324

24-
expect(grandparent).toContainHTML(stringChildElement)
25-
expect(parent).toContainHTML(stringChildElement)
26-
expect(child).toContainHTML(stringChildElement)
27-
expect(grandparent).not.toContainHTML(nonExistantString)
28-
expect(parent).not.toContainHTML(nonExistantString)
29-
expect(child).not.toContainHTML(nonExistantString)
30-
expect(child).not.toContainHTML(nonExistantString)
31-
expect(grandparent).not.toContainHTML(incorrectStringHtml)
32-
expect(parent).not.toContainHTML(incorrectStringHtml)
33-
expect(child).not.toContainHTML(incorrectStringHtml)
34-
expect(child).not.toContainHTML(incorrectStringHtml)
25+
expect(grandparent).toContainHTML(stringChildElement)
26+
expect(parent).toContainHTML(stringChildElement)
27+
expect(child).toContainHTML(stringChildElement)
28+
expect(grandparent).not.toContainHTML(nonExistantString)
29+
expect(parent).not.toContainHTML(nonExistantString)
30+
expect(child).not.toContainHTML(nonExistantString)
31+
expect(child).not.toContainHTML(nonExistantString)
32+
expect(grandparent).not.toContainHTML(incorrectStringHtml)
33+
expect(parent).not.toContainHTML(incorrectStringHtml)
34+
expect(child).not.toContainHTML(incorrectStringHtml)
35+
expect(child).not.toContainHTML(incorrectStringHtml)
3536

36-
// negative test cases wrapped in throwError assertions for coverage.
37-
expect(() =>
38-
expect(nonExistantElement).not.toContainHTML(stringChildElement),
39-
).toThrowError()
40-
expect(() =>
41-
expect(nonExistantElement).not.toContainHTML(nonExistantElement),
42-
).toThrowError()
43-
expect(() =>
44-
expect(stringChildElement).not.toContainHTML(fakeElement),
45-
).toThrowError()
46-
expect(() =>
47-
expect(svgElement).toContainHTML(stringChildElement),
48-
).toThrowError()
49-
expect(() =>
50-
expect(grandparent).not.toContainHTML(stringChildElement),
51-
).toThrowError()
52-
expect(() =>
53-
expect(parent).not.toContainHTML(stringChildElement),
54-
).toThrowError()
55-
expect(() =>
56-
expect(child).not.toContainHTML(stringChildElement),
57-
).toThrowError()
58-
expect(() =>
59-
expect(child).not.toContainHTML(stringChildElement),
60-
).toThrowError()
61-
expect(() => expect(child).toContainHTML(nonExistantString)).toThrowError()
62-
expect(() => expect(parent).toContainHTML(nonExistantString)).toThrowError()
63-
expect(() =>
64-
expect(grandparent).toContainHTML(nonExistantString),
65-
).toThrowError()
66-
expect(() => expect(child).toContainHTML(nonExistantElement)).toThrowError()
67-
expect(() => expect(parent).toContainHTML(nonExistantElement)).toThrowError()
68-
expect(() =>
69-
expect(grandparent).toContainHTML(nonExistantElement),
70-
).toThrowError()
71-
expect(() =>
72-
expect(nonExistantElement).toContainHTML(incorrectStringHtml),
73-
).toThrowError()
74-
expect(() =>
75-
expect(grandparent).toContainHTML(incorrectStringHtml),
76-
).toThrowError()
77-
expect(() => expect(child).toContainHTML(incorrectStringHtml)).toThrowError()
78-
expect(() => expect(parent).toContainHTML(incorrectStringHtml)).toThrowError()
37+
// negative test cases wrapped in throwError assertions for coverage.
38+
expect(() =>
39+
expect(nonExistantElement).not.toContainHTML(stringChildElement),
40+
).toThrowError()
41+
expect(() =>
42+
expect(nonExistantElement).not.toContainHTML(nonExistantElement),
43+
).toThrowError()
44+
expect(() =>
45+
expect(stringChildElement).not.toContainHTML(fakeElement),
46+
).toThrowError()
47+
expect(() =>
48+
expect(svgElement).toContainHTML(stringChildElement),
49+
).toThrowError()
50+
expect(() =>
51+
expect(grandparent).not.toContainHTML(stringChildElement),
52+
).toThrowError()
53+
expect(() =>
54+
expect(parent).not.toContainHTML(stringChildElement),
55+
).toThrowError()
56+
expect(() =>
57+
expect(child).not.toContainHTML(stringChildElement),
58+
).toThrowError()
59+
expect(() =>
60+
expect(child).not.toContainHTML(stringChildElement),
61+
).toThrowError()
62+
expect(() => expect(child).toContainHTML(nonExistantString)).toThrowError()
63+
expect(() => expect(parent).toContainHTML(nonExistantString)).toThrowError()
64+
expect(() =>
65+
expect(grandparent).toContainHTML(nonExistantString),
66+
).toThrowError()
67+
expect(() => expect(child).toContainHTML(nonExistantElement)).toThrowError()
68+
expect(() =>
69+
expect(parent).toContainHTML(nonExistantElement),
70+
).toThrowError()
71+
expect(() =>
72+
expect(grandparent).toContainHTML(nonExistantElement),
73+
).toThrowError()
74+
expect(() =>
75+
expect(nonExistantElement).toContainHTML(incorrectStringHtml),
76+
).toThrowError()
77+
expect(() =>
78+
expect(grandparent).toContainHTML(incorrectStringHtml),
79+
).toThrowError()
80+
expect(() =>
81+
expect(child).toContainHTML(incorrectStringHtml),
82+
).toThrowError()
83+
expect(() =>
84+
expect(parent).toContainHTML(incorrectStringHtml),
85+
).toThrowError()
86+
})
87+
88+
test('throws with an expected text', () => {
89+
const {queryByTestId} = render('<span data-testid="child"></span>')
90+
const htmlElement = queryByTestId('child')
91+
const nonExistantString = '<div> non-existant element </div>'
92+
93+
let errorMessage
94+
try {
95+
expect(htmlElement).toContainHTML(nonExistantString)
96+
} catch (error) {
97+
errorMessage = error.message
98+
}
99+
100+
expect(errorMessage).toMatchInlineSnapshot(`
101+
"<dim>expect(</><red>element</><dim>).toContainHTML()</>
102+
Expected:
103+
<green><div> non-existant element </div></>
104+
Received:
105+
<red><span data-testid=\\"child\\" /></>"
106+
`)
107+
})
79108
})

src/to-contain-html.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,9 @@ export function toContainHTML(container, htmlText) {
1212
'element',
1313
'',
1414
),
15-
'',
15+
'Expected:',
16+
// eslint-disable-next-line babel/new-cap
17+
` ${this.utils.EXPECTED_COLOR(htmlText)}`,
1618
'Received:',
1719
` ${this.utils.printReceived(container.cloneNode(true))}`,
1820
].join('\n')

0 commit comments

Comments
 (0)