Fix: html-end-tags don't fail for self-closing elements (#221)

* Add test case * Fix html-end-tags for self closing elements * Add self closing example in html-end-tags doc
vuejs · Oct 27, 2017 · 43f248b · 43f248b
1 parent 0a8eb8e
commit 43f248b
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 1 deletion.
diff --git a/docs/rules/html-end-tags.md b/docs/rules/html-end-tags.md
@@ -36,6 +36,7 @@ This rule reports the following elements:
         <div></div>
         <p></p>
         <p></p>
+        <div />
         <input>
         <br>
     </div>

diff --git a/lib/rules/html-end-tags.js b/lib/rules/html-end-tags.js
@@ -27,6 +27,7 @@ function create (context) {
       const name = node.name
       const isVoid = utils.isHtmlVoidElementName(name)
       const hasEndTag = node.endTag != null
+      const isSelfClosing = node.startTag.selfClosing
 
       if (isVoid && hasEndTag) {
         context.report({
@@ -37,7 +38,7 @@ function create (context) {
           fix: (fixer) => fixer.remove(node.endTag)
         })
       }
-      if (!isVoid && !hasEndTag) {
+      if (!isVoid && !(hasEndTag || isSelfClosing)) {
         context.report({
           node: node.startTag,
           loc: node.startTag.loc,

diff --git a/tests/lib/rules/html-end-tags.js b/tests/lib/rules/html-end-tags.js
@@ -46,6 +46,10 @@ tester.run('html-end-tags', rule, {
     {
       filename: 'test.vue',
       code: '<template><div><img></div></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div /></div></template>'
     }
   ],
   invalid: [