From 1a348c8c1c526bfc7c5b72b147dad2150c2a0eda Mon Sep 17 00:00:00 2001
From: Jakub Pawlowicz <contact@jakubpawlowicz.com>
Date: Sun, 12 Apr 2015 11:40:05 +0100
Subject: [PATCH] Fixes non-shorthand overriding.

So far it's limited to colors, transforms, and all longhands.
---
 lib/properties/override-compactor.js        | 26 +++++++++++-
 test/properties/override-compacting-test.js | 44 +++++++++++++++++++++
 2 files changed, 69 insertions(+), 1 deletion(-)

diff --git a/lib/properties/override-compactor.js b/lib/properties/override-compactor.js
index 311a3b8f..a7a682ca 100644
--- a/lib/properties/override-compactor.js
+++ b/lib/properties/override-compactor.js
@@ -144,6 +144,10 @@ function wouldResultInLongerValue(left, right) {
   return lengthBefore < lengthAfter;
 }
 
+function isCompactable(property) {
+  return property.name in compactable;
+}
+
 function compactOverrides(properties, compatibility, validator) {
   var mayOverride, right, left, component;
   var i, j, k;
@@ -151,11 +155,18 @@ function compactOverrides(properties, compatibility, validator) {
   propertyLoop:
   for (i = properties.length - 1; i >= 0; i--) {
     right = properties[i];
-    mayOverride = (compactable[right.name] && compactable[right.name].canOverride) || canOverride.sameValue;
+
+    if (!isCompactable(right))
+      continue;
+
+    mayOverride = compactable[right.name].canOverride || canOverride.sameValue;
 
     for (j = i - 1; j >= 0; j--) {
       left = properties[j];
 
+      if (!isCompactable(left))
+        continue;
+
       if (left.unused || right.unused)
         continue;
 
@@ -247,6 +258,19 @@ function compactOverrides(properties, compatibility, validator) {
         component = left.components.filter(nameMatchFilter(right))[0];
         override(component, right);
         right.dirty = true;
+      } else if (!left.shorthand && !right.shorthand && left.name == right.name) {
+        // two non-shorthands should be merged based on understandability
+
+        if (left.important && !right.important) {
+          right.unused = true;
+          continue;
+        }
+
+        mayOverride = compactable[right.name].canOverride || canOverride.sameValue;
+        if (!mayOverride(left, right, validator))
+          continue;
+
+        left.unused = true;
       }
     }
   }
diff --git a/test/properties/override-compacting-test.js b/test/properties/override-compacting-test.js
index 6c9f8bbd..78264c82 100644
--- a/test/properties/override-compacting-test.js
+++ b/test/properties/override-compacting-test.js
@@ -288,6 +288,50 @@ vows.describe(optimize)
       }
     }
   })
+  .addBatch({
+    'colors with same understandability': {
+      'topic': 'a{color:red;color:#fff;color:blue}',
+      'into': function (topic) {
+        assert.deepEqual(_optimize(topic), [
+          [['color', false , false], ['blue']]
+        ]);
+      }
+    },
+    'colors with different understandability': {
+      'topic': 'a{color:red;color:#fff;color:blue;color:rgba(1,2,3,.4)}',
+      'into': function (topic) {
+        assert.deepEqual(_optimize(topic), [
+          [['color', false , false], ['blue']],
+          [['color', false , false], ['rgba(1,2,3,.4)']]
+        ]);
+      }
+    },
+    'colors with different understandability overridden by high understandability': {
+      'topic': 'a{color:red;color:#fff;color:blue;color:rgba(1,2,3,.4);color:red}',
+      'into': function (topic) {
+        assert.deepEqual(_optimize(topic), [
+          [['color', false , false], ['red']]
+        ]);
+      }
+    },
+    'colors with different understandability and importance #1': {
+      'topic': 'a{color:#fff!important;color:rgba(1,2,3,.4)}',
+      'into': function (topic) {
+        assert.deepEqual(_optimize(topic), [
+          [['color', true , false], ['#fff']]
+        ]);
+      }
+    },
+    'colors with different understandability and importance #2': {
+      'topic': 'a{color:#fff;color:rgba(1,2,3,.4)!important}',
+      'into': function (topic) {
+        assert.deepEqual(_optimize(topic), [
+          [['color', false , false], ['#fff']],
+          [['color', true , false], ['rgba(1,2,3,.4)']]
+        ]);
+      }
+    }
+  })
   .addBatch({
     'shorthand then longhand multiplex': {
       'topic': 'p{background:top left;background-repeat:no-repeat,no-repeat}',
-- 
2.34.1