Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 967a290

Browse files
feat(no-multiple-template-root): support disallowComments property
1 parent d385140 commit 967a290

File tree

2 files changed

+120
-1
lines changed

2 files changed

+120
-1
lines changed

‎lib/rules/no-multiple-template-root.js

Lines changed: 44 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,19 @@ module.exports = {
1515
url: 'https://eslint.vuejs.org/rules/no-multiple-template-root.html'
1616
},
1717
fixable: null,
18-
schema: [],
18+
schema: [
19+
{
20+
type: 'object',
21+
properties: {
22+
disallowComments: {
23+
type: 'boolean'
24+
}
25+
},
26+
additionalProperties: false
27+
}
28+
],
1929
messages: {
30+
commentRoot: 'The template root disallows comments.',
2031
multipleRoot: 'The template root requires exactly one element.',
2132
textRoot: 'The template root requires an element rather than texts.',
2233
disallowedElement: "The template root disallows '<{{name}}>' elements.",
@@ -28,6 +39,8 @@ module.exports = {
2839
* @returns {RuleListener} AST event handlers.
2940
*/
3041
create(context) {
42+
const options = context.options[0] || {}
43+
const disallowComments = options.disallowComments
3144
const sourceCode = context.getSourceCode()
3245

3346
return {
@@ -37,6 +50,36 @@ module.exports = {
3750
return
3851
}
3952

53+
const commentRangesMap = new Map()
54+
const comments = element.comments
55+
if (disallowComments && comments.length > 0) {
56+
for (const comment of comments) {
57+
const [start, end] = comment.range
58+
commentRangesMap.set(`${start}-${end}`, comment)
59+
}
60+
61+
for (const child of element.children) {
62+
if (child.type === 'VElement') {
63+
for (const range of commentRangesMap.keys()) {
64+
const ranges = range.split('-')
65+
if (ranges[0] > child.range[0] && ranges[1] < child.range[1]) {
66+
commentRangesMap.delete(range)
67+
}
68+
}
69+
}
70+
}
71+
72+
if (commentRangesMap.size > 0) {
73+
for (const node of commentRangesMap.values()) {
74+
context.report({
75+
node,
76+
loc: node.loc,
77+
messageId: 'commentRoot'
78+
})
79+
}
80+
}
81+
}
82+
4083
const rootElements = []
4184
let extraText = null
4285
let extraElement = null

‎tests/lib/rules/no-multiple-template-root.js

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,30 @@ ruleTester.run('no-multiple-template-root', rule, {
6262
</Link>
6363
</template>
6464
`
65+
},
66+
{
67+
filename: 'test.vue',
68+
code: `
69+
<template>
70+
<!-- comments -->
71+
<div>12333</div>
72+
<!-- comments -->
73+
</template>
74+
`,
75+
options: [{ disallowComments: false }]
76+
},
77+
{
78+
filename: 'test.vue',
79+
code: `
80+
<template>
81+
<!-- comments -->
82+
<div>
83+
<!-- comments -->
84+
12333
85+
</div>
86+
</template>
87+
`,
88+
options: [{ disallowComments: false }]
6589
}
6690
],
6791
invalid: [
@@ -104,6 +128,58 @@ ruleTester.run('no-multiple-template-root', rule, {
104128
filename: 'test.vue',
105129
code: '<template><template></template></template>',
106130
errors: ["The template root disallows '<template>' elements."]
131+
},
132+
{
133+
code: `
134+
<template>
135+
<!-- comments -->
136+
<div>12333</div>
137+
<!-- comments -->
138+
</template>
139+
`,
140+
options: [{ disallowComments: true }],
141+
errors: [
142+
{
143+
message: 'The template root disallows comments.',
144+
line: 3
145+
},
146+
{
147+
message: 'The template root disallows comments.',
148+
line: 5
149+
}
150+
]
151+
},
152+
{
153+
code: `
154+
<template>
155+
<!-- comments -->
156+
<div>
157+
12333
158+
<!-- comments -->
159+
</div>
160+
</template>
161+
`,
162+
options: [{ disallowComments: true }],
163+
errors: [
164+
{
165+
message: 'The template root disallows comments.',
166+
line: 3
167+
}
168+
]
169+
},
170+
{
171+
code: `
172+
<template>
173+
<!-- When you have a comment in the root of your template in vue 3,
174+
using $el will point to the first text comment instead of the actual DOM element. -->
175+
<div>
176+
12333
177+
<!-- comments -->
178+
</div>
179+
</template>
180+
`,
181+
options: [{ disallowComments: true }],
182+
errors: ['The template root disallows comments.']
107183
}
108184
]
109185
})

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /