Update vue/no-unused-refs rule to support setup() and <script setup> (#1556)

Author: ota-meshi

lib/rules/no-unused-refs.js

@@ -180,25 +180,64 @@ module.exports = {
           reportUnusedRefs()
         }
       },
-      {
-        Identifier(id) {
-          if (hasUnknown) {
-            return
-          }
-          if (id.name !== '$refs') {
-            return
+      utils.compositingVisitors(
+        utils.isScriptSetup(context)
+          ? {
+              Program() {
+                const globalScope =
+                  context.getSourceCode().scopeManager.globalScope
+                if (!globalScope) {
+                  return
+                }
+                for (const variable of globalScope.variables) {
+                  if (variable.defs.length > 0) {
+                    usedRefs.add(variable.name)
+                  }
+                }
+                const moduleScope = globalScope.childScopes.find(
+                  (scope) => scope.type === 'module'
+                )
+                if (!moduleScope) {
+                  return
+                }
+                for (const variable of moduleScope.variables) {
+                  if (variable.defs.length > 0) {
+                    usedRefs.add(variable.name)
+                  }
+                }
+              }
+            }
+          : {},
+        utils.defineVueVisitor(context, {
+          onVueObjectEnter(node) {
+            for (const prop of utils.iterateProperties(
+              node,
+              new Set(['setup'])
+            )) {
+              usedRefs.add(prop.name)
+            }
           }
-          /** @type {Identifier | MemberExpression} */
-          let refsNode = id
-          if (id.parent.type === 'MemberExpression') {
-            if (id.parent.property === id) {
-              // `this.$refs.foo`
-              refsNode = id.parent
+        }),
+        {
+          Identifier(id) {
+            if (hasUnknown) {
+              return
+            }
+            if (id.name !== '$refs') {
+              return
             }
+            /** @type {Identifier | MemberExpression} */
+            let refsNode = id
+            if (id.parent.type === 'MemberExpression') {
+              if (id.parent.property === id) {
+                // `this.$refs.foo`
+                refsNode = id.parent
+              }
+            }
+            extractUsedForPattern(refsNode)
           }
-          extractUsedForPattern(refsNode)
         }
-      }
+      )
     )
   }
 }

tests/lib/rules/no-unused-refs.js

@@ -284,6 +284,37 @@ tester.run('no-unused-refs', rule, {
       }
       </script>
       `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <input ref="x" />
+      </template>
+      <script>
+      import {ref} from 'vue'
+      export default {
+        setup() {
+          const x = ref(null)
+          return {
+            x
+          }
+        }
+      }
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <input ref="x" />
+      </template>
+      <script setup>
+      import {ref} from 'vue'
+      const x = ref(null)
+      </script>
+      `
     }
   ],