Improve tests & detecting '-'

Author: armano2

lib/rules/attribute-hyphenation.js

@@ -16,7 +16,6 @@ function create (context) {
   const options = context.options[0]
   const useHyphenated = options !== 'never'
 
-  const kebabCase = casing.getConverter('kebab-case')
   const caseConverter = casing.getConverter(useHyphenated ? 'kebab-case' : 'camelCase')
 
   function reportIssue (node, name) {
@@ -37,7 +36,7 @@ function create (context) {
     if (value.indexOf('data-') !== -1 || value.indexOf('aria-') !== -1) {
       return true
     }
-    return useHyphenated ? kebabCase(value) === value : kebabCase(value) !== value
+    return useHyphenated ? value.toLowerCase() === value : !/-/.test(value)
   }
 
   // ----------------------------------------------------------------------
@@ -49,11 +48,8 @@ function create (context) {
       if (!utils.isCustomComponent(node.parent.parent)) return
 
       const name = !node.directive ? node.key.name : node.key.name === 'bind' ? node.key.argument : false
-      if (!name) return
+      if (!name || isIgnoredAttribute(name)) return
 
-      if (isIgnoredAttribute(name)) {
-        return
-      }
       reportIssue(node, name)
     }
   })

tests/lib/rules/attribute-hyphenation.js

@@ -30,12 +30,17 @@ ruleTester.run('attribute-hyphenation', rule, {
     },
     {
       filename: 'test.vue',
-      code: '<template><div><custom my-prop="prop"></custom></div></template>',
+      code: '<template><div><custom data-id="foo" aria-test="bar" my-prop="prop"></custom></div></template>',
       options: ['always']
     },
     {
       filename: 'test.vue',
-      code: '<template><div><a onClick="" my-prop="prop"></a></div></template>',
+      code: '<template><div><custom data-id="foo" aria-test="bar" myProp="prop"></custom></div></template>',
+      options: ['never']
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div data-id="foo" aria-test="bar"><a onClick="" my-prop="prop"></a></div></template>',
       options: ['never']
     }
   ],
@@ -44,6 +49,7 @@ ruleTester.run('attribute-hyphenation', rule, {
     {
       filename: 'test.vue',
       code: '<template><div><custom my-prop="prop"></custom></div></template>',
+      output: '<template><div><custom myProp="prop"></custom></div></template>',
       options: ['never'],
       errors: [{
         message: "Attribute 'my-prop' cann't be hyphenated.",
@@ -54,6 +60,7 @@ ruleTester.run('attribute-hyphenation', rule, {
     {
       filename: 'test.vue',
       code: '<template><div><custom MyProp="prop"></custom></div></template>',
+      output: '<template><div><custom my-prop="prop"></custom></div></template>',
       options: ['always'],
       errors: [{
         message: "Attribute 'MyProp' must be hyphenated.",
@@ -64,6 +71,7 @@ ruleTester.run('attribute-hyphenation', rule, {
     {
       filename: 'test.vue',
       code: '<template><div><custom :my-prop="prop"></custom></div></template>',
+      output: '<template><div><custom :myProp="prop"></custom></div></template>',
       options: ['never'],
       errors: [{
         message: "Attribute ':my-prop' cann't be hyphenated.",
@@ -74,6 +82,7 @@ ruleTester.run('attribute-hyphenation', rule, {
     {
       filename: 'test.vue',
       code: '<template><div><custom :MyProp="prop"></custom></div></template>',
+      output: '<template><div><custom :my-prop="prop"></custom></div></template>',
       options: ['always'],
       errors: [{
         message: "Attribute ':MyProp' must be hyphenated.",
@@ -84,6 +93,7 @@ ruleTester.run('attribute-hyphenation', rule, {
     {
       filename: 'test.vue',
       code: '<template><div><custom v-bind:my-prop="prop"></custom></div></template>',
+      output: '<template><div><custom v-bind:myProp="prop"></custom></div></template>',
       options: ['never'],
       errors: [{
         message: "Attribute 'v-bind:my-prop' cann't be hyphenated.",
@@ -94,6 +104,7 @@ ruleTester.run('attribute-hyphenation', rule, {
     {
       filename: 'test.vue',
       code: '<template><div><custom v-bind:MyProp="prop"></custom></div></template>',
+      output: '<template><div><custom v-bind:my-prop="prop"></custom></div></template>',
       options: ['always'],
       errors: [{
         message: "Attribute 'v-bind:MyProp' must be hyphenated.",