Add vue/require-typed-object-prop rule

docs/rules/force-types-on-object-props.md

@@ -0,0 +1,93 @@
+---
+pageClass: rule-details
+sidebarDepth: 0
+title: vue/force-types-on-object-props
+description: enforce user to add type declaration to object props
+---
+# vue/force-types-on-object-props
+
+> enforce user to add type declaration to object props
+
+- :exclamation: <badge text="This rule has not been released yet." vertical="middle" type="error"> ***This rule has not been released yet.*** </badge>
+- :gear: This rule is included in all of `"plugin:vue/base"`, `"plugin:vue/essential"`, `"plugin:vue/vue3-essential"`, `"plugin:vue/strongly-recommended"`, `"plugin:vue/vue3-strongly-recommended"`, `"plugin:vue/recommended"` and `"plugin:vue/vue3-recommended"`.
+
+## :book: Rule Details
+
+Prevent missing type declaration of not primitive objects in a TypeScript projects.
+
+Bad:
+
+<eslint-code-block :rules="{'vue/force-types-on-object-props': ['error']}">
+
+```js
+export default {
+  props: {
+    prop: {
+      type: Object,
+    },
+  },
+}
+```
+
+</eslint-code-block>
+
+<eslint-code-block :rules="{'vue/force-types-on-object-props': ['error']}">
+
+```ts
+export default {
+  props: {
+    prop: {
+      type: Array
+    }
+  }
+}
+```
+
+</eslint-code-block>
+
+Good:
+
+<eslint-code-block :rules="{'vue/force-types-on-object-props': ['error']}">
+
+```ts
+export default {
+  props: {
+    prop: {
+      type: Object as Props<Anything>,
+    }
+  }
+}
+```
+
+</eslint-code-block>
+
+<eslint-code-block :rules="{'vue/force-types-on-object-props': ['error']}">
+
+```ts
+export default {
+  props: {
+    prop: {
+      type: String, // or any other primitive type
+    }
+  }
+}
+```
+
+</eslint-code-block>
+
+### Options
+
+Nothing.
+
+## :mute: When Not To Use It
+
+When you're not using TypeScript in the project****.
+
+## :books: Further Reading
+
+Nothing
+
+## :mag: Implementation
+
+- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/force-types-on-object-props.js)
+- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/force-types-on-object-props.js)

docs/rules/index.md

@@ -28,6 +28,7 @@ Rules in this category are enabled for all presets provided by eslint-plugin-vue
 | Rule ID | Description |    |    |
 |:--------|:------------|:--:|:--:|
 | [vue/comment-directive](./comment-directive.md) | support comment-directives in `<template>` |  | :warning: |
+| [vue/force-types-on-object-props](./force-types-on-object-props.md) | enforce user to add type declaration to object props |  | :hammer: |
 | [vue/jsx-uses-vars](./jsx-uses-vars.md) | prevent variables used in JSX to be marked as unused |  | :warning: |
 
 </rules-table>

lib/index.js

@@ -35,6 +35,7 @@ module.exports = {
     'dot-notation': require('./rules/dot-notation'),
     eqeqeq: require('./rules/eqeqeq'),
     'first-attribute-linebreak': require('./rules/first-attribute-linebreak'),
+    'force-types-on-object-props': require('./rules/force-types-on-object-props'),
     'func-call-spacing': require('./rules/func-call-spacing'),
     'html-button-has-type': require('./rules/html-button-has-type'),
     'html-closing-bracket-newline': require('./rules/html-closing-bracket-newline'),

lib/rules/force-types-on-object-props.js

@@ -0,0 +1,119 @@
+/**
+ * @author Przemysław Jan Beigert
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Helpers
+// ------------------------------------------------------------------------------
+
+/**
+ * Check if all keys and values from second object are resent in first object
+ *
+ * @param {{ [key: string]: any }} a object to
+ * @param {{ [key: string]: any }} b The string to escape.
+ * @returns {boolean} Returns the escaped string.
+ */
+const isLooksLike = (a, b) =>
+  a &&
+  b &&
+  Object.keys(b).every((bKey) => {
+    const bVal = b[bKey]
+    const aVal = a[bKey]
+    if (typeof bVal === 'function') {
+      return bVal(aVal)
+    }
+    return bVal == null || /^[bns]/.test(typeof bVal)
+      ? bVal === aVal
+      : isLooksLike(aVal, bVal)
+  })
+
+//------------------------------------------------------------------------------
+// Rule Definition
+//------------------------------------------------------------------------------
+
+module.exports = {
+  meta: {
+    type: 'suggestion',
+    docs: {
+      description: 'enforce user to add type declaration to object props',
+      categories: ['base'],
+      recommended: false,
+      url: 'https://eslint.vuejs.org/rules/force-types-on-object-props.html'
+    },
+    fixable: null,
+    schema: []
+  },
+  /** @param {RuleContext} context */
+  create(context) {
+    return {
+      /** @param {ExportDefaultDeclaration} node */
+      ExportDefaultDeclaration(node) {
+        if (node.declaration.type !== 'ObjectExpression') {
+          return
+        }
+        if (!Array.isArray(node.declaration.properties)) {
+          return
+        }
+
+        const property = node.declaration.properties.find(
+          (property) =>
+            property.type === 'Property' &&
+            isLooksLike(property.key, { type: 'Identifier', name: 'props' }) &&
+            property.value.type === 'ObjectExpression'
+        )
+
+        if (
+          !property ||
+          property.type === 'SpreadElement' ||
+          !('properties' in property.value)
+        ) {
+          return
+        }
+        const properties = property.value.properties
+          .filter(
+            (prop) =>
+              prop.type === 'Property' && prop.value.type === 'ObjectExpression'
+          )
+          .map((prop) =>
+            prop.value.properties.find((propValueProperty) =>
+              isLooksLike(propValueProperty.key, {
+                type: 'Identifier',
+                name: 'type'
+              })
+            )
+          )
+        for (const prop of properties) {
+          if (!prop) {
+            continue
+          }
+          if (isLooksLike(prop.value, { type: 'Identifier', name: 'Object' })) {
+            context.report({
+              node: prop,
+              message: 'Object props has to contains type.'
+            })
+          }
+          if (prop.value.type === 'TSAsExpression') {
+            const { typeAnnotation } = prop.value
+            if (
+              [
+                'TSAnyKeyword',
+                'TSTypeLiteral',
+                'TSUnknownKeyword',
+                'TSObjectKeyword'
+              ].includes(typeAnnotation.type) ||
+              !typeAnnotation.typeName ||
+              typeAnnotation.typeName.name !== 'Prop'
+            ) {
+              context.report({
+                node: prop,
+                message: 'Object props has to contains type.'
+              })
+            }
+          }
+        }
+      }
+    }
+  }
+}

tests/lib/rules/force-types-on-object-props.js

@@ -0,0 +1,95 @@
+/**
+ * @author *****your name*****
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+const RuleTester = require('eslint').RuleTester
+const rule = require('../../../lib/rules/force-types-on-object-props')
+
+const template = (prop) => `
+<script lang="ts">
+import { Prop } from 'vue/types/options';
+export default {
+	props: {
+		prop: {
+			${prop}
+		}
+	}
+}
+</script>  
+`
+
+const ruleTester = new RuleTester({
+  parser: require.resolve('vue-eslint-parser'),
+  parserOptions: {
+    ecmaVersion: 2015,
+    sourceType: 'module',
+    parser: '@typescript-eslint/parser'
+  }
+})
+
+ruleTester.run('force-types-on-object-props', rule, {
+  valid: [
+    `
+  <script lang="ts">
+  export default {
+  }
+  </script>  	
+`,
+    `
+  <script lang="ts">
+  export default {
+    props: {}
+  }
+  </script>  	
+`,
+    template('type: Object as Prop<{}>'),
+    template('type: String'),
+    template('type: Number'),
+    template('type: Boolean'),
+    template('type: [String, Number, Boolean]')
+  ],
+  invalid: [
+    {
+      code: template('type: Object'),
+      errors: [
+        {
+          message: 'Object props has to contains type.'
+        }
+      ]
+    },
+    {
+      code: template('type: Object as any'),
+      errors: [
+        {
+          message: 'Object props has to contains type.'
+        }
+      ]
+    },
+    {
+      code: template('type: Object as {}'),
+      errors: [
+        {
+          message: 'Object props has to contains type.'
+        }
+      ]
+    },
+    {
+      code: template('type: Object as unknown'),
+      errors: [
+        {
+          message: 'Object props has to contains type.'
+        }
+      ]
+    },
+    {
+      code: template('type: Object as string'),
+      errors: [
+        {
+          message: 'Object props has to contains type.'
+        }
+      ]
+    }
+  ]
+})