From e5ed08b5cbdd902dcbb7b25d7c32ad9b474ea1a8 Mon Sep 17 00:00:00 2001
From: Jordan Pittman <jordan@cryptica.me>
Date: Fri, 15 Apr 2022 12:24:27 -0400
Subject: [PATCH] Handle duplicate atrules without children (#8122)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Handle duplicate atrules without children

We assumed that all At Rule nodes had children. Including ones that do not and should not — for example `@import url(…);`. Since this is not the case we’ll skip adding children for nodes that don’t have any.

* Update changelog

Co-authored-by: Jordi Marimon Palarea <jordimarimon7@gmail.com>
---
 CHANGELOG.md                          |  1 +
 src/lib/collapseAdjacentRules.js      |  6 +++++-
 tests/collapse-adjacent-rules.test.js | 20 +++++++++++++++++++-
 3 files changed, 25 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 1e94446bec2e..ccee8d847c17 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -12,6 +12,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Types: allow for arbitrary theme values (for 3rd party plugins) ([#7926](https://github.com/tailwindlabs/tailwindcss/pull/7926))
 - Don’t split vars with numbers in them inside arbitrary values ([#8091](https://github.com/tailwindlabs/tailwindcss/pull/8091))
 - Require matching prefix when detecting negatives ([#8121](https://github.com/tailwindlabs/tailwindcss/pull/8121))
+- Handle duplicate At Rules without children ([#8122](https://github.com/tailwindlabs/tailwindcss/pull/8122))
 
 ### Added
 
diff --git a/src/lib/collapseAdjacentRules.js b/src/lib/collapseAdjacentRules.js
index 16ebb0d1abae..119f59226f4d 100644
--- a/src/lib/collapseAdjacentRules.js
+++ b/src/lib/collapseAdjacentRules.js
@@ -29,7 +29,11 @@ export default function collapseAdjacentRules() {
             (currentRule[property] ?? '').replace(/\s+/g, ' ')
         )
       ) {
-        currentRule.append(node.nodes)
+        // An AtRule may not have children (for example if we encounter duplicate @import url(…) rules)
+        if (node.nodes) {
+          currentRule.append(node.nodes)
+        }
+
         node.remove()
       } else {
         currentRule = node
diff --git a/tests/collapse-adjacent-rules.test.js b/tests/collapse-adjacent-rules.test.js
index a13e1fc665fa..d69c9ebbd6dd 100644
--- a/tests/collapse-adjacent-rules.test.js
+++ b/tests/collapse-adjacent-rules.test.js
@@ -1,7 +1,7 @@
 import fs from 'fs'
 import path from 'path'
 
-import { run, css } from './util/run'
+import { run, html, css } from './util/run'
 
 test('collapse adjacent rules', () => {
   let config = {
@@ -61,3 +61,21 @@ test('collapse adjacent rules', () => {
     expect(result.css).toMatchFormattedCss(expected)
   })
 })
+
+test('duplicate url imports does not break rule collapsing', () => {
+  let config = {
+    content: [{ raw: html`` }],
+    corePlugins: { preflight: false },
+  }
+
+  let input = css`
+    @import url('https://example.com');
+    @import url('https://example.com');
+  `
+
+  return run(input, config).then((result) => {
+    expect(result.css).toMatchFormattedCss(css`
+      @import url('https://example.com');
+    `)
+  })
+})