Merge pull request #21 from hanachin/insert-before-pseudo

Insert attribute selector right before Pseudo-classes
vuejs · Oct 30, 2015 · b6e4e25 · b6e4e25
2 parents 034e4e2 + c42b314
commit b6e4e25
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 2 deletions.
diff --git a/lib/style-rewriter.js b/lib/style-rewriter.js
@@ -9,7 +9,11 @@ var addId = postcss.plugin('add-id', function () {
     root.each(function (node) {
       node.selector = selectorParser(function (selectors) {
         selectors.each(function (selector) {
-          selector.append(selectorParser.attribute({
+          var node = null
+          selector.each(function (n) {
+            if (n.type !== 'pseudo') node = n
+          })
+          selector.insertAfter(node, selectorParser.attribute({
             attribute: currentId
           }))
         })

diff --git a/test/expects/scoped.js b/test/expects/scoped.js
@@ -1,2 +1,2 @@
-var __vueify_style__ = require("vueify-insert-css").insert("div[{{id}}]{color:red}.test[{{id}}]{color:green}")
+var __vueify_style__ = require("vueify-insert-css").insert("div[{{id}}]{color:red}.test[{{id}}]{color:green}.test[{{id}}]:after{content:'bye!'}")
 ;(typeof module.exports === "function"? module.exports.options: module.exports).template = "<div {{id}}=\"\">hi<p class=\"test\" {{id}}=\"\">bye</p></div>"
diff --git a/test/fixtures/scoped.vue b/test/fixtures/scoped.vue
@@ -1,6 +1,7 @@
 <style scoped>
   div { color: red; }
   .test { color: green; }
+  .test:after { content: 'bye!'; }
 </style>
 
 <template>