diff --git a/lib/rules/prop-name-casing.js b/lib/rules/prop-name-casing.js index 04c2a16eb..90d9ca2f1 100644 --- a/lib/rules/prop-name-casing.js +++ b/lib/rules/prop-name-casing.js @@ -50,6 +50,16 @@ function create (context) { if (item.type !== 'Property') { return } + if (item.computed) { + if (item.key.type !== 'Literal') { + // TemplateLiteral | Identifier(variable) | Expression(s) + return + } + if (typeof item.key.value !== 'string') { + // (boolean | null | number | RegExp) Literal + return + } + } const propName = item.key.type === 'Literal' ? item.key.value : item.key.name const convertedName = converter(propName) diff --git a/tests/lib/rules/prop-name-casing.js b/tests/lib/rules/prop-name-casing.js index 0c706635d..cfeeaf8e8 100644 --- a/tests/lib/rules/prop-name-casing.js +++ b/tests/lib/rules/prop-name-casing.js @@ -108,6 +108,186 @@ ruleTester.run('prop-name-casing', rule, { `, options: ['snake_case'], parserOptions + }, + { + // computed property name + filename: 'test.vue', + code: ` + export default { + props: { + ['greetingText']: String + } + } + `, + parserOptions + }, + { + // computed property name + filename: 'test.vue', + code: ` + export default { + props: { + [('greetingText')]: String + } + } + `, + parserOptions + }, + { + // TemplateLiteral computed property does not warn + filename: 'test.vue', + code: ` + export default { + props: { + [\`greeting-text\`]: String + } + } + `, + parserOptions + }, + { + // TemplateLiteral computed property does not warn + filename: 'test.vue', + code: ` + export default { + props: { + [\`greeting\${'-'}text\`]: String + } + } + `, + parserOptions + }, + { + // shorthand + filename: 'test.vue', + code: ` + export default { + props: { + greetingText + } + } + `, + parserOptions + }, + { + // valiable computed property name does not warn + filename: 'test.vue', + code: ` + export default { + props: { + [greeting_text]: String + } + } + `, + parserOptions + }, + { + // valiable computed property name does not warn + filename: 'test.vue', + code: ` + export default { + props: { + [greeting.text]: String + } + } + `, + parserOptions + }, + { + // BinaryExpression computed property name does not warn + filename: 'test.vue', + code: ` + export default { + props: { + ['greeting'+'-text']: String + } + } + `, + parserOptions + }, + { + // CallExpression computed property name does not warn + filename: 'test.vue', + code: ` + export default { + props: { + [greeting_text()]: String + } + } + `, + parserOptions + }, + { + // ThisExpression computed property name does not warn + filename: 'test.vue', + code: ` + export default { + props: { + [this]: String + } + } + `, + parserOptions + }, + { + // ArrayExpression computed property name does not warn + filename: 'test.vue', + code: ` + export default { + props: { + [['greeting-text']]: String + } + } + `, + parserOptions + }, + { + // number Literal computed property name + filename: 'test.vue', + code: ` + export default { + props: { + [1]: String + } + } + `, + parserOptions + }, + { + // boolean Literal computed property name + filename: 'test.vue', + code: ` + export default { + props: { + [true]: String + } + } + `, + parserOptions + }, + { + // null Literal computed property name + filename: 'test.vue', + code: ` + export default { + props: { + [null]: String + } + } + `, + parserOptions + }, + { + // RegExp Literal computed property name + filename: 'test.vue', + code: ` + export default { + props: { + [/greeting-text/]: String + } + } + `, + parserOptions } ], @@ -290,25 +470,6 @@ ruleTester.run('prop-name-casing', rule, { line: 4 }] }, - { - // valiable computed property name - filename: 'test.vue', - code: ` - export default { - props: { - [greeting_text]: String - } - } - `, - output: null, - parserOptions, - errors: [{ - // bug ? - message: 'Prop "greeting_text" is not in camelCase.', - type: 'Property', - line: 4 - }] - }, { // emoji filename: 'test.vue', @@ -367,6 +528,24 @@ ruleTester.run('prop-name-casing', rule, { type: 'Property', line: 4 }] + }, + { + // Parentheses computed property name + filename: 'test.vue', + code: ` + export default { + props: { + [('greeting-text')]: String + } + } + `, + output: null, + parserOptions, + errors: [{ + message: 'Prop "greeting-text" is not in camelCase.', + type: 'Property', + line: 4 + }] } ] })