[Update] Improve the range of mustache-interpolation-spacing (#276)

* Fix: improve range of mustache-interpolation-spacing

* Chore: add linebreaks

Author: mysticatea

lib/rules/mustache-interpolation-spacing.js

@@ -29,58 +29,68 @@ module.exports = {
   },
 
   create (context) {
-    const options = context.options[0]
-    const optSpaces = options !== 'never'
-    const template = context.parserServices.getTemplateBodyTokenStore && context.parserServices.getTemplateBodyTokenStore()
-
-    // ----------------------------------------------------------------------
-    // Helpers
-    // ----------------------------------------------------------------------
-
-    function checkTokens (leftToken, rightToken) {
-      if (leftToken.loc.end.line === rightToken.loc.start.line) {
-        const spaces = rightToken.loc.start.column - leftToken.loc.end.column
-        const noSpacesFound = spaces === 0
-
-        if (optSpaces === noSpacesFound) {
-          context.report({
-            node: rightToken,
-            loc: {
-              start: leftToken.loc.end,
-              end: rightToken.loc.start
-            },
-            message: 'Found {{spaces}} whitespaces, {{type}} expected.',
-            data: {
-              spaces: spaces === 0 ? 'none' : spaces,
-              type: optSpaces ? '1' : 'none'
-            },
-            fix: (fixer) => fixer.replaceTextRange([leftToken.range[1], rightToken.range[0]], optSpaces ? ' ' : '')
-          })
-        }
-      }
-    }
+    const options = context.options[0] || 'always'
+    const template =
+      context.parserServices.getTemplateBodyTokenStore &&
+      context.parserServices.getTemplateBodyTokenStore()
 
     // ----------------------------------------------------------------------
     // Public
     // ----------------------------------------------------------------------
 
     return utils.defineTemplateBodyVisitor(context, {
       'VExpressionContainer[expression!=null]' (node) {
-        const tokens = template.getTokens(node, {
-          includeComments: true,
-          filter: token => token.type !== 'HTMLWhitespace' // When there is only whitespace between ignore it
-        })
+        const openBrace = template.getFirstToken(node)
+        const closeBrace = template.getLastToken(node)
+
+        if (
+          !openBrace ||
+          !closeBrace ||
+          openBrace.type !== 'VExpressionStart' ||
+          closeBrace.type !== 'VExpressionEnd'
+        ) {
+          return
+        }
 
-        const startToken = tokens.shift()
-        if (!startToken || startToken.type !== 'VExpressionStart') return
-        const endToken = tokens.pop()
-        if (!endToken || endToken.type !== 'VExpressionEnd') return
+        const firstToken = template.getTokenAfter(openBrace, { includeComments: true })
+        const lastToken = template.getTokenBefore(closeBrace, { includeComments: true })
 
-        if (tokens.length > 0) {
-          checkTokens(startToken, tokens[0])
-          checkTokens(tokens[tokens.length - 1], endToken)
+        if (options === 'always') {
+          if (openBrace.range[1] === firstToken.range[0]) {
+            context.report({
+              node: openBrace,
+              message: "Expected 1 space after '{{', but not found.",
+              fix: (fixer) => fixer.insertTextAfter(openBrace, ' ')
+            })
+          }
+          if (closeBrace.range[0] === lastToken.range[1]) {
+            context.report({
+              node: closeBrace,
+              message: "Expected 1 space before '}}', but not found.",
+              fix: (fixer) => fixer.insertTextBefore(closeBrace, ' ')
+            })
+          }
         } else {
-          checkTokens(startToken, endToken)
+          if (openBrace.range[1] !== firstToken.range[0]) {
+            context.report({
+              loc: {
+                start: openBrace.loc.start,
+                end: firstToken.loc.start
+              },
+              message: "Expected no space after '{{', but found.",
+              fix: (fixer) => fixer.removeRange([openBrace.range[1], firstToken.range[0]])
+            })
+          }
+          if (closeBrace.range[0] !== lastToken.range[1]) {
+            context.report({
+              loc: {
+                start: lastToken.loc.end,
+                end: closeBrace.loc.end
+              },
+              message: "Expected no space before '}}', but found.",
+              fix: (fixer) => fixer.removeRange([lastToken.range[1], closeBrace.range[0]])
+            })
+          }
         }
       }
     })

tests/lib/rules/mustache-interpolation-spacing.js

@@ -90,79 +90,58 @@ ruleTester.run('mustache-interpolation-spacing', rule, {
       code: '<template><div>{{ text}}</div></template>',
       output: '<template><div>{{ text }}</div></template>',
       options: ['always'],
-      errors: [{
-        message: 'Found none whitespaces, 1 expected.',
-        type: 'VExpressionEnd'
-      }]
+      errors: ["Expected 1 space before '}}', but not found."]
     },
     {
       filename: 'test.vue',
       code: '<template><div>{{text }}</div></template>',
       output: '<template><div>{{ text }}</div></template>',
       options: ['always'],
-      errors: [{
-        message: 'Found none whitespaces, 1 expected.',
-        type: 'Identifier'
-      }]
+      errors: ["Expected 1 space after '{{', but not found."]
     },
     {
       filename: 'test.vue',
       code: '<template><div>{{ text}}</div></template>',
       output: '<template><div>{{text}}</div></template>',
       options: ['never'],
-      errors: [{
-        message: 'Found 1 whitespaces, none expected.',
-        type: 'Identifier'
-      }]
+      errors: ["Expected no space after '{{', but found."]
     },
     {
       filename: 'test.vue',
       code: '<template><div>{{text }}</div></template>',
       output: '<template><div>{{text}}</div></template>',
       options: ['never'],
-      errors: [{
-        message: 'Found 1 whitespaces, none expected.',
-        type: 'VExpressionEnd'
-      }]
+      errors: ["Expected no space before '}}', but found."]
     },
     {
       filename: 'test.vue',
       code: '<template><div>{{text}}</div></template>',
       output: '<template><div>{{ text }}</div></template>',
       options: ['always'],
-      errors: [{
-        message: 'Found none whitespaces, 1 expected.',
-        type: 'Identifier'
-      }, {
-        message: 'Found none whitespaces, 1 expected.',
-        type: 'VExpressionEnd'
-      }]
+      errors: [
+        "Expected 1 space after '{{', but not found.",
+        "Expected 1 space before '}}', but not found."
+      ]
     },
     {
       filename: 'test.vue',
       code: '<template><div>{{ text }}</div></template>',
       output: '<template><div>{{text}}</div></template>',
       options: ['never'],
-      errors: [{
-        message: 'Found 1 whitespaces, none expected.',
-        type: 'Identifier'
-      }, {
-        message: 'Found 1 whitespaces, none expected.',
-        type: 'VExpressionEnd'
-      }]
+      errors: [
+        "Expected no space after '{{', but found.",
+        "Expected no space before '}}', but found."
+      ]
     },
     {
       filename: 'test.vue',
       code: '<template><div>{{   text   }}</div></template>',
       output: '<template><div>{{text}}</div></template>',
       options: ['never'],
-      errors: [{
-        message: 'Found 3 whitespaces, none expected.',
-        type: 'Identifier'
-      }, {
-        message: 'Found 3 whitespaces, none expected.',
-        type: 'VExpressionEnd'
-      }]
+      errors: [
+        "Expected no space after '{{', but found.",
+        "Expected no space before '}}', but found."
+      ]
     }
   ]
 })