Skip to content

Commit 21595fb

Browse files
ljosberinnljosberinn
authored
migrate toBeEmpty to toBeEmptyDOMElement (#56)
1 parent fef5a24 commit 21595fb

File tree

3 files changed

+78
-65
lines changed

3 files changed

+78
-65
lines changed

‎docs/rules/prefer-empty.md‎

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
# Prefer toBeEmpty over checking innerHTML / firstChild (prefer-empty)
1+
# Prefer toBeEmptyDOMElement over checking innerHTML / firstChild (prefer-empty)
22

3-
This rule ensures people will use toBeEmpty() rather than checking dom
3+
This rule ensures people will use toBeEmptyDOMElement() rather than checking dom
44
nodes/properties. It is primarily aimed at consistently using jest-dom for
55
readability.
66

77
## Rule Details
88

9-
This autofixable rule aims to ensure usage of `.toBeEmpty()`
9+
This autofixable rule aims to ensure usage of `.toBeEmptyDOMElement()`
1010

1111
Examples of **incorrect** code for this rule:
1212

@@ -49,10 +49,14 @@ expect(element.innerHTML === "foo").toBe(true);
4949

5050
## When Not To Use It
5151

52-
Don't use this rule if you don't care if people use `.toBeEmpty()`.
52+
Don't use this rule if you don't care if people use `.toBeEmptyDOMElement()`.
5353

5454
## Further Reading
5555

56-
<https://github.com/testing-library/jest-dom#tobeempty>
56+
<https://github.com/testing-library/jest-dom#tobeemptydomelement>
5757

58-
<https://github.com/testing-library/jest-dom/blob/master/src/to-be-empty.js>
58+
<https://github.com/testing-library/jest-dom/blob/master/src/to-be-empty-dom-element.js>
59+
60+
## Changelog
61+
62+
Previously, this rule was using `.toBeEmpty` which has been [deprecated](https://github.com/testing-library/jest-dom/releases/tag/v5.9.0) in `@testing-library/jest-dom@5.9.0`.

‎src/__tests__/lib/rules/prefer-empty.js‎

Lines changed: 41 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/**
2-
* @fileoverview Prefer toBeEmpty over checking innerHTML
2+
* @fileoverview Prefer toBeEmptyDOMElement over checking innerHTML
33
* @author Ben Monro
44
*/
55

@@ -34,188 +34,188 @@ ruleTester.run("prefer-empty", rule, {
3434
code: `expect(element.innerHTML === '').toBe(true)`,
3535
errors: [
3636
{
37-
message: "Use toBeEmpty instead of checking inner html.",
37+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
3838
},
3939
],
40-
output: `expect(element).toBeEmpty()`,
40+
output: `expect(element).toBeEmptyDOMElement()`,
4141
},
4242
{
4343
code: `expect(element.innerHTML !== '').toBe(true)`,
4444
errors: [
4545
{
46-
message: "Use toBeEmpty instead of checking inner html.",
46+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
4747
},
4848
],
49-
output: `expect(element).not.toBeEmpty()`,
49+
output: `expect(element).not.toBeEmptyDOMElement()`,
5050
},
5151
{
5252
code: `expect(element.innerHTML === '').toBe(false)`,
5353
errors: [
5454
{
55-
message: "Use toBeEmpty instead of checking inner html.",
55+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
5656
},
5757
],
58-
output: `expect(element).not.toBeEmpty()`,
58+
output: `expect(element).not.toBeEmptyDOMElement()`,
5959
},
6060
{
6161
code: `expect(element.innerHTML !== '').toBe(false)`,
6262
errors: [
6363
{
64-
message: "Use toBeEmpty instead of checking inner html.",
64+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
6565
},
6666
],
67-
output: `expect(element).toBeEmpty()`,
67+
output: `expect(element).toBeEmptyDOMElement()`,
6868
},
6969
{
7070
code: `expect(element.firstChild === null).toBe(true)`,
7171
errors: [
7272
{
73-
message: "Use toBeEmpty instead of checking inner html.",
73+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
7474
},
7575
],
76-
output: `expect(element).toBeEmpty()`,
76+
output: `expect(element).toBeEmptyDOMElement()`,
7777
},
7878
{
7979
code: `expect(element.firstChild !== null).toBe(false)`,
8080
errors: [
8181
{
82-
message: "Use toBeEmpty instead of checking inner html.",
82+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
8383
},
8484
],
85-
output: `expect(element).toBeEmpty()`,
85+
output: `expect(element).toBeEmptyDOMElement()`,
8686
},
8787
{
8888
code: `expect(element.firstChild === null).toBe(false)`,
8989
errors: [
9090
{
91-
message: "Use toBeEmpty instead of checking inner html.",
91+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
9292
},
9393
],
94-
output: `expect(element).not.toBeEmpty()`,
94+
output: `expect(element).not.toBeEmptyDOMElement()`,
9595
},
9696
{
9797
code: `expect(element.innerHTML).toBe('')`,
9898
errors: [
9999
{
100-
message: "Use toBeEmpty instead of checking inner html.",
100+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
101101
},
102102
],
103-
output: `expect(element).toBeEmpty()`,
103+
output: `expect(element).toBeEmptyDOMElement()`,
104104
},
105105

106106
{
107107
code: `expect(element.innerHTML).toBe(null)`,
108108
errors: [
109109
{
110-
message: "Use toBeEmpty instead of checking inner html.",
110+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
111111
},
112112
],
113-
output: `expect(element).toBeEmpty()`,
113+
output: `expect(element).toBeEmptyDOMElement()`,
114114
},
115115
{
116116
code: `expect(element.innerHTML).not.toBe(null)`,
117117
errors: [
118118
{
119-
message: "Use toBeEmpty instead of checking inner html.",
119+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
120120
},
121121
],
122-
output: `expect(element).not.toBeEmpty()`,
122+
output: `expect(element).not.toBeEmptyDOMElement()`,
123123
},
124124

125125
{
126126
code: `expect(element.innerHTML).not.toBe('')`,
127127
errors: [
128128
{
129-
message: "Use toBeEmpty instead of checking inner html.",
129+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
130130
},
131131
],
132-
output: `expect(element).not.toBeEmpty()`,
132+
output: `expect(element).not.toBeEmptyDOMElement()`,
133133
},
134134

135135
{
136136
code: `expect(element.firstChild).toBeNull()`,
137137
errors: [
138138
{
139-
message: "Use toBeEmpty instead of checking inner html.",
139+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
140140
},
141141
],
142-
output: `expect(element).toBeEmpty()`,
142+
output: `expect(element).toBeEmptyDOMElement()`,
143143
},
144144
{
145145
code: `expect(element.firstChild).toBe(null)`,
146146
errors: [
147147
{
148-
message: "Use toBeEmpty instead of checking inner html.",
148+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
149149
},
150150
],
151-
output: `expect(element).toBeEmpty()`,
151+
output: `expect(element).toBeEmptyDOMElement()`,
152152
},
153153
{
154154
code: `expect(element.firstChild).not.toBe(null)`,
155155
errors: [
156156
{
157-
message: "Use toBeEmpty instead of checking inner html.",
157+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
158158
},
159159
],
160-
output: `expect(element).not.toBeEmpty()`,
160+
output: `expect(element).not.toBeEmptyDOMElement()`,
161161
},
162162

163163
{
164164
code: `expect(element.firstChild).not.toBeNull()`,
165165
errors: [
166166
{
167-
message: "Use toBeEmpty instead of checking inner html.",
167+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
168168
},
169169
],
170-
output: `expect(element).not.toBeEmpty()`,
170+
output: `expect(element).not.toBeEmptyDOMElement()`,
171171
},
172172
{
173173
code: `expect(getByText('foo').innerHTML).toBe('')`,
174174
errors: [
175175
{
176-
message: "Use toBeEmpty instead of checking inner html.",
176+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
177177
},
178178
],
179-
output: `expect(getByText('foo')).toBeEmpty()`,
179+
output: `expect(getByText('foo')).toBeEmptyDOMElement()`,
180180
},
181181

182182
{
183183
code: `expect(getByText('foo').innerHTML).toStrictEqual('')`,
184184
errors: [
185185
{
186-
message: "Use toBeEmpty instead of checking inner html.",
186+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
187187
},
188188
],
189-
output: `expect(getByText('foo')).toBeEmpty()`,
189+
output: `expect(getByText('foo')).toBeEmptyDOMElement()`,
190190
},
191191

192192
{
193193
code: `expect(getByText('foo').innerHTML).toStrictEqual(null)`,
194194
errors: [
195195
{
196-
message: "Use toBeEmpty instead of checking inner html.",
196+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
197197
},
198198
],
199-
output: `expect(getByText('foo')).toBeEmpty()`,
199+
output: `expect(getByText('foo')).toBeEmptyDOMElement()`,
200200
},
201201

202202
{
203203
code: `expect(getByText('foo').firstChild).toBe(null)`,
204204
errors: [
205205
{
206-
message: "Use toBeEmpty instead of checking inner html.",
206+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
207207
},
208208
],
209-
output: `expect(getByText('foo')).toBeEmpty()`,
209+
output: `expect(getByText('foo')).toBeEmptyDOMElement()`,
210210
},
211211
{
212212
code: `expect(getByText('foo').firstChild).not.toBe(null)`,
213213
errors: [
214214
{
215-
message: "Use toBeEmpty instead of checking inner html.",
215+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
216216
},
217217
],
218-
output: `expect(getByText('foo')).not.toBeEmpty()`,
218+
output: `expect(getByText('foo')).not.toBeEmptyDOMElement()`,
219219
},
220220
],
221221
});

‎src/rules/prefer-empty.js‎

Lines changed: 27 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -19,15 +19,15 @@ export const create = (context) => ({
1919
) {
2020
context.report({
2121
node,
22-
message: "Use toBeEmpty instead of checking inner html.",
22+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
2323
fix: (fixer) => [
2424
fixer.removeRange([node.left.property.range[0] - 1, node.range[1]]),
2525
fixer.replaceText(
2626
node.parent.parent.property,
2727
Boolean(node.parent.parent.parent.arguments[0].value) ===
2828
node.operator.startsWith("=") // binary expression XNOR matcher boolean
29-
? "toBeEmpty"
30-
: "not.toBeEmpty"
29+
? "toBeEmptyDOMElement"
30+
: "not.toBeEmptyDOMElement"
3131
),
3232
fixer.remove(node.parent.parent.parent.arguments[0]),
3333
],
@@ -38,15 +38,15 @@ export const create = (context) => ({
3838
) {
3939
context.report({
4040
node,
41-
message: "Use toBeEmpty instead of checking inner html.",
41+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
4242
fix: (fixer) => [
4343
fixer.removeRange([node.left.property.range[0] - 1, node.range[1]]),
4444
fixer.replaceText(
4545
node.parent.parent.property,
4646
Boolean(node.parent.parent.parent.arguments[0].value) ===
4747
node.operator.startsWith("=") // binary expression XNOR matcher boolean
48-
? "toBeEmpty"
49-
: "not.toBeEmpty"
48+
? "toBeEmptyDOMElement"
49+
: "not.toBeEmptyDOMElement"
5050
),
5151
fixer.remove(node.parent.parent.parent.arguments[0]),
5252
],
@@ -61,10 +61,10 @@ export const create = (context) => ({
6161

6262
context.report({
6363
node,
64-
message: "Use toBeEmpty instead of checking inner html.",
64+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
6565
fix: (fixer) => [
6666
fixer.removeRange([node.property.range[0] - 1, node.property.range[1]]),
67-
fixer.replaceText(node.parent.parent.property, "toBeEmpty"),
67+
fixer.replaceText(node.parent.parent.property, "toBeEmptyDOMElement"),
6868
fixer.remove(node.parent.parent.parent.arguments[0]),
6969
],
7070
});
@@ -78,10 +78,13 @@ export const create = (context) => ({
7878

7979
context.report({
8080
node,
81-
message: "Use toBeEmpty instead of checking inner html.",
81+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
8282
fix: (fixer) => [
8383
fixer.removeRange([node.property.range[0] - 1, node.property.range[1]]),
84-
fixer.replaceText(node.parent.parent.parent.property, "toBeEmpty"),
84+
fixer.replaceText(
85+
node.parent.parent.parent.property,
86+
"toBeEmptyDOMElement"
87+
),
8588
fixer.remove(node.parent.parent.parent.parent.arguments[0]),
8689
],
8790
});
@@ -91,10 +94,10 @@ export const create = (context) => ({
9194
) {
9295
context.report({
9396
node,
94-
message: "Use toBeEmpty instead of checking inner html.",
97+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
9598
fix: (fixer) => [
9699
fixer.removeRange([node.property.range[0] - 1, node.property.range[1]]),
97-
fixer.replaceText(node.parent.parent.property, "toBeEmpty"),
100+
fixer.replaceText(node.parent.parent.property, "toBeEmptyDOMElement"),
98101
],
99102
});
100103
},
@@ -107,10 +110,13 @@ export const create = (context) => ({
107110

108111
context.report({
109112
node,
110-
message: "Use toBeEmpty instead of checking inner html.",
113+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
111114
fix: (fixer) => [
112115
fixer.removeRange([node.property.range[0] - 1, node.property.range[1]]),
113-
fixer.replaceText(node.parent.parent.parent.property, "toBeEmpty"),
116+
fixer.replaceText(
117+
node.parent.parent.parent.property,
118+
"toBeEmptyDOMElement"
119+
),
114120
fixer.remove(node.parent.parent.parent.parent.arguments[0]),
115121
],
116122
});
@@ -120,10 +126,13 @@ export const create = (context) => ({
120126
) {
121127
context.report({
122128
node,
123-
message: "Use toBeEmpty instead of checking inner html.",
129+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
124130
fix: (fixer) => [
125131
fixer.removeRange([node.property.range[0] - 1, node.property.range[1]]),
126-
fixer.replaceText(node.parent.parent.parent.property, "toBeEmpty"),
132+
fixer.replaceText(
133+
node.parent.parent.parent.property,
134+
"toBeEmptyDOMElement"
135+
),
127136
],
128137
});
129138
},
@@ -136,10 +145,10 @@ export const create = (context) => ({
136145

137146
context.report({
138147
node,
139-
message: "Use toBeEmpty instead of checking inner html.",
148+
message: "Use toBeEmptyDOMElement instead of checking inner html.",
140149
fix: (fixer) => [
141150
fixer.removeRange([node.property.range[0] - 1, node.property.range[1]]),
142-
fixer.replaceText(node.parent.parent.property, "toBeEmpty"),
151+
fixer.replaceText(node.parent.parent.property, "toBeEmptyDOMElement"),
143152
fixer.remove(node.parent.parent.parent.arguments[0]),
144153
],
145154
});

0 commit comments

Comments
 (0)