refactor(no-multiple-template-root): optimize code

Author: chouchouji

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

@@ -9,53 +9,16 @@ const utils = require('../utils')
 /**
  * Get all comments that need to be reported
  * @param {(HTMLComment | HTMLBogusComment | Comment)[]} comments
- * @param {VRootElement} element
+ * @param {Range[]} elementRanges
  * @returns {(HTMLComment | HTMLBogusComment | Comment)[]}
  */
-function getReportComments(comments, element) {
-  const commentRanges = comments.map((comment) => comment.range)
-  const elementRanges = element.children
-    .filter((child) => child.type === 'VElement')
-    .map((child) => child.range)
-
-  // should return comment directly when no any elements
-  if (elementRanges.length === 0) {
-    return comments
-  }
-
-  let commentIndex = 0
-  let elementIndex = 0
-
-  const needReportComments = []
-  while (commentIndex < commentRanges.length) {
-    const [commentStart, commentEnd] = commentRanges[commentIndex]
-    const [elementStart, elementEnd] = elementRanges[elementIndex]
-    // if the comment is in the range of element, should skip
-    if (commentStart > elementStart && commentEnd < elementEnd) {
-      commentIndex += 1
-      continue
-    }
-
-    if (commentEnd < elementStart) {
-      needReportComments.push(comments[commentIndex])
-      commentIndex += 1
-    }
-
-    // the element array has no any element, but comment still has some elements
-    if (
-      elementIndex === elementRanges.length - 1 &&
-      commentStart > elementEnd
-    ) {
-      needReportComments.push(comments[commentIndex])
-      commentIndex += 1
-    }
-
-    if (elementIndex < elementRanges.length - 1 && commentStart > elementEnd) {
-      elementIndex += 1
-    }
-  }
-
-  return needReportComments
+function getReportComments(comments, elementRanges) {
+  return comments.filter(  
+    (comment) =>  
+      !elementRanges.some(  
+        (range) => range[0] <= comment.range[0] && comment.range[1] <= range[1]  
+      )  
+  )  
 }
 
 module.exports = {
@@ -103,16 +66,14 @@ module.exports = {
         }
 
         const comments = element.comments
+        const elementRanges = element.children.map((child) => child.range)
         if (disallowComments && comments.length > 0) {
-          const needReportComments = getReportComments(comments, element)
-          if (needReportComments.length > 0) {
-            for (const comment of needReportComments) {
-              context.report({
-                node: comment,
-                loc: comment.loc,
-                messageId: 'commentRoot'
-              })
-            }
+          for (const comment of getReportComments(comments, elementRanges)) {
+            context.report({
+              node: comment,
+              loc: comment.loc,
+              messageId: 'commentRoot'
+            })
           }
         }
 

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

@@ -257,6 +257,26 @@ ruleTester.run('no-multiple-template-root', rule, {
         }
       ]
     },
+    {
+      code: `
+      <template>
+        <div />
+        <!-- comments -->
+        <div />
+      </template>
+      `,
+      options: [{ disallowComments: true }],
+      errors: [
+        {
+          message: 'The template root disallows comments.',
+          line: 4
+        },
+        {
+          message: 'The template root requires exactly one element.',
+          line: 5
+        }
+      ]
+    },
     {
       code: `
       <template>