Skip to content

Commit 98f7bbd

Browse files
TheAlexLichtermichalsnik
TheAlexLichter
authored and
michalsnik
committed
feat: ignore anchor tags in multiline rule (#738)
* feat: ignore anchor tags in multiline rule * Update singleline-html-element-content-newline.js * Update singleline-html-element-content-newline.md * Update multiline-html-element-content-newline.md * feat(singleline-html-element-content-newline): Ignore all inline elements * feat(multiline-html-element-content-newline): Ignore all inline elements * chore(*-element-content-newline): Simplify configuration
1 parent 617139e commit 98f7bbd

7 files changed

+170
-23
lines changed

Diff for: ‎docs/rules/multiline-html-element-content-newline.md

+8-4
Original file line numberDiff line numberDiff line change
@@ -74,23 +74,27 @@ This rule enforces a line break before and after the contents of a multiline ele
7474

7575
## :wrench: Options
7676

77-
```json
77+
```js
7878
{
7979
"vue/multiline-html-element-content-newline": ["error", {
8080
"ignoreWhenEmpty": true,
81-
"ignores": ["pre", "textarea"],
81+
"ignores": ["pre", "textarea", ...INLINE_ELEMENTS],
8282
"allowEmptyLines": false
8383
}]
8484
}
8585
```
8686

8787
- `ignoreWhenEmpty` ... disables reporting when element has no content.
8888
default `true`
89-
- `ignores` ... the configuration for element names to ignore line breaks style.
90-
default `["pre", "textarea"]`
89+
- `ignores` ... the configuration for element names to ignore line breaks style.
90+
default `["pre", "textarea", ...INLINE_ELEMENTS]`.
9191
- `allowEmptyLines` ... if `true`, it allows empty lines around content. If you want to disallow multiple empty lines, use [no-multiple-empty-lines] in combination.
9292
default `false`
9393

94+
::: info
95+
All inline non void elements can be found [here](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/utils/inline-non-void-elements.json).
96+
:::
97+
9498
### `"ignores": ["VueComponent", "pre", "textarea"]`
9599

96100
<eslint-code-block fix :rules="{'vue/multiline-html-element-content-newline': ['error', { ignores: ['VueComponent', 'pre', 'textarea'] }]}">

Diff for: ‎docs/rules/singleline-html-element-content-newline.md

+9-4
Original file line numberDiff line numberDiff line change
@@ -50,12 +50,12 @@ This rule enforces a line break before and after the contents of a singleline el
5050

5151
## :wrench: Options
5252

53-
```json
53+
```js
5454
{
5555
"vue/singleline-html-element-content-newline": ["error", {
5656
"ignoreWhenNoAttributes": true,
5757
"ignoreWhenEmpty": true,
58-
"ignores": ["pre", "textarea"]
58+
"ignores": ["pre", "textarea", ...INLINE_ELEMENTS]
5959
}]
6060
}
6161
```
@@ -64,8 +64,13 @@ This rule enforces a line break before and after the contents of a singleline el
6464
default `true`
6565
- `ignoreWhenEmpty` ... disables reporting when element has no content.
6666
default `true`
67-
- `ignores` ... the configuration for element names to ignore line breaks style.
68-
default `["pre", "textarea"]`
67+
- `ignores` ... the configuration for element names to ignore line breaks style.
68+
default `["pre", "textarea", ...INLINE_ELEMENTS]`.
69+
70+
71+
::: info
72+
All inline non void elements can be found [here](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/utils/inline-non-void-elements.json).
73+
:::
6974

7075

7176
### `"ignoreWhenNoAttributes": true`

Diff for: ‎lib/rules/multiline-html-element-content-newline.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010

1111
const utils = require('../utils')
1212
const casing = require('../utils/casing')
13+
const INLINE_ELEMENTS = require('../utils/inline-non-void-elements.json')
1314

1415
// ------------------------------------------------------------------------------
1516
// Helpers
@@ -21,7 +22,7 @@ function isMultilineElement (element) {
2122

2223
function parseOptions (options) {
2324
return Object.assign({
24-
ignores: ['pre', 'textarea'],
25+
ignores: ['pre', 'textarea'].concat(INLINE_ELEMENTS),
2526
ignoreWhenEmpty: true,
2627
allowEmptyLines: false
2728
}, options)

Diff for: ‎lib/rules/singleline-html-element-content-newline.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010

1111
const utils = require('../utils')
1212
const casing = require('../utils/casing')
13+
const INLINE_ELEMENTS = require('../utils/inline-non-void-elements.json')
1314

1415
// ------------------------------------------------------------------------------
1516
// Helpers
@@ -21,7 +22,7 @@ function isSinglelineElement (element) {
2122

2223
function parseOptions (options) {
2324
return Object.assign({
24-
ignores: ['pre', 'textarea'],
25+
ignores: ['pre', 'textarea'].concat(INLINE_ELEMENTS),
2526
ignoreWhenNoAttributes: true,
2627
ignoreWhenEmpty: true
2728
}, options)

Diff for: ‎lib/utils/inline-non-void-elements.json

+40
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
[
2+
"a",
3+
"abbr",
4+
"audio",
5+
"b",
6+
"bdi",
7+
"bdo",
8+
"canvas",
9+
"cite",
10+
"code",
11+
"data",
12+
"del",
13+
"dfn",
14+
"em",
15+
"i",
16+
"iframe",
17+
"ins",
18+
"kbd",
19+
"label",
20+
"map",
21+
"mark",
22+
"noscript",
23+
"object",
24+
"output",
25+
"picture",
26+
"q",
27+
"ruby",
28+
"s",
29+
"samp",
30+
"small",
31+
"span",
32+
"strong",
33+
"sub",
34+
"sup",
35+
"svg",
36+
"time",
37+
"u",
38+
"var",
39+
"video"
40+
]

Diff for: ‎tests/lib/rules/multiline-html-element-content-newline.js

+82-7
Original file line numberDiff line numberDiff line change
@@ -44,15 +44,80 @@ tester.run('multiline-html-element-content-newline', rule, {
4444
<div class="panel">
4545
content
4646
</div>
47-
</template>`,
47+
</template>
48+
`,
4849
`
4950
<template>
5051
<div
5152
class="panel"
5253
>
5354
content
5455
</div>
55-
</template>`,
56+
</template>
57+
`,
58+
`
59+
<template>
60+
<a
61+
href="/"
62+
class="link"
63+
>Home</a>
64+
</template>
65+
`,
66+
`
67+
<template>
68+
<a
69+
href="/"
70+
class="link"
71+
>Home
72+
</a>
73+
</template>
74+
`,
75+
`
76+
<template>
77+
<a
78+
href="/"
79+
class="link"
80+
>
81+
Home
82+
</a>
83+
</template>
84+
`,
85+
`
86+
<template>
87+
<div>
88+
<label
89+
for="test"
90+
class="label"
91+
>Foo</label>
92+
<input id="test">
93+
</div>
94+
</template>
95+
`,
96+
`
97+
<template>
98+
<div>
99+
<label
100+
for="test"
101+
class="label"
102+
>Foo
103+
</label>
104+
<input id="test">
105+
</div>
106+
</template>
107+
`,
108+
`
109+
<template>
110+
<div>
111+
<label
112+
for="test"
113+
class="label"
114+
>
115+
Foo
116+
</label>
117+
<input id="test">
118+
</div>
119+
</template>
120+
`,
56121
`
57122
<template>
58123
<div>
@@ -61,17 +126,23 @@ tester.run('multiline-html-element-content-newline', rule, {
61126
content
62127
</div>
63128
</div>
64-
</template>`,
65-
`<div>multiline end tag</div
66-
>`,
129+
</template>
130+
`,
131+
`
132+
<div>multiline end tag</div
133+
>
134+
`,
135+
67136
// empty
68137
`<template><div class="panel"></div></template>`,
69138
`
70139
<template>
71140
<div
72141
class="panel">
73142
</div>
74-
</template>`,
143+
</template>
144+
`,
145+
75146
// allowEmptyLines
76147
{
77148
code: `
@@ -109,11 +180,14 @@ tester.run('multiline-html-element-content-newline', rule, {
109180
</template>`,
110181
options: [{ allowEmptyLines: true }]
111182
},
183+
112184
// self closing
113185
`
114186
<template>
115187
<self-closing />
116-
</template>`,
188+
</template>
189+
`,
190+
117191
// ignores
118192
`
119193
<template>
@@ -180,6 +254,7 @@ tester.run('multiline-html-element-content-newline', rule, {
180254
ignores: ['IgnoreTag']
181255
}]
182256
},
257+
183258
// Ignore if no closing brackets
184259
`
185260
<template>

Diff for: ‎tests/lib/rules/singleline-html-element-content-newline.js

+27-6
Original file line numberDiff line numberDiff line change
@@ -33,39 +33,59 @@ tester.run('singleline-html-element-content-newline', rule, {
3333
<div class="panel">
3434
content
3535
</div>
36-
</template>`,
36+
</template>
37+
`,
3738
`
3839
<template>
3940
<div class="panel">
4041
<div>
4142
</div>
4243
</div>
43-
</template>`,
44+
</template>
45+
`,
4446
`
4547
<template>
4648
<div class="panel">
4749
<!-- comment -->
4850
</div>
49-
</template>`,
51+
</template>
52+
`,
5053
`
5154
<template>
5255
<div>
5356
content
5457
</div>
55-
</template>`,
58+
</template>
59+
`,
5660
`
5761
<template>
5862
<div>
5963
<div>
6064
</div>
6165
</div>
62-
</template>`,
66+
</template>
67+
`,
6368
`
6469
<template>
6570
<div>
6671
<!-- comment -->
6772
</div>
68-
</template>`,
73+
</template>
74+
`,
75+
`
76+
<template>
77+
<a href="/">Home</a>
78+
</template>
79+
`,
80+
`
81+
<template>
82+
<form>
83+
<label for="test">Home</label>
84+
<input id="test" name="test">
85+
</form>
86+
</template>
87+
`,
88+
6989
// ignoreWhenNoAttributes: true
7090
`
7191
<template>
@@ -91,6 +111,7 @@ tester.run('singleline-html-element-content-newline', rule, {
91111
<template>
92112
<div> </div>
93113
</template>`,
114+
94115
// ignoreWhenNoAttributes: false
95116
{
96117
code: `

0 commit comments

Comments
 (0)