Add rule `attribute-hyphenation`. #95

armano2 · 2017-07-18T23:25:27Z

This PR implements rules proposed in #92

TODO:

This PR contains changes proposed in #120 and should be merged after it.

armano2 · 2017-07-20T16:19:08Z

Based on #92 (comment) we are missing some cases

armano2 · 2017-07-23T01:22:31Z

@michalsnik rule is done

mysticatea · 2017-08-01T11:46:51Z

docs/rules/html-attributes-casing.md

@@ -0,0 +1,35 @@
+# Define a style for the attributes casing in templates. (html-attributes-casing)


Thank you for the contributing! I'm sorry for the delay.

I'm not sure whether this rule makes sense. Below is the result of my investigation.

In all known HTML/SVG/MathML elements, all of attrname, attrName and AttrName are the same attribute but attr-name is another.

In custom components,

about defined properties,

for example attr-name property, people can choose attrName or attr-name but attrname and AttrName do not work.

for example attrName property, people can choose attrName or attr-name but attrname and AttrName do not work.

for example AttrName property, people can choose AttrName or attr-name but attrname and attrName do not work.

about undefined properties, the same behaivor to known HTML/SVG/MathML elements.

So I think the options camelCase and PascalCase are not useful because it might be uncontrollable due to the definition of libraries. So maybe.... What do you think below?

Change rule name to attribute-hyphenation

Options are: "always" (default) or "never".

"always" ... Use hyphenated name. (It errors on upper case letters.)

"never" ... Don't use hyphenated name. (It errors on hyphens except data- and aria-.)

(I think this rule don't need html- prefix because this rule can work on AST. I think that rules which use details of tokens should have html- prefix.)

I like it:

change name of rule to attribute-hyphenation

apply rule only on components isCustomComponent

change options to always (default) or never

add aria- to exceptions

@mysticatea there is bug: vuejs/vue-eslint-parser#12 with parsing argument for VDirectiveKey

mysticatea · 2017-08-01T11:53:48Z

lib/rules/html-attributes-casing.js

+  // ----------------------------------------------------------------------
+
+  utils.registerTemplateBodyVisitor(context, {
+    'VStartTag' (obj) {


I think that you can use VAttribute handler to avoid extra looping.

mysticatea · 2017-08-01T11:54:50Z

lib/rules/html-attributes-casing.js

+
+  utils.registerTemplateBodyVisitor(context, {
+    'VStartTag' (obj) {
+      if (!utils.isSvgElementName(obj.id.name) && !utils.isMathMLElementName(obj.id.name)) {


This rule should check only custom components.

mysticatea · 2017-08-01T12:06:50Z

lib/utils/mathml-elements.json

@@ -0,0 +1,206 @@
+[


We can use node.namespace to check SVG/MathML now.

@mysticatea 👍

afontcu · 2017-08-01T17:07:58Z

docs/rules/attribute-hyphenation.md

+
+## :wrench: Options
+
+Default casing is set to `allways`


@afontcu fixed

afontcu · 2017-08-01T17:08:30Z

docs/rules/attribute-hyphenation.md

+```html
+<template>
+  <foo my-prop="prop">
+    <a onClick="retrun false"></a>


return (same below 😇 )

@afontcu fixed

fixes vuejs#92

mysticatea

LGTM, thank you!

* master: Add rule `vue/require-valid-default-prop`. (vuejs#119) 3.10.0 Update readme to 3.10.0 Chore: remove package-lock.json (vuejs#128) Fix: parserService must exist always (fixes vuejs#125) (vuejs#127) Add rule `require-render-return`. (vuejs#114) 3.9.0 Update package-lock Update: options for `no-duplicate-attributes` (fixes vuejs#112)(vuejs#113) New: add rule `attribute-hyphenation`. (fixes vuejs#92)(vuejs#95) Add namespace check of svg & mathML instead of tag names (vuejs#120) ⚠️ Add support for deprecated state in update-rules ⚠️ (vuejs#121) Add rules: `no-dupe-keys` and `no-reserved-keys`. (vuejs#88) Chore: Improve tests for name-property-casing & improve documentation (vuejs#115) New: add `require-prop-types` rule (fixes vuejs#19)(vuejs#85) Update: upgrade vue-eslint-parser (fixes vuejs#36, fixes vuejs#56, fixes vuejs#96) (vuejs#116)

mysticatea added Ready for review semver-minor labels Jul 19, 2017

armano2 changed the title ~~Add rule html-attributes-casing.~~ WIP: Add rule html-attributes-casing. Jul 20, 2017

michalsnik added work in progress and removed Ready for review labels Jul 21, 2017

armano2 force-pushed the patch-15-html-attributes-casing branch 2 times, most recently from c248c96 to a4be85d Compare July 23, 2017 01:11

armano2 changed the title ~~WIP: Add rule html-attributes-casing.~~ Add rule html-attributes-casing. Jul 23, 2017

armano2 force-pushed the patch-15-html-attributes-casing branch from 6178486 to 24305db Compare July 23, 2017 03:35

michalsnik added Ready for review and removed work in progress labels Jul 23, 2017

michalsnik requested a review from mysticatea July 23, 2017 13:41

armano2 force-pushed the patch-15-html-attributes-casing branch from 24305db to 50dce57 Compare July 24, 2017 23:18

mysticatea reviewed Aug 1, 2017

View reviewed changes

armano2 mentioned this pull request Aug 1, 2017

VDirectiveKey: parsing arguments changes argument into lowercase letters. vuejs/vue-eslint-parser#12

Closed

afontcu reviewed Aug 1, 2017

View reviewed changes

armano2 force-pushed the patch-15-html-attributes-casing branch from 54cd80e to 8d8e3d7 Compare August 1, 2017 17:12

armano2 changed the title ~~Add rule html-attributes-casing.~~ Add rule attribute-hyphenation. Aug 1, 2017

armano2 added 2 commits August 3, 2017 00:55

Update vue-eslint-parser to version 2.0.0-beta.3

7a056dc

Add rule html-attributes-casing.

a6342f4

fixes vuejs#92

armano2 force-pushed the patch-15-html-attributes-casing branch from 790099f to a6342f4 Compare August 2, 2017 22:56

mysticatea approved these changes Aug 3, 2017

View reviewed changes

mysticatea merged commit 55d388c into vuejs:master Aug 3, 2017

armano2 deleted the patch-15-html-attributes-casing branch August 3, 2017 22:02

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add rule `attribute-hyphenation`. #95

Add rule `attribute-hyphenation`. #95

armano2 commented Jul 18, 2017 •

edited

Loading

armano2 commented Jul 20, 2017

armano2 commented Jul 23, 2017

mysticatea Aug 1, 2017 •

edited

Loading

armano2 Aug 1, 2017

armano2 Aug 1, 2017

mysticatea Aug 1, 2017

mysticatea Aug 1, 2017

mysticatea Aug 1, 2017

armano2 Aug 1, 2017

afontcu Aug 1, 2017

armano2 Aug 1, 2017

afontcu Aug 1, 2017 •

edited

Loading

armano2 Aug 1, 2017

mysticatea left a comment

		@@ -0,0 +1,35 @@
		# Define a style for the attributes casing in templates. (html-attributes-casing)

Add rule attribute-hyphenation. #95

Add rule attribute-hyphenation. #95

Conversation

armano2 commented Jul 18, 2017 • edited Loading

armano2 commented Jul 20, 2017

armano2 commented Jul 23, 2017

mysticatea Aug 1, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

afontcu Aug 1, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

mysticatea left a comment

Choose a reason for hiding this comment

Add rule `attribute-hyphenation`. #95

Add rule `attribute-hyphenation`. #95

armano2 commented Jul 18, 2017 •

edited

Loading

mysticatea Aug 1, 2017 •

edited

Loading

afontcu Aug 1, 2017 •

edited

Loading