test: css nesting (#42)

alexander-akait · web-flow · commit e7baeb0e5336 · 2024-01-18T16:50:11.000+03:00
diff --git a/test/index.test.js b/test/index.test.js
@@ -62,6 +62,30 @@ describe("constants", () => {
       ":export {\n  blue: red;\n}\n.foo { color: red; }"
     ));
 
+  it("should replace constants within the file #1", () =>
+    test(
+      "@value blue: red; .foo { &.bar { color: blue; } }",
+      ":export {\n  blue: red;\n} .foo { &.bar { color: red; } }"
+    ));
+
+  it("should replace constants within the file #2", () =>
+    test(
+      "@value blue: red; .foo { @media (min-width: 1024px) { &.bar { color: blue; } } }",
+      ":export {\n  blue: red;\n} .foo { @media (min-width: 1024px) { &.bar { color: red; } } }"
+    ));
+
+  it("should replace constants within the file #3", () =>
+    test(
+      "@value blue: red; .foo { @media (min-width: 1024px) { &.bar { @media (min-width: 1024px) { color: blue; } } } }",
+      ":export {\n  blue: red;\n} .foo { @media (min-width: 1024px) { &.bar { @media (min-width: 1024px) { color: red; } } } }"
+    ));
+
+  it("should replace constants within the file #4", () =>
+    test(
+      "@value test-t: 40px;\n@value test_q: 36px; .foo { height: test-t; height: test_q; }",
+      ":export {\n  test-t: 40px;\n  test_q: 36px;\n}\n.foo { height: 40px; height: 36px; }"
+    ));
+
   it("should replace selectors within the file", () =>
     test(
       "@value colorValue: red; .colorValue { color: colorValue; }",
