Merge pull request MadLittleMods#43 from muftiev/master

Fixed preserve option inside at-rules

Author: MadLittleMods

lib/resolve-decl.js

@@ -94,12 +94,15 @@ function resolveDecl(decl, map, /*optional*/shouldPreserve, /*optional*/logResol
 	eachMapItemDependencyOfDecl(valueResults.variablesUsed, map, decl, function(mimicDecl, mapItem) {
 		var ruleClone = shallowCloneNode(decl.parent);
 		var declClone = decl.clone();
-		// No mangle resolve
-		declClone.value = _logResolveValueResult(resolveValue(mimicDecl, map, true)).value;
-
 		// Add the declaration to our new rule
 		ruleClone.append(declClone);
 
+		if(shouldPreserve === true) {
+			declClone.cloneAfter();
+		}
+
+		// No mangle resolve
+		declClone.value = _logResolveValueResult(resolveValue(mimicDecl, map, true)).value;
 
 		if(mapItem.isUnderAtRule) {
 			// Create the clean atRule for which we place the declaration under

test/fixtures/preserve-variables-in-media.css

@@ -0,0 +1,13 @@
+:root {
+    --width: 100px;
+}
+
+@media (max-width: 1000px) {
+    :root {
+        --width: 200px;
+    }
+}
+
+.box {
+    width: var(--width);
+}

test/fixtures/preserve-variables-in-media.expected.css

@@ -0,0 +1,22 @@
+:root {
+    --width: 100px;
+}
+
+@media (max-width: 1000px) {
+    :root {
+        --width: 200px;
+    }
+}
+
+.box {
+    width: 100px;
+    width: var(--width);
+}
+
+@media (max-width: 1000px) {
+
+    .box {
+        width: 200px;
+        width: var(--width);
+    }
+}

test/test.js

@@ -169,6 +169,12 @@ describe('postcss-css-variables', function() {
 			{ preserve: true }
 		);
 
+		test(
+			'preserves variables in @media when `preserve` is `true`',
+			'preserve-variables-in-media',
+			{ preserve: true }
+		);
+
 		test(
 			'preserves computed value when `preserve` is `\'computed\'`',
 			'preserve-computed',