Skip to content

Commit 89fb2fe

Browse files
alshyraAntoine SAVAJOLS
alshyra
and
Antoine SAVAJOLS
authored
Added array-element-newline rule from eslint (#2066)
Co-authored-by: Antoine SAVAJOLS <[email protected]>
1 parent a15d036 commit 89fb2fe

File tree

6 files changed

+315
-0
lines changed

6 files changed

+315
-0
lines changed

‎docs/rules/array-element-newline.md

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
---
2+
pageClass: rule-details
3+
sidebarDepth: 0
4+
title: vue/array-element-newline
5+
description: Enforce line breaks after each array element in `<template>`
6+
---
7+
# vue/array-element-newline
8+
9+
> Enforce line breaks after each array element in `<template>`
10+
11+
- :exclamation: <badge text="This rule has not been released yet." vertical="middle" type="error"> ***This rule has not been released yet.*** </badge>
12+
- :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule.
13+
14+
This rule is the same rule as core [array-element-newline] rule but it applies to the expressions in `<template>`.
15+
16+
## :books: Further Reading
17+
18+
- [array-bracket-spacing]
19+
20+
[array-bracket-spacing]: https://eslint.org/docs/rules/array-bracket-spacing
21+
22+
- [array-bracket-newline]
23+
24+
[array-bracket-newline]: https://eslint.org/docs/rules/array-bracket-newline
25+
26+
## :mag: Implementation
27+
28+
- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/array-element-newline.js)
29+
- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/array-element-newline.js)
30+
31+
<sup>Taken with ❤️ [from ESLint core](https://eslint.org/docs/rules/array-element-newline)</sup>

‎docs/rules/index.md

+1
Original file line numberDiff line numberDiff line change
@@ -279,6 +279,7 @@ The following rules extend the rules provided by ESLint itself and apply them to
279279
|:--------|:------------|:--:|:--:|
280280
| [vue/array-bracket-newline](./array-bracket-newline.md) | Enforce linebreaks after opening and before closing array brackets in `<template>` | :wrench: | :lipstick: |
281281
| [vue/array-bracket-spacing](./array-bracket-spacing.md) | Enforce consistent spacing inside array brackets in `<template>` | :wrench: | :lipstick: |
282+
| [vue/array-element-newline](./array-element-newline.md) | Enforce line breaks after each array element in `<template>` | :wrench: | :lipstick: |
282283
| [vue/arrow-spacing](./arrow-spacing.md) | Enforce consistent spacing before and after the arrow in arrow functions in `<template>` | :wrench: | :lipstick: |
283284
| [vue/block-spacing](./block-spacing.md) | Disallow or enforce spaces inside of blocks after opening block and before closing block in `<template>` | :wrench: | :lipstick: |
284285
| [vue/brace-style](./brace-style.md) | Enforce consistent brace style for blocks in `<template>` | :wrench: | :lipstick: |

‎lib/configs/no-layout-rules.js

+1
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ module.exports = {
77
rules: {
88
'vue/array-bracket-newline': 'off',
99
'vue/array-bracket-spacing': 'off',
10+
'vue/array-element-newline': 'off',
1011
'vue/arrow-spacing': 'off',
1112
'vue/block-spacing': 'off',
1213
'vue/block-tag-newline': 'off',

‎lib/index.js

+1
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ module.exports = {
99
rules: {
1010
'array-bracket-newline': require('./rules/array-bracket-newline'),
1111
'array-bracket-spacing': require('./rules/array-bracket-spacing'),
12+
'array-element-newline': require('./rules/array-element-newline'),
1213
'arrow-spacing': require('./rules/arrow-spacing'),
1314
'attribute-hyphenation': require('./rules/attribute-hyphenation'),
1415
'attributes-order': require('./rules/attributes-order'),

‎lib/rules/array-element-newline.js

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
/**
2+
* @author alshyra
3+
*/
4+
'use strict'
5+
6+
const { wrapCoreRule } = require('../utils')
7+
8+
// eslint-disable-next-line no-invalid-meta, no-invalid-meta-docs-categories
9+
module.exports = wrapCoreRule('array-element-newline', {
10+
skipDynamicArguments: true
11+
})

‎tests/lib/rules/array-element-newline.js

+270
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,270 @@
1+
/**
2+
* @author alshyra
3+
* See LICENSE file in root directory for full license.
4+
*/
5+
'use strict'
6+
7+
const RuleTester = require('eslint').RuleTester
8+
const rule = require('../../../lib/rules/array-element-newline')
9+
10+
const tester = new RuleTester({
11+
parser: require.resolve('vue-eslint-parser'),
12+
parserOptions: {
13+
ecmaVersion: 2020,
14+
sourceType: 'module'
15+
}
16+
})
17+
18+
tester.run('array-element-newline', rule, {
19+
valid: [
20+
'<template><div :attr="[]" /></template>',
21+
'<template><div :attr="[a]" /></template>',
22+
`
23+
<template>
24+
<div :attr="[a,
25+
b,
26+
c]" />
27+
</template>`,
28+
`<template>
29+
<div :attr="[a,
30+
b,
31+
c
32+
]" />
33+
</template>`,
34+
'<template><div :[attr]="a" /></template>',
35+
'<template><div :[[attr]]="a" /></template>',
36+
`<template>
37+
<div :attr="[
38+
a,
39+
b,
40+
c
41+
]" />
42+
</template>`,
43+
`
44+
<template>
45+
<div :attr="[a
46+
b]" />
47+
</template>`,
48+
{
49+
code: `
50+
<template>
51+
<div :attr="[a,
52+
b,
53+
c]" />
54+
</template>`,
55+
options: ['always']
56+
},
57+
{
58+
code: '<template><div :attr="[a]" /></template>',
59+
options: ['never']
60+
},
61+
{
62+
code: '<template><div :attr="[a,b,c]" /></template>',
63+
options: ['never']
64+
},
65+
{
66+
code: '<template><div :attr="[a, b, c]" /></template>',
67+
options: [{ multiline: true }]
68+
},
69+
{
70+
code: `
71+
<template>
72+
<div :attr="[a,
73+
{
74+
b:c
75+
}]" />
76+
</template>`,
77+
options: [{ multiline: true }]
78+
},
79+
{
80+
code: '<template><div :attr="[a, b, c]" /></template>',
81+
options: ['consistent']
82+
},
83+
{
84+
code: `
85+
<template>
86+
<div :attr="[a,
87+
b,
88+
c
89+
]" />
90+
</template>`,
91+
options: ['consistent']
92+
},
93+
{
94+
code: '<template><div :attr="[a,b]" /></template>',
95+
options: [{ minItems: 3 }]
96+
}
97+
],
98+
invalid: [
99+
{
100+
code: `
101+
<template>
102+
<div :attr="[a, b]" />
103+
</template>`,
104+
output: `
105+
<template>
106+
<div :attr="[a,
107+
b]" />
108+
</template>`,
109+
errors: [
110+
{
111+
message: 'There should be a linebreak after this element.',
112+
line: 3,
113+
column: 26,
114+
endLine: 3,
115+
endColumn: 27
116+
}
117+
]
118+
},
119+
{
120+
code: `
121+
<template>
122+
<div :attr="[a,b,c]" />
123+
</template>`,
124+
output: `
125+
<template>
126+
<div :attr="[a,
127+
b,
128+
c]" />
129+
</template>`,
130+
options: ['always'],
131+
errors: [
132+
{
133+
message: 'There should be a linebreak after this element.',
134+
line: 3,
135+
column: 26,
136+
endLine: 3,
137+
endColumn: 26
138+
},
139+
{
140+
message: 'There should be a linebreak after this element.',
141+
line: 3,
142+
column: 28,
143+
endLine: 3,
144+
endColumn: 28
145+
}
146+
]
147+
},
148+
{
149+
code: `
150+
<template>
151+
<div :attr="[a,
152+
b,c]" />
153+
</template>`,
154+
output: `
155+
<template>
156+
<div :attr="[a,
157+
b,
158+
c]" />
159+
</template>`,
160+
options: ['always'],
161+
errors: [
162+
{
163+
message: 'There should be a linebreak after this element.',
164+
line: 4,
165+
column: 25,
166+
endLine: 4,
167+
endColumn: 25
168+
}
169+
]
170+
},
171+
{
172+
code: `
173+
<template>
174+
<div :attr="[a,
175+
b,c]" />
176+
</template>`,
177+
output: `
178+
<template>
179+
<div :attr="[a,
180+
b,
181+
c]" />
182+
</template>`,
183+
options: ['consistent'],
184+
errors: [
185+
{
186+
message: 'There should be a linebreak after this element.',
187+
line: 4,
188+
column: 26,
189+
endLine: 4,
190+
endColumn: 26
191+
}
192+
]
193+
},
194+
{
195+
code: `
196+
<template>
197+
<div :attr="[a,
198+
b, c]" />
199+
</template>`,
200+
output: `
201+
<template>
202+
<div :attr="[a, b, c]" />
203+
</template>`,
204+
options: [{ multiline: true }],
205+
errors: [
206+
{
207+
message: 'There should be no linebreak here.',
208+
line: 3,
209+
column: 26,
210+
endLine: 4,
211+
endColumn: 24
212+
}
213+
]
214+
},
215+
{
216+
code: `
217+
<template>
218+
<div :attr="[a, {
219+
b:c
220+
}]" />
221+
</template>`,
222+
output: `
223+
<template>
224+
<div :attr="[a,
225+
{
226+
b:c
227+
}]" />
228+
</template>`,
229+
options: [{ multiline: true }],
230+
errors: [
231+
{
232+
message: 'There should be a linebreak after this element.',
233+
line: 3,
234+
column: 26,
235+
endLine: 3,
236+
endColumn: 27
237+
}
238+
]
239+
},
240+
{
241+
code: `
242+
<template>
243+
<div :attr="[a,b,c]" />
244+
</template>`,
245+
output: `
246+
<template>
247+
<div :attr="[a,
248+
b,
249+
c]" />
250+
</template>`,
251+
options: [{ minItems: 2 }],
252+
errors: [
253+
{
254+
message: 'There should be a linebreak after this element.',
255+
line: 3,
256+
column: 26,
257+
endLine: 3,
258+
endColumn: 26
259+
},
260+
{
261+
message: 'There should be a linebreak after this element.',
262+
line: 3,
263+
column: 28,
264+
endLine: 3,
265+
endColumn: 28
266+
}
267+
]
268+
}
269+
]
270+
})

0 commit comments

Comments
 (0)