From 3be6a04d54f14eae3fef693c81f1f90d0f95d108 Mon Sep 17 00:00:00 2001
From: Adam Wathan <adam.wathan@gmail.com>
Date: Tue, 6 Mar 2018 15:57:46 -0500
Subject: [PATCH] Add test to make sure we're not stupidly flattening styles
 too early

---
 __tests__/processPlugins.test.js | 53 ++++++++++++++++++++++++++++++++
 1 file changed, 53 insertions(+)

diff --git a/__tests__/processPlugins.test.js b/__tests__/processPlugins.test.js
index 0a22544a9..2ebd9419c 100644
--- a/__tests__/processPlugins.test.js
+++ b/__tests__/processPlugins.test.js
@@ -398,6 +398,59 @@ test('plugins can create components with media queries with object syntax', () =
   `)
 })
 
+test('media queries can be defined multiple times using objects-in-array syntax', () => {
+  const [components, utilities] = processPluginsWithValidConfig({
+    plugins: [
+      function({ addComponents }) {
+        addComponents([
+          {
+            '.container': {
+              width: '100%',
+            },
+            '@media (min-width: 100px)': {
+              '.container': {
+                maxWidth: '100px',
+              },
+            },
+          },
+          {
+            '.btn': {
+              padding: '1rem .5rem',
+              display: 'block',
+            },
+            '@media (min-width: 100px)': {
+              '.btn': {
+                display: 'inline-block',
+              },
+            },
+          },
+        ])
+      },
+    ],
+  })
+
+  expect(utilities.length).toBe(0)
+  expect(css(components)).toMatchCss(`
+    .container {
+      width: 100%
+    }
+    @media (min-width: 100px) {
+      .container {
+        max-width: 100px
+      }
+    }
+    .btn {
+      padding: 1rem .5rem;
+      display: block
+    }
+    @media (min-width: 100px) {
+      .btn {
+        display: inline-block
+      }
+    }
+  `)
+})
+
 test('plugins can create rules with escaped selectors', () => {
   const config = {
     plugins: [