Add CSS selector parser

Author: ota-meshi

lib/utils/selector.js

@@ -56,6 +56,7 @@
   "dependencies": {
     "eslint-utils": "^3.0.0",
     "natural-compare": "^1.4.0",
+    "nth-check": "^2.0.1",
     "postcss-selector-parser": "^6.0.9",
     "semver": "^7.3.5",
     "vue-eslint-parser": "^8.0.1"

package.json

@@ -0,0 +1,17 @@
+[
+    {
+        "text": "<a href=\"http://example.com\">",
+        "selector": "a[href*=\"example\"]",
+        "elementText": null
+    },
+    {
+        "text": "<a href=\"http://example.org\">",
+        "selector": "a[href*=\"example\"]",
+        "elementText": null
+    },
+    {
+        "text": "<a href=\"https://example.org\">",
+        "selector": "a[href*=\"example\"]",
+        "elementText": null
+    }
+]

tests/fixtures/utils/selector/attr-contains/result.json

@@ -0,0 +1,10 @@
+<!-- a[href*="example"] -->
+<template>
+  <ul>
+    <li><a href="#internal">Internal link</a></li>
+    <li><a href="http://example.com">Example link</a></li>
+    <li><a href="#InSensitive">Insensitive internal link</a></li>
+    <li><a href="http://example.org">Example org link</a></li>
+    <li><a href="https://example.org">Example https org link</a></li>
+  </ul>
+</template>

tests/fixtures/utils/selector/attr-contains/source.vue

@@ -0,0 +1,12 @@
+[
+    {
+        "text": "<p foo>",
+        "selector": "[foo=]",
+        "elementText": "<* foo=\"\">"
+    },
+    {
+        "text": "<div foo=\"\">",
+        "selector": "[foo=]",
+        "elementText": "<* foo=\"\">"
+    }
+]

tests/fixtures/utils/selector/attr-empty-value/result.json

@@ -0,0 +1,11 @@
+<!-- [foo=] -->
+<template>
+  <div foo="foo">
+    <div foo=bar></div>
+    <div foo="foo bar"></div>
+    <p foo></p>
+    <input bar="foo">
+    <input foo="foo">
+    <div foo=""></div>
+  </div>
+</template>

tests/fixtures/utils/selector/attr-empty-value/source.vue

@@ -0,0 +1,12 @@
+[
+    {
+        "text": "<div foo=\"foo\">",
+        "selector": "[foo=foo]",
+        "elementText": "<* foo=\"foo\">"
+    },
+    {
+        "text": "<input foo=\"foo\">",
+        "selector": "[foo=foo]",
+        "elementText": "<* foo=\"foo\">"
+    }
+]

tests/fixtures/utils/selector/attr-eq/result.json

@@ -0,0 +1,11 @@
+<!-- [foo=foo] -->
+<template>
+  <div foo="foo">
+    <div foo=bar></div>
+    <div foo="foo bar"></div>
+    <p foo></p>
+    <input bar="foo">
+    <input foo="foo">
+    <div foo=""></div>
+  </div>
+</template>

tests/fixtures/utils/selector/attr-eq/source.vue

@@ -0,0 +1,12 @@
+[
+    {
+        "text": "<div foo=\"foo\">",
+        "selector": "[foo]",
+        "elementText": "<* foo>"
+    },
+    {
+        "text": "<p foo>",
+        "selector": "[foo]",
+        "elementText": "<* foo>"
+    }
+]

tests/fixtures/utils/selector/attr-has/result.json

@@ -0,0 +1,8 @@
+<!-- [foo] -->
+<template>
+  <div foo="foo">
+    <div bar></div>
+    <p foo></p>
+    <input bar="foo">
+  </div>
+</template>