From c42b314482d497f4629a0e77f9db6b5551344c31 Mon Sep 17 00:00:00 2001
From: Seiei Miyagi <hanachin@gmail.com>
Date: Sat, 31 Oct 2015 00:11:23 +0900
Subject: [PATCH] Insert attribute selector right before Pseudo-classes

---
 lib/style-rewriter.js    | 6 +++++-
 test/expects/scoped.js   | 2 +-
 test/fixtures/scoped.vue | 1 +
 3 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/lib/style-rewriter.js b/lib/style-rewriter.js
index 92e7fbf..7188e6a 100644
--- 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
index 570985e..a53482c 100644
--- 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
index cc33644..7383bf0 100644
--- 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>