Skip to content

Commit 5029bd1

Browse files
iiisonljharb
authored andcommitted
[Fix] jsx-props-no-multi-spaces: Show error in multi-line props
Fixes #2223.
1 parent 7850e57 commit 5029bd1

File tree

3 files changed

+67
-0
lines changed

3 files changed

+67
-0
lines changed

docs/rules/jsx-props-no-multi-spaces.md

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,13 @@ The following patterns are considered warnings:
1616
<App too spacy />
1717
```
1818

19+
```jsx
20+
<App
21+
prop1='abc'
22+
23+
prop2='def' />
24+
```
25+
1926
The following patterns are **not** considered warnings:
2027

2128
```jsx
@@ -26,6 +33,12 @@ The following patterns are **not** considered warnings:
2633
<App very cozy />
2734
```
2835

36+
```jsx
37+
<App
38+
prop1='abc'
39+
prop2='def' />
40+
```
41+
2942
## When Not To Use It
3043

3144
If you are not using JSX or don't care about the space between two props in the same line.

lib/rules/jsx-props-no-multi-spaces.js

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,10 +38,22 @@ module.exports = {
3838
}
3939

4040
function checkSpacing(prev, node) {
41+
const prevNodeEndLine = prev.loc.end.line;
42+
const currNodeStartLine = node.loc.start.line;
43+
44+
if (currNodeStartLine - prevNodeEndLine > 1) {
45+
context.report({
46+
node,
47+
message: `Expected no line gap between “${getPropName(prev)}” and “${getPropName(node)}”`
48+
});
49+
}
50+
4151
if (prev.loc.end.line !== node.loc.end.line) {
4252
return;
4353
}
54+
4455
const between = context.getSourceCode().text.slice(prev.range[1], node.range[0]);
56+
4557
if (between !== ' ') {
4658
context.report({
4759
node,

tests/lib/rules/jsx-props-no-multi-spaces.js

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,23 @@ ruleTester.run('jsx-props-no-multi-spaces', rule, {
6868
code: '<Foo.Bar baz="quux" />'
6969
}, {
7070
code: '<Foobar.Foo.Bar.Baz.Qux.Quux.Quuz.Corge.Grault.Garply.Waldo.Fred.Plugh xyzzy="thud" />'
71+
}, {
72+
code: `
73+
<button
74+
title="Some button"
75+
type="button"
76+
/>
77+
`
78+
}, {
79+
code: `
80+
<button
81+
title="Some button"
82+
onClick={(value) => {
83+
console.log(value);
84+
}}
85+
type="button"
86+
/>
87+
`
7188
}],
7289

7390
invalid: [{
@@ -128,5 +145,30 @@ ruleTester.run('jsx-props-no-multi-spaces', rule, {
128145
errors: [
129146
{message: 'Expected only one space between "Foobar.Foo.Bar.Baz.Qux.Quux.Quuz.Corge.Grault.Garply.Waldo.Fred.Plugh" and "xyzzy"'}
130147
]
148+
}, {
149+
code: `
150+
<button
151+
title='Some button'
152+
153+
type="button"
154+
/>
155+
`,
156+
errors: [{message: 'Expected no line gap between “title” and “type”'}]
157+
}, {
158+
code: `
159+
<button
160+
title="Some button"
161+
162+
onClick={(value) => {
163+
console.log(value);
164+
}}
165+
166+
type="button"
167+
/>
168+
`,
169+
errors: [
170+
{message: 'Expected no line gap between “title” and “onClick”'},
171+
{message: 'Expected no line gap between “onClick” and “type”'}
172+
]
131173
}]
132174
});

0 commit comments

Comments
 (0)