diff --git a/test/runtime/__snapshots__/api.test.js.snap b/test/runtime/__snapshots__/api.test.js.snap
index a978bc028..ce4111372 100644
--- a/test/runtime/__snapshots__/api.test.js.snap
+++ b/test/runtime/__snapshots__/api.test.js.snap
@@ -20,7 +20,11 @@ exports[`api should toString with a source map without "sourceRoot" 1`] = `
 
 exports[`api should toString with a source map without map 1`] = `"@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');"`;
 
-exports[`api should toString with media query 1`] = `"body { b: 2; }body { c: 3; }body { b: 2; }@media print {body { b: 2; }}@media print {body { d: 4; }}@media screen {body { a: 1; }}"`;
+exports[`api should toString with layer 1`] = `"body { b: 2; }body { c: 3; }body { b: 2; }@media print {body { b: 2; }}@media print {body { d: 4; }}@layer(default) {body { a: 1; }}"`;
+
+exports[`api should toString with media query list 1`] = `"body { b: 2; }body { c: 3; }body { b: 2; }@media print {body { b: 2; }}@media print {body { d: 4; }}@media screen {body { a: 1; }}"`;
+
+exports[`api should toString with media query list, layer and supports 1`] = `"body { b: 2; }body { c: 3; }body { b: 2; }@media print {body { b: 2; }}@media print {body { d: 4; }}@layer(default) {@supports (display: grid) {@media screen {body { a: 1; }}}}"`;
 
 exports[`api should toString with source mapping 1`] = `
 "@[object Object] {body { a: 1; }
@@ -28,4 +32,6 @@ exports[`api should toString with source mapping 1`] = `
 /*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJmaWxlIjoidGVzdC5zY3NzIiwic291cmNlcyI6WyIuL3BhdGgvdG8vdGVzdC5zY3NzIl0sIm1hcHBpbmdzIjoiQUFBQTsiLCJzb3VyY2VSb290Ijoid2VicGFjazovLyJ9 */}"
 `;
 
+exports[`api should toString with supports 1`] = `"body { b: 2; }body { c: 3; }body { b: 2; }@media print {body { b: 2; }}@media print {body { d: 4; }}@supports (display: grid) {body { a: 1; }}"`;
+
 exports[`api should toString without source mapping if btoa not available 1`] = `"@[object Object] {body { a: 1; }}"`;
diff --git a/test/runtime/api.test.js b/test/runtime/api.test.js
index 337ddeec0..1cc538c00 100644
--- a/test/runtime/api.test.js
+++ b/test/runtime/api.test.js
@@ -43,7 +43,7 @@ describe("api", () => {
     expect(m.toString()).toMatchSnapshot();
   });
 
-  it("should toString with media query", () => {
+  it("should toString with media query list", () => {
     const m = api((i) => i[1]);
 
     const m1 = [1, "body { a: 1; }", "screen"];
@@ -59,6 +59,60 @@ describe("api", () => {
     expect(m.toString()).toMatchSnapshot();
   });
 
+  it("should toString with layer", () => {
+    const m = api((i) => i[1]);
+
+    const m1 = [1, "body { a: 1; }", "", "", "layer(default)"];
+    const m2 = [2, "body { b: 2; }", ""];
+    const m3 = [3, "body { c: 3; }", ""];
+    const m4 = [4, "body { d: 4; }", ""];
+
+    m.i([m2, m3], "");
+    m.i([m2], "");
+    m.i([m2, m4], "print");
+    m.push(m1);
+
+    expect(m.toString()).toMatchSnapshot();
+  });
+
+  it("should toString with supports", () => {
+    const m = api((i) => i[1]);
+
+    const m1 = [1, "body { a: 1; }", "", "supports (display: grid)"];
+    const m2 = [2, "body { b: 2; }", ""];
+    const m3 = [3, "body { c: 3; }", ""];
+    const m4 = [4, "body { d: 4; }", ""];
+
+    m.i([m2, m3], "");
+    m.i([m2], "");
+    m.i([m2, m4], "print");
+    m.push(m1);
+
+    expect(m.toString()).toMatchSnapshot();
+  });
+
+  it("should toString with media query list, layer and supports", () => {
+    const m = api((i) => i[1]);
+
+    const m1 = [
+      1,
+      "body { a: 1; }",
+      "screen",
+      "supports (display: grid)",
+      "layer(default)",
+    ];
+    const m2 = [2, "body { b: 2; }", ""];
+    const m3 = [3, "body { c: 3; }", ""];
+    const m4 = [4, "body { d: 4; }", ""];
+
+    m.i([m2, m3], "");
+    m.i([m2], "");
+    m.i([m2, m4], "print");
+    m.push(m1);
+
+    expect(m.toString()).toMatchSnapshot();
+  });
+
   it("should import modules", () => {
     const m = api((i) => i[1]);
     const m1 = [1, "body { a: 1; }", "(orientation:landscape)"];