Skip to content

Commit d93ffe2

Browse files
committed
refactor(no-multiple-template-root): optimize code
1 parent ea93477 commit d93ffe2

File tree

2 files changed

+106
-42
lines changed

2 files changed

+106
-42
lines changed

Diff for: lib/rules/no-multiple-template-root.js

+52-42
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,57 @@
66

77
const utils = require('../utils')
88

9+
/**
10+
* Get all comments that need to be reported
11+
* @param {(HTMLComment | HTMLBogusComment | Comment)[]} comments
12+
* @param {VRootElement} element
13+
*/
14+
function getReportComments(comments, element) {
15+
const commentRanges = comments.map((comment) => comment.range)
16+
const elementRanges = element.children
17+
.filter((child) => child.type === 'VElement')
18+
.map((child) => child.range)
19+
20+
// should return comment directly when no any elements
21+
if (elementRanges.length === 0) {
22+
return comments
23+
}
24+
25+
let commentIndex = 0
26+
let elementIndex = 0
27+
28+
const needReportComments = []
29+
while (commentIndex < commentRanges.length) {
30+
const [commentStart, commentEnd] = commentRanges[commentIndex]
31+
const [elementStart, elementEnd] = elementRanges[elementIndex]
32+
// if the comment is in the range of element, should skip
33+
if (commentStart > elementStart && commentEnd < elementEnd) {
34+
commentIndex += 1
35+
continue
36+
}
37+
38+
if (commentEnd < elementStart) {
39+
needReportComments.push(comments[commentIndex])
40+
commentIndex += 1
41+
}
42+
43+
// the element array has no any element, but comment still has some elements
44+
if (
45+
elementIndex === elementRanges.length - 1 &&
46+
commentStart > elementEnd
47+
) {
48+
needReportComments.push(comments[commentIndex])
49+
commentIndex += 1
50+
}
51+
52+
if (elementIndex < elementRanges.length - 1 && commentStart > elementEnd) {
53+
elementIndex += 1
54+
}
55+
}
56+
57+
return needReportComments
58+
}
59+
960
module.exports = {
1061
meta: {
1162
type: 'problem',
@@ -52,48 +103,7 @@ module.exports = {
52103

53104
const comments = element.comments
54105
if (disallowComments && comments.length > 0) {
55-
const commentRanges = comments.map((comment) => comment.range)
56-
const elementRanges = element.children
57-
.filter((child) => child.type === 'VElement')
58-
.map((child) => child.range)
59-
60-
let commentIndex = 0
61-
let elementIndex = 0
62-
63-
const needReportComments = elementRanges.length === 0 ? comments : []
64-
while (
65-
commentIndex < commentRanges.length &&
66-
elementRanges.length > 0
67-
) {
68-
const [commentStart, commentEnd] = commentRanges[commentIndex]
69-
const [elementStart, elementEnd] = elementRanges[elementIndex]
70-
if (commentStart > elementStart && commentEnd < elementEnd) {
71-
commentIndex += 1
72-
continue
73-
}
74-
75-
if (commentEnd < elementStart) {
76-
needReportComments.push(comments[commentIndex])
77-
commentIndex += 1
78-
}
79-
80-
// the element array has no any element, but comment still has some elements
81-
if (
82-
elementIndex === elementRanges.length - 1 &&
83-
commentStart > elementEnd
84-
) {
85-
needReportComments.push(comments[commentIndex])
86-
commentIndex += 1
87-
}
88-
89-
if (
90-
elementIndex < elementRanges.length - 1 &&
91-
commentStart > elementEnd
92-
) {
93-
elementIndex += 1
94-
}
95-
}
96-
106+
const needReportComments = getReportComments(comments, element)
97107
if (needReportComments.length > 0) {
98108
for (const comment of needReportComments) {
99109
context.report({

Diff for: tests/lib/rules/no-multiple-template-root.js

+54
Original file line numberDiff line numberDiff line change
@@ -203,6 +203,60 @@ ruleTester.run('no-multiple-template-root', rule, {
203203
}
204204
]
205205
},
206+
{
207+
code: `
208+
<template>
209+
<!-- comments -->
210+
<div v-if="for">
211+
<!-- comments -->
212+
12333
213+
<span>
214+
<!-- comments -->
215+
12333
216+
</span>
217+
</div>
218+
<!-- comments -->
219+
<div v-else>
220+
<!-- comments -->
221+
12333
222+
</div>
223+
<!-- comments -->
224+
</template>
225+
`,
226+
options: [{ disallowComments: true }],
227+
errors: [
228+
{
229+
message: 'The template root disallows comments.',
230+
line: 3
231+
},
232+
{
233+
message: 'The template root disallows comments.',
234+
line: 12
235+
},
236+
{
237+
message: 'The template root disallows comments.',
238+
line: 17
239+
}
240+
]
241+
},
242+
{
243+
code: `
244+
<template>
245+
<div>
246+
12333
247+
<!-- comments -->
248+
</div>
249+
<!-- comments -->
250+
</template>
251+
`,
252+
options: [{ disallowComments: true }],
253+
errors: [
254+
{
255+
message: 'The template root disallows comments.',
256+
line: 7
257+
}
258+
]
259+
},
206260
{
207261
code: `
208262
<template>

0 commit comments

Comments
 (0)