Skip to content

Commit 45ad42e

Browse files
Rel1cxRel1cx
authored
Add allowEmptyFragment option to no-useless-fragment, closes #1265 (#1335)
1 parent 4ad2ebf commit 45ad42e

File tree

4 files changed

+189
-184
lines changed

4 files changed

+189
-184
lines changed

‎packages/plugins/eslint-plugin-react-x/src/rules/no-useless-fragment.mdx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -87,6 +87,7 @@ const cat = <>meow</>
8787

8888
This rule has a single options object with the following property:
8989

90+
- `allowEmptyFragment` (default: `false`): Allow fragments that contain no children.
9091
- `allowExpressions` (default: `true`): Allow fragments that contain a single expression child.
9192

9293
## Note

‎packages/plugins/eslint-plugin-react-x/src/rules/no-useless-fragment.spec.ts‎

Lines changed: 38 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -11,18 +11,30 @@ ruleTester.run(RULE_NAME, rule, {
1111
errors: [
1212
{
1313
type: T.JSXFragment,
14-
messageId: "uselessFragment",
14+
messageId: "noUselessFragment",
1515
data: { reason: "contains less than two children" },
1616
},
1717
],
1818
output: null,
1919
},
20+
{
21+
code: "<></>",
22+
errors: [
23+
{
24+
type: T.JSXFragment,
25+
messageId: "noUselessFragment",
26+
data: { reason: "contains less than two children" },
27+
},
28+
],
29+
options: [{ allowEmptyFragment: false }],
30+
output: null,
31+
},
2032
{
2133
code: "<>{}</>",
2234
errors: [
2335
{
2436
type: T.JSXFragment,
25-
messageId: "uselessFragment",
37+
messageId: "noUselessFragment",
2638
data: { reason: "contains less than two children" },
2739
},
2840
],
@@ -34,12 +46,12 @@ ruleTester.run(RULE_NAME, rule, {
3446
errors: [
3547
{
3648
type: T.JSXFragment,
37-
messageId: "uselessFragment",
49+
messageId: "noUselessFragment",
3850
data: { reason: "placed inside a host component" },
3951
},
4052
{
4153
type: T.JSXFragment,
42-
messageId: "uselessFragment",
54+
messageId: "noUselessFragment",
4355
data: { reason: "contains less than two children" },
4456
},
4557
],
@@ -50,7 +62,7 @@ ruleTester.run(RULE_NAME, rule, {
5062
errors: [
5163
{
5264
type: T.JSXFragment,
53-
messageId: "uselessFragment",
65+
messageId: "noUselessFragment",
5466
data: { reason: "contains less than two children" },
5567
},
5668
],
@@ -60,14 +72,9 @@ ruleTester.run(RULE_NAME, rule, {
6072
{
6173
code: "<p><>{meow}</></p>",
6274
errors: [
63-
// {
64-
// type: T.JSXFragment,
65-
// messageId: "uselessFragment",
66-
// data: { reason: "contains less than two children" },
67-
// },
6875
{
6976
type: T.JSXFragment,
70-
messageId: "uselessFragment",
77+
messageId: "noUselessFragment",
7178
data: { reason: "placed inside a host component" },
7279
},
7380
],
@@ -78,7 +85,7 @@ ruleTester.run(RULE_NAME, rule, {
7885
errors: [
7986
{
8087
type: T.JSXFragment,
81-
messageId: "uselessFragment",
88+
messageId: "noUselessFragment",
8289
data: { reason: "contains less than two children" },
8390
},
8491
],
@@ -93,7 +100,7 @@ ruleTester.run(RULE_NAME, rule, {
93100
errors: [
94101
{
95102
type: T.JSXFragment,
96-
messageId: "uselessFragment",
103+
messageId: "noUselessFragment",
97104
data: { reason: "contains less than two children" },
98105
},
99106
],
@@ -106,7 +113,7 @@ ruleTester.run(RULE_NAME, rule, {
106113
errors: [
107114
{
108115
type: T.JSXElement,
109-
messageId: "uselessFragment",
116+
messageId: "noUselessFragment",
110117
data: { reason: "contains less than two children" },
111118
},
112119
],
@@ -120,35 +127,21 @@ ruleTester.run(RULE_NAME, rule, {
120127
errors: [
121128
{
122129
type: T.JSXElement,
123-
messageId: "uselessFragment",
130+
messageId: "noUselessFragment",
124131
data: { reason: "contains less than two children" },
125132
},
126133
],
127134
output: `
128135
<Foo />
129136
`,
130137
},
131-
// {
132-
// code: `
133-
// <SomeReact.SomeFragment>
134-
// {foo}
135-
// </SomeReact.SomeFragment>
136-
// `,
137-
// errors: [
138-
// {
139-
// type: T.JSXElement,
140-
// messageId: "uselessFragment",
141-
// data: { reason: "contains less than two children" },
142-
// },
143-
// ],
144-
// },
145138
{
146139
// Not safe to fix this case because `Eeee` might require child be ReactElement
147140
code: "<Eeee><>foo</></Eeee>",
148141
errors: [
149142
{
150143
type: T.JSXFragment,
151-
messageId: "uselessFragment",
144+
messageId: "noUselessFragment",
152145
data: { reason: "contains less than two children" },
153146
},
154147
],
@@ -159,12 +152,12 @@ ruleTester.run(RULE_NAME, rule, {
159152
errors: [
160153
{
161154
type: T.JSXFragment,
162-
messageId: "uselessFragment",
155+
messageId: "noUselessFragment",
163156
data: { reason: "placed inside a host component" },
164157
},
165158
{
166159
type: T.JSXFragment,
167-
messageId: "uselessFragment",
160+
messageId: "noUselessFragment",
168161
data: { reason: "contains less than two children" },
169162
},
170163
],
@@ -175,7 +168,7 @@ ruleTester.run(RULE_NAME, rule, {
175168
errors: [
176169
{
177170
type: T.JSXFragment,
178-
messageId: "uselessFragment",
171+
messageId: "noUselessFragment",
179172
data: { reason: "placed inside a host component" },
180173
},
181174
],
@@ -191,7 +184,7 @@ ruleTester.run(RULE_NAME, rule, {
191184
errors: [
192185
{
193186
type: T.JSXFragment,
194-
messageId: "uselessFragment",
187+
messageId: "noUselessFragment",
195188
data: { reason: "placed inside a host component" },
196189
},
197190
],
@@ -207,7 +200,7 @@ ruleTester.run(RULE_NAME, rule, {
207200
errors: [
208201
{
209202
type: T.JSXElement,
210-
messageId: "uselessFragment",
203+
messageId: "noUselessFragment",
211204
data: { reason: "placed inside a host component" },
212205
},
213206
],
@@ -226,13 +219,13 @@ ruleTester.run(RULE_NAME, rule, {
226219
errors: [
227220
{
228221
type: T.JSXFragment,
229-
messageId: "uselessFragment",
222+
messageId: "noUselessFragment",
230223
data: { reason: "placed inside a host component" },
231224
line: 3,
232225
},
233226
{
234227
type: T.JSXFragment,
235-
messageId: "uselessFragment",
228+
messageId: "noUselessFragment",
236229
data: { reason: "placed inside a host component" },
237230
line: 7,
238231
},
@@ -249,7 +242,7 @@ ruleTester.run(RULE_NAME, rule, {
249242
errors: [
250243
{
251244
type: T.JSXFragment,
252-
messageId: "uselessFragment",
245+
messageId: "noUselessFragment",
253246
data: { reason: "placed inside a host component" },
254247
},
255248
],
@@ -266,13 +259,13 @@ ruleTester.run(RULE_NAME, rule, {
266259
errors: [
267260
{
268261
type: T.JSXElement,
269-
messageId: "uselessFragment",
262+
messageId: "noUselessFragment",
270263
data: { reason: "placed inside a host component" },
271264
line: 4,
272265
},
273266
{
274267
type: T.JSXElement,
275-
messageId: "uselessFragment",
268+
messageId: "noUselessFragment",
276269
data: { reason: "contains less than two children" },
277270
line: 4,
278271
},
@@ -291,7 +284,7 @@ ruleTester.run(RULE_NAME, rule, {
291284
errors: [
292285
{
293286
type: T.JSXFragment,
294-
messageId: "uselessFragment",
287+
messageId: "noUselessFragment",
295288
data: { reason: "contains less than two children" },
296289
},
297290
],
@@ -305,6 +298,10 @@ ruleTester.run(RULE_NAME, rule, {
305298
],
306299
valid: [
307300
...allValid,
301+
{
302+
code: "<></>",
303+
options: [{ allowEmptyFragment: true }],
304+
},
308305
"<><Foo /><Bar /></>",
309306
"<>foo<div /></>",
310307
"<> <div /></>",

0 commit comments

Comments
 (0)