From 0508a649a9a39d77f34d55ddf3ca1c04b0487a0b Mon Sep 17 00:00:00 2001
From: Jakub Pawlowicz <contact@jakubpawlowicz.com>
Date: Tue, 16 Sep 2014 08:07:26 +0100
Subject: [PATCH] Fixes #358 - property merging in compatibility mode.

* More understandable properties can't be merged into less understandable shorthands.
* E.g: div{background:linear-gradient(...) #000;background-color:red;}
---
 History.md                           |  1 +
 lib/properties/optimizer.js          |  2 +-
 lib/properties/override-compactor.js | 25 ++++++++++++++++++++++---
 test/unit-test.js                    |  7 +++++++
 4 files changed, 31 insertions(+), 4 deletions(-)

diff --git a/History.md b/History.md
index ea4a762a..62941acf 100644
--- a/History.md
+++ b/History.md
@@ -8,6 +8,7 @@
 ==================
 
 * Fixed issue [#359](https://github.com/GoalSmashers/clean-css/issues/359) - handling escaped double backslash.
+* Fixed issue [#358](https://github.com/GoalSmashers/clean-css/issues/358) - property merging in compatibility mode.
 * Fixed issue [#356](https://github.com/GoalSmashers/clean-css/issues/356) - preserving *+html hack.
 * Fixed issue [#354](https://github.com/GoalSmashers/clean-css/issues/354) - !important overriding in shorthands.
 
diff --git a/lib/properties/optimizer.js b/lib/properties/optimizer.js
index b68f940c..ad380de2 100644
--- a/lib/properties/optimizer.js
+++ b/lib/properties/optimizer.js
@@ -256,7 +256,7 @@ module.exports = function Optimizer(compatibility, aggressiveMerging, context) {
 
     var tokens = Token.tokenize(input);
 
-    tokens = overrideCompactor.compactOverrides(tokens, processable, Token);
+    tokens = overrideCompactor.compactOverrides(tokens, processable, Token, compatibility);
     tokens = shorthandCompactor.compactShorthands(tokens, false, processable, Token);
     tokens = shorthandCompactor.compactShorthands(tokens, true, processable, Token);
 
diff --git a/lib/properties/override-compactor.js b/lib/properties/override-compactor.js
index 8b65f6ec..3fca0c40 100644
--- a/lib/properties/override-compactor.js
+++ b/lib/properties/override-compactor.js
@@ -9,8 +9,8 @@ module.exports = (function () {
     return val1 === val2;
   };
 
-  var compactOverrides = function (tokens, processable, Token) {
-    var result, can, token, t, i, ii, oldResult, matchingComponent;
+  var compactOverrides = function (tokens, processable, Token, compatibility) {
+    var result, can, token, t, i, ii, iiii, oldResult, matchingComponent;
 
     // Used when searching for a component that matches token
     var nameMatchFilter1 = function (x) {
@@ -90,6 +90,25 @@ module.exports = (function () {
           if (can(matchingComponent.value, token.value)) {
             // The component can override the matching component in the shorthand
 
+            if (compatibility) {
+              // in compatibility mode check if shorthand in not less understandable than merged-in value
+              var wouldBreakCompatibility = false;
+              for (iiii = 0; iiii < t.components.length; iiii++) {
+                var o = processable[t.components[iiii].prop];
+                can = (o && o.canOverride) || sameValue;
+
+                if (!can(o.defaultValue, t.components[iiii].value)) {
+                  wouldBreakCompatibility = true;
+                  break;
+                }
+              }
+
+              if (wouldBreakCompatibility) {
+                result.push(t);
+                continue;
+              }
+            }
+
             if ((!token.isImportant || token.isImportant && matchingComponent.isImportant) && willResultInShorterValue(t, token)) {
               // The overriding component is non-important which means we can simply include it into the shorthand
               // NOTE: stuff that can't really be included, like inherit, is taken care of at the final step, not here
@@ -108,7 +127,7 @@ module.exports = (function () {
           // token is a shorthand and is trying to override another instance of the same shorthand
 
           // Can only override other shorthand when each of its components can override each of the other's components
-          for (var iiii = 0; iiii < t.components.length; iiii++) {
+          for (iiii = 0; iiii < t.components.length; iiii++) {
             can = (processable[t.components[iiii].prop] && processable[t.components[iiii].prop].canOverride) || sameValue;
             if (!can(t.components[iiii].value, token.components[iiii].value)) {
               result.push(t);
diff --git a/test/unit-test.js b/test/unit-test.js
index c4b44c1d..32a50794 100644
--- a/test/unit-test.js
+++ b/test/unit-test.js
@@ -2183,6 +2183,13 @@ title']{display:block}",
       'a{background:red}'
     ]
   }),
+  'advanced in ie8 mode': cssContext({
+    'plain component to complex shorthand': 'a{background:linear-gradient(to bottom,#000,#fff 4em) #000;background-color:#fff}',
+    'plain component to shorthand': [
+      'a{background:url(bg.png) #000;background-color:#fff}',
+      'a{background:url(bg.png) #fff}'
+    ]
+  }, { compatibility: 'ie8' }),
   'viewport units': cssContext({
     'shorthand margin with viewport width not changed': 'div{margin:5vw}'
   }),
-- 
2.34.1