diff --git a/docs/rules/require-name-property.md b/docs/rules/require-name-property.md new file mode 100644 index 000000000..7217cb52d --- /dev/null +++ b/docs/rules/require-name-property.md @@ -0,0 +1,43 @@ +--- +pageClass: rule-details +sidebarDepth: 0 +title: vue/require-name-property +description: require a component name property +--- +# vue/require-name-property +> require a component name property + +## :book: Rule Details + +This rule requires a `name` property to be set on components. + + + +```vue + +``` + + + +## :wrench: Options + +Nothing. + +## :mag: Implementation + +- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/require-name-property.js) +- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/require-name-property.js) diff --git a/lib/rules/require-name-property.js b/lib/rules/require-name-property.js new file mode 100644 index 000000000..126c1bfe6 --- /dev/null +++ b/lib/rules/require-name-property.js @@ -0,0 +1,37 @@ +/** + * @fileoverview Require a name property in Vue components + * @author LukeeeeBennett + */ +'use strict' + +const utils = require('../utils') + +function isNameProperty (node) { + return node.type === 'Property' && + node.key.name === 'name' && + !node.computed +} + +module.exports = { + meta: { + type: 'suggestion', + docs: { + description: 'require a name property in Vue components', + category: undefined, + url: 'https://eslint.vuejs.org/rules/require-name-property.html' + }, + fixable: null, + schema: [] + }, + + create (context) { + return utils.executeOnVue(context, component => { + if (component.properties.some(isNameProperty)) return + + context.report({ + node: component, + message: 'Required name property is not set.' + }) + }) + } +} diff --git a/tests/lib/rules/require-name-property.js b/tests/lib/rules/require-name-property.js new file mode 100644 index 000000000..7b55e2400 --- /dev/null +++ b/tests/lib/rules/require-name-property.js @@ -0,0 +1,102 @@ +/** + * @fileoverview Require a name property in Vue components + * @author LukeeeeBennett + */ +'use strict' + +const rule = require('../../../lib/rules/require-name-property') +const RuleTester = require('eslint').RuleTester + +const parserOptions = { + ecmaVersion: 2018, + sourceType: 'module' +} + +const ruleTester = new RuleTester() +ruleTester.run('require-name-property', rule, { + valid: [ + { + filename: 'ValidComponent.vue', + code: ` + export default { + name: 'IssaName' + } + `, + parserOptions + }, + { + filename: 'ValidComponent.vue', + code: ` + export default { + name: undefined + } + `, + parserOptions + }, + { + filename: 'ValidComponent.vue', + code: ` + export default { + name: '' + } + `, + parserOptions + } + ], + + invalid: [ + { + filename: 'InvalidComponent.vue', + code: ` + export default { + } + `, + parserOptions, + errors: [{ + message: 'Required name property is not set.', + type: 'ObjectExpression' + }] + }, + { + filename: 'InvalidComponent.vue', + code: ` + export default { + nameNot: 'IssaNameNot' + } + `, + parserOptions, + errors: [{ + message: 'Required name property is not set.', + type: 'ObjectExpression' + }] + }, + { + filename: 'InvalidComponent.vue', + code: ` + export default { + computed: { + name() { return 'name' } + } + } + `, + parserOptions, + errors: [{ + message: 'Required name property is not set.', + type: 'ObjectExpression' + }] + }, + { + filename: 'InvalidComponent.vue', + code: ` + export default { + [name]: 'IssaName' + } + `, + parserOptions, + errors: [{ + message: 'Required name property is not set.', + type: 'ObjectExpression' + }] + } + ] +})