feat: autofix in define-props-declaration: runtime syntax to type-based syntax (#2465)

refactoring

Author: mpiniarski

lib/rules/define-props-declaration.js

@@ -40,12 +40,15 @@ const mapNativeType = (/** @type {string} */ nativeType) => {
  * @param {SourceCode} sourceCode
  */
 function getComponentPropData(prop, sourceCode) {
+  if (prop.propName === null) {
+    throw new Error('Unexpected prop with null name.')
+  }
   if (prop.type !== 'object') {
     throw new Error(`Unexpected prop type: ${prop.type}.`)
   }
   const type = optionGetType(prop.value, sourceCode)
   if (type === null) {
-    throw new Error(`Unexpected prop type: ${prop.type}.`)
+    throw new Error(`Unable to read prop type`)
   }
   const required = optionGetRequired(prop.value)
   const defaultValue = optionGetDefault(prop.value)
@@ -69,33 +72,10 @@ function optionGetType(node, sourceCode) {
       return mapNativeType(node.name)
     }
     case 'ObjectExpression': {
-      // foo: {
       const typeProperty = utils.findProperty(node, 'type')
       if (typeProperty == null) {
         return null
       }
-      if (typeProperty.value.type === 'TSAsExpression') {
-        const typeAnnotation = typeProperty.value.typeAnnotation
-        if (typeAnnotation.typeName.name !== 'PropType') {
-          return null
-        }
-
-        // in some project configuration parser populates deprecated field `typeParameters` instead of `typeArguments`
-        const typeArguments =
-          'typeArguments' in typeProperty.value
-            ? typeAnnotation.typeArguments
-            : typeAnnotation.typeParameters
-
-        const typeArgument = Array.isArray(typeArguments)
-          ? typeArguments[0].params[0]
-          : typeArguments.params[0]
-
-        if (typeArgument === undefined) {
-          return null
-        }
-
-        return sourceCode.getText(typeArgument)
-      }
       return optionGetType(typeProperty.value, sourceCode)
     }
     case 'ArrayExpression': {
@@ -111,6 +91,29 @@ function optionGetType(node, sourceCode) {
         .filter(Boolean)
         .join(' | ')
     }
+    case 'TSAsExpression': {
+      const typeAnnotation = node.typeAnnotation
+      if (typeAnnotation.typeName.name !== 'PropType') {
+        return null
+      }
+
+      // in some project configuration parser populates deprecated field `typeParameters` instead of `typeArguments`
+      const typeArguments =
+        'typeArguments' in node
+          ? typeAnnotation.typeArguments
+          : typeAnnotation.typeParameters
+
+      const typeArgument = Array.isArray(typeArguments)
+        ? typeArguments[0].params[0]
+        : typeArguments.params[0]
+
+      if (typeArgument === undefined) {
+        return null
+      }
+
+      return sourceCode.getText(typeArgument)
+    }
+
     case 'FunctionExpression':
     case 'ArrowFunctionExpression': {
       return null

tests/lib/rules/define-props-declaration.js

@@ -566,7 +566,6 @@ tester.run('define-props-declaration', rule, {
     },
     // Array of types
     {
-      only: true,
       filename: 'test.vue',
       code: `
         <script setup lang="ts">