Add composition api's computed function support to vue/no-side-effects-in-computed-properties close vuejs#1393

Author: sapphi-red

lib/rules/no-side-effects-in-computed-properties.js

@@ -3,7 +3,7 @@
  * @author Michał Sajnóg
  */
 'use strict'
-
+const { ReferenceTracker, findVariable } = require('eslint-utils')
 const utils = require('../utils')
 
 /**
@@ -31,6 +31,8 @@ module.exports = {
   create(context) {
     /** @type {Map<ObjectExpression, ComponentComputedProperty[]>} */
     const computedPropertiesMap = new Map()
+    /** @type {Array<FunctionExpression | ArrowFunctionExpression>} */
+    const computedCallNodes = []
 
     /**
      * @typedef {object} ScopeStack
@@ -54,56 +56,130 @@ module.exports = {
       scopeStack = scopeStack && scopeStack.upper
     }
 
-    return utils.defineVueVisitor(context, {
-      onVueObjectEnter(node) {
-        computedPropertiesMap.set(node, utils.getComputedProperties(node))
-      },
-      ':function': onFunctionEnter,
-      ':function:exit': onFunctionExit,
-
-      /**
-       * @param {(Identifier | ThisExpression) & {parent: MemberExpression}} node
-       * @param {VueObjectData} data
-       */
-      'MemberExpression > :matches(Identifier, ThisExpression)'(
-        node,
-        { node: vueNode }
-      ) {
-        if (!scopeStack) {
-          return
-        }
-        const targetBody = scopeStack.body
-        const computedProperty = /** @type {ComponentComputedProperty[]} */ (computedPropertiesMap.get(
-          vueNode
-        )).find((cp) => {
-          return (
-            cp.value &&
-            node.loc.start.line >= cp.value.loc.start.line &&
-            node.loc.end.line <= cp.value.loc.end.line &&
-            targetBody === cp.value
-          )
-        })
-        if (!computedProperty) {
-          return
-        }
+    return Object.assign(
+      {
+        Program() {
+          const tracker = new ReferenceTracker(context.getScope())
+          const traceMap = utils.createCompositionApiTraceMap({
+            [ReferenceTracker.ESM]: true,
+            computed: {
+              [ReferenceTracker.CALL]: true
+            }
+          })
 
-        if (!utils.isThis(node, context)) {
-          return
-        }
-        const mem = node.parent
-        if (mem.object !== node) {
-          return
+          for (const { node } of tracker.iterateEsmReferences(traceMap)) {
+            if (node.type !== 'CallExpression') {
+              continue
+            }
+
+            const getterBody = utils.getGetterBodyFromComputedFunction(node)
+            if (getterBody) {
+              computedCallNodes.push(getterBody)
+            }
+          }
         }
+      },
+      utils.defineVueVisitor(context, {
+        onVueObjectEnter(node) {
+          computedPropertiesMap.set(node, utils.getComputedProperties(node))
+        },
+        ':function': onFunctionEnter,
+        ':function:exit': onFunctionExit,
+
+        /**
+         * @param {(Identifier | ThisExpression) & {parent: MemberExpression}} node
+         * @param {VueObjectData} data
+         */
+        'MemberExpression > :matches(Identifier, ThisExpression)'(
+          node,
+          { node: vueNode }
+        ) {
+          if (!scopeStack) {
+            return
+          }
+          const targetBody = scopeStack.body
 
-        const invalid = utils.findMutating(mem)
-        if (invalid) {
-          context.report({
-            node: invalid.node,
-            message: 'Unexpected side effect in "{{key}}" computed property.',
-            data: { key: computedProperty.key || 'Unknown' }
+          const computedProperty = /** @type {ComponentComputedProperty[]} */ (computedPropertiesMap.get(
+            vueNode
+          )).find((cp) => {
+            return (
+              cp.value &&
+              node.loc.start.line >= cp.value.loc.start.line &&
+              node.loc.end.line <= cp.value.loc.end.line &&
+              targetBody === cp.value
+            )
           })
+          if (computedProperty) {
+            if (!utils.isThis(node, context)) {
+              return
+            }
+            const mem = node.parent
+            if (mem.object !== node) {
+              return
+            }
+
+            const invalid = utils.findMutating(mem)
+            if (invalid) {
+              context.report({
+                node: invalid.node,
+                message:
+                  'Unexpected side effect in "{{key}}" computed property.',
+                data: { key: computedProperty.key || 'Unknown' }
+              })
+            }
+            return
+          }
+
+          // ignore `this` for computed functions
+          if (node.type === 'ThisExpression') {
+            return
+          }
+
+          const computedFunction = computedCallNodes.find(
+            (c) =>
+              node.loc.start.line >= c.loc.start.line &&
+              node.loc.end.line <= c.loc.end.line
+          )
+          if (!computedFunction) {
+            return
+          }
+
+          const mem = node.parent
+          if (mem.object !== node) {
+            return
+          }
+
+          const variable = findVariable(context.getScope(), node)
+          if (variable) {
+            if (variable.defs.length !== 1) {
+              return
+            }
+
+            const def = variable.defs[0]
+            if (
+              def.type !== 'ImplicitGlobalVariable' &&
+              def.type !== 'TDZ' &&
+              def.type !== 'ImportBinding'
+            ) {
+              if (
+                def.node.loc.start.line >= computedFunction.loc.start.line &&
+                def.node.loc.end.line <= computedFunction.loc.end.line
+              ) {
+                // mutating local variables are accepted
+                return
+              }
+            }
+          }
+
+          const invalid = utils.findMutating(mem)
+          if (invalid) {
+            context.report({
+              node: invalid.node,
+              message: 'Unexpected side effect in computed function.'
+            })
+          }
         }
-      }
-    })
+      })
+    )
   }
 }