From 763ee71033fdd3cb687044e555a67d840732db6b Mon Sep 17 00:00:00 2001
From: Adam Wathan <adam.wathan@gmail.com>
Date: Tue, 6 Aug 2019 08:14:16 -0400
Subject: [PATCH] Ensure all selectors in a rule receive important scope

---
 __tests__/processPlugins.test.js | 30 +++++++++++++++++++++++++++---
 src/util/processPlugins.js       |  4 +++-
 2 files changed, 30 insertions(+), 4 deletions(-)

diff --git a/__tests__/processPlugins.test.js b/__tests__/processPlugins.test.js
index ff0a172ef..58e8b85e0 100644
--- a/__tests__/processPlugins.test.js
+++ b/__tests__/processPlugins.test.js
@@ -877,7 +877,7 @@ test('plugins respect prefix and important options by default when adding utilit
     `)
 })
 
-test('plugins respect prefix and important (selector) options by default when adding utilities', () => {
+test('when important is a selector it is used to scope utilities instead of adding !important', () => {
   const { utilities } = processPlugins(
     [
       function({ addUtilities }) {
@@ -889,14 +889,38 @@ test('plugins respect prefix and important (selector) options by default when ad
       },
     ],
     makeConfig({
-      prefix: 'tw-',
       important: '#app',
     })
   )
 
   expect(css(utilities)).toMatchCss(`
     @variants {
-      #app .tw-rotate-90 {
+      #app .rotate-90 {
+        transform: rotate(90deg)
+      }
+    }
+    `)
+})
+
+test('when important is a selector it scopes all selectors in a rule, even though defining utilities like this is stupid', () => {
+  const { utilities } = processPlugins(
+    [
+      function({ addUtilities }) {
+        addUtilities({
+          '.rotate-90, .rotate-1\\/4': {
+            transform: 'rotate(90deg)',
+          },
+        })
+      },
+    ],
+    makeConfig({
+      important: '#app',
+    })
+  )
+
+  expect(css(utilities)).toMatchCss(`
+    @variants {
+      #app .rotate-90, #app .rotate-1\\/4 {
         transform: rotate(90deg)
       }
     }
diff --git a/src/util/processPlugins.js b/src/util/processPlugins.js
index 1450db5dc..c59af2918 100644
--- a/src/util/processPlugins.js
+++ b/src/util/processPlugins.js
@@ -59,7 +59,9 @@ export default function(plugins, config) {
             if (config.important === true) {
               rule.walkDecls(decl => (decl.important = true))
             } else if (typeof config.important === 'string') {
-              rule.selector = increaseSpecificity(config.important, rule.selector)
+              rule.selectors = rule.selectors.map(selector => {
+                return increaseSpecificity(config.important, selector)
+              })
             }
           }
         })