feat: support typeArguments

Author: 9romise

lib/rules/prefer-use-template-ref.js

@@ -51,6 +51,7 @@ module.exports = {
   },
   /** @param {RuleContext} context */
   create(context) {
+    const sourceCode = context.sourceCode
     /** @type Set<string> */
     const templateRefs = new Set()
 
@@ -100,9 +101,12 @@ module.exports = {
                 name: /** @type {Identifier} */ (scriptRef.callee).name
               },
               fix(fixer) {
+                const typeArgs =
+                  scriptRef.typeArguments ?? scriptRef.typeParameters
+
                 return fixer.replaceText(
                   scriptRef,
-                  `useTemplateRef('${templateRef}')`
+                  `useTemplateRef${typeArgs ? sourceCode.getText(typeArgs) : ''}('${templateRef}')`
                 )
               }
             })

tests/lib/rules/prefer-use-template-ref.js

@@ -623,6 +623,42 @@ tester.run('prefer-use-template-ref', rule, {
           endColumn: 25
         }
       ]
+    },
+    {
+      filename: 'ref-with-typeArguments.vue',
+      languageOptions: {
+        parserOptions: {
+          parser: require('@typescript-eslint/parser')
+        }
+      },
+      code: `
+        <template>
+          <div ref="root" />
+        </template>
+        <script setup lang="ts">
+        const root = ref<HTMLElement | null>()
+        </script>
+      `,
+      output: `
+        <template>
+          <div ref="root" />
+        </template>
+        <script setup lang="ts">
+        const root = useTemplateRef<HTMLElement | null>('root')
+        </script>
+      `,
+      errors: [
+        {
+          messageId: 'preferUseTemplateRef',
+          data: {
+            name: 'ref'
+          },
+          line: 6,
+          column: 22,
+          endLine: 6,
+          endColumn: 47
+        }
+      ]
     }
   ]
 })