From 7e1691cd62df0593882480d00eb7e9a7616bb029 Mon Sep 17 00:00:00 2001
From: kindoflew <lewis@ombulabs.com>
Date: Mon, 4 Jul 2022 10:55:34 -0400
Subject: [PATCH] [fix] support @layer (#7514)

* add test

* add layer to apply check
---
 src/compiler/compile/css/Stylesheet.ts |  2 +-
 test/css/samples/at-layer/expected.css |  1 +
 test/css/samples/at-layer/input.svelte | 17 +++++++++++++++++
 3 files changed, 19 insertions(+), 1 deletion(-)
 create mode 100644 test/css/samples/at-layer/expected.css
 create mode 100644 test/css/samples/at-layer/input.svelte

diff --git a/src/compiler/compile/css/Stylesheet.ts b/src/compiler/compile/css/Stylesheet.ts
index 0a3098db6d63..1a9ea7feeb51 100644
--- a/src/compiler/compile/css/Stylesheet.ts
+++ b/src/compiler/compile/css/Stylesheet.ts
@@ -170,7 +170,7 @@ class Atrule {
 	}
 
 	apply(node: Element) {
-		if (this.node.name === 'media' || this.node.name === 'supports') {
+		if (this.node.name === 'media' || this.node.name === 'supports' || this.node.name === 'layer') {
 			this.children.forEach(child => {
 				child.apply(node);
 			});
diff --git a/test/css/samples/at-layer/expected.css b/test/css/samples/at-layer/expected.css
new file mode 100644
index 000000000000..e5f3de80c951
--- /dev/null
+++ b/test/css/samples/at-layer/expected.css
@@ -0,0 +1 @@
+@layer base, special;@layer special{div.svelte-xyz{color:rebeccapurple}}@layer base{div.svelte-xyz{color:green}}
\ No newline at end of file
diff --git a/test/css/samples/at-layer/input.svelte b/test/css/samples/at-layer/input.svelte
new file mode 100644
index 000000000000..60289e1e5f9e
--- /dev/null
+++ b/test/css/samples/at-layer/input.svelte
@@ -0,0 +1,17 @@
+<div>hello</div>
+
+<style>
+	@layer base, special;
+
+	@layer special {
+		div {
+			color: rebeccapurple;
+		}
+	}
+
+	@layer base {
+		div {
+			color: green;
+		}
+	}
+</style>