Fixes #577 - disables `background-clip` merging into shorthand.

It seems to be only compatible with IE10+ so we'll keep it disabled
for now.

diff --git a/History.md b/History.md
index 04421f8..413b0de 100644 (file)
--- a/History.md
+++ b/History.md
@@ -16,6 +16,7 @@
 * Fixed issue [#570](https://github.com/jakubpawlowicz/clean-css/issues/570) - rebasing "no-url()" imports.
 * Fixed issue [#574](https://github.com/jakubpawlowicz/clean-css/issues/574) - rewriting internal URLs.
 * Fixed issue [#575](https://github.com/jakubpawlowicz/clean-css/issues/575) - missing directory as a `target`.
+* Fixed issue [#577](https://github.com/jakubpawlowicz/clean-css/issues/577) - `background-clip` into shorthand.
 
 [3.2.10 / 2015-05-14](https://github.com/jakubpawlowicz/clean-css/compare/v3.2.9...v3.2.10)
 ==================

diff --git a/README.md b/README.md
index 910233b..721a59f 100644 (file)
--- a/README.md
+++ b/README.md
@@ -145,8 +145,8 @@ The output of `minify` method (or the 2nd argument to passed callback) is a hash
   * `originalSize` - original content size (after import inlining)
   * `minifiedSize` - optimized content size
   * `timeSpent` - time spent on optimizations
-  * `efficiency` - a ratio of output size to input size (e.g. 25% if content was reduced from 100 bytes to 75 bytes)  
-  
+  * `efficiency` - a ratio of output size to input size (e.g. 25% if content was reduced from 100 bytes to 75 bytes)
+
 #### How to make sure remote `@import`s are processed correctly?
 
 In order to inline remote `@import` statements you need to provide a callback to minify method, e.g.:
@@ -306,6 +306,7 @@ with the following options available:
 
 * `'[+-]colors.opacity'` - - turn on (+) / off (-) `rgba()` / `hsla()` declarations removal
 * `'[+-]properties.backgroundSizeMerging'` - turn on / off background-size merging into shorthand
+* `'[+-]properties.backgroundClipMerging'` - turn on / off background-clip merging into shorthand
 * `'[+-]properties.colors'` - turn on / off any color optimizations
 * `'[+-]properties.iePrefixHack'` - turn on / off IE prefix hack removal
 * `'[+-]properties.ieSuffixHack'` - turn on / off IE suffix hack removal

diff --git a/lib/properties/override-compactor.js b/lib/properties/override-compactor.js
index 5811dd3..8357969 100644 (file)
--- a/lib/properties/override-compactor.js
+++ b/lib/properties/override-compactor.js
@@ -269,10 +269,12 @@ function compactOverrides(properties, compatibility, validator) {
 
         component = left.components.filter(nameMatchFilter(right))[0];
         if (everyCombination(mayOverride, component, right, validator)) {
-          var disabledBackgroundSizeMerging = !compatibility.properties.backgroundSizeMerging && component.name.indexOf('background-size') > -1;
+          var disabledBackgroundMerging =
+            !compatibility.properties.backgroundClipMerging && component.name.indexOf('background-clip') > -1 ||
+            !compatibility.properties.backgroundSizeMerging && component.name.indexOf('background-size') > -1;
           var nonMergeableValue = compactable[right.name].nonMergeableValue === right.value[0][0];
 
-          if (disabledBackgroundSizeMerging || nonMergeableValue)
+          if (disabledBackgroundMerging || nonMergeableValue)
             continue;
 
           if (!compatibility.properties.merging && wouldBreakCompatibility(left, validator))

diff --git a/lib/utils/compatibility.js b/lib/utils/compatibility.js
index c39778b..331c721 100644 (file)
--- a/lib/utils/compatibility.js
+++ b/lib/utils/compatibility.js
@@ -7,6 +7,7 @@ var DEFAULTS = {
     },
     properties: {
       backgroundSizeMerging: false, // background-size to shorthand
+      backgroundClipMerging: false, // background-clip to shorthand
       colors: true, // any kind of color transformations, like `#ff00ff` to `#f0f` or `#fff` into `red`
       iePrefixHack: false, // underscore / asterisk prefix hacks on IE
       ieSuffixHack: false, // \9 suffix hacks on IE
@@ -36,6 +37,7 @@ var DEFAULTS = {
     },
     properties: {
       backgroundSizeMerging: false,
+      backgroundClipMerging: false,
       colors: true,
       iePrefixHack: true,
       ieSuffixHack: true,
@@ -65,6 +67,7 @@ var DEFAULTS = {
     },
     properties: {
       backgroundSizeMerging: false,
+      backgroundClipMerging: false,
       colors: true,
       iePrefixHack: true,
       ieSuffixHack: true,

diff --git a/test/integration-test.js b/test/integration-test.js
index 2c0f68c..33032d5 100644 (file)
--- a/test/integration-test.js
+++ b/test/integration-test.js
@@ -2104,10 +2104,6 @@ title']{display:block}",
     'inside background shorthand': [
       'div{background:content-box #000}',
       'div{background:content-box #000}'
-    ],
-    'into background shorthand': [
-      'div{background:#000;background-clip:content-box}',
-      'div{background:padding-box content-box #000}'
     ]
   }),
   'background-origin': cssContext({
@@ -2120,20 +2116,6 @@ title']{display:block}",
       'div{background:content-box border-box #000}'
     ]
   }),
-  'background-clip & background-origin': cssContext({
-    'into background shorthand with background clip': [
-      'div{background:#000;background-origin:content-box;background-clip:padding-box}',
-      'div{background:content-box padding-box #000}'
-    ],
-    'into background shorthand merged with background clip': [
-      'div{background:border-box #000;background-clip:padding-box}',
-      'div{background:border-box padding-box #000}'
-    ],
-    'with defaults': [
-      'div{background:#000;background-origin:padding-box;background-clip:border-box}',
-      'div{background:#000}'
-    ]
-  }),
   'background size with +properties.backgroundSizeMerging': cssContext({
     'with background-size property': [
       'a{background:none;background-image:url(1.png);background-size:28px 28px}',

diff --git a/test/properties/override-compacting-test.js b/test/properties/override-compacting-test.js
index 7159db2..1117ad4 100644 (file)
--- a/test/properties/override-compacting-test.js
+++ b/test/properties/override-compacting-test.js
@@ -91,10 +91,27 @@ vows.describe(optimize)
         ]);
       }
     },
+    'shorthand then longhand - disabled background clip merging': {
+      'topic': 'p{background:__ESCAPED_URL_CLEAN_CSS0__;background-clip:padding-box}',
+      'into': function (topic) {
+        assert.deepEqual(_optimize(topic, { properties: { backgroundClipMerging: false } }), [
+          [['background', false , false], ['__ESCAPED_URL_CLEAN_CSS0__']],
+          [['background-clip', false , false], ['padding-box']]
+        ]);
+      }
+    },
+    'shorthand then longhand - enabled background clip merging': {
+      'topic': 'p{background:__ESCAPED_URL_CLEAN_CSS0__;background-clip:padding-box}',
+      'into': function (topic) {
+        assert.deepEqual(_optimize(topic, { properties: { backgroundClipMerging: true } }), [
+          [['background', false , false], ['__ESCAPED_URL_CLEAN_CSS0__'], ['padding-box']]
+        ]);
+      }
+    },
     'shorthand then longhand - non mergeable value': {
       'topic': 'p{background:__ESCAPED_URL_CLEAN_CSS0__;background-color:none}',
       'into': function (topic) {
-        assert.deepEqual(_optimize(topic, { properties: { backgroundSizeMerging: false } }), [
+        assert.deepEqual(_optimize(topic), [
           [['background', false , false], ['__ESCAPED_URL_CLEAN_CSS0__']],
           [['background-color', false , false], ['none']]
         ]);

diff --git a/test/utils/compatibility-test.js b/test/utils/compatibility-test.js
index a4b7f9d..46cb894 100644 (file)
--- a/test/utils/compatibility-test.js
+++ b/test/utils/compatibility-test.js
@@ -12,6 +12,7 @@ vows.describe(Compatibility)
         assert.isTrue(options.colors.opacity);
         assert.isTrue(options.properties.colors);
         assert.isFalse(options.properties.backgroundSizeMerging);
+        assert.isFalse(options.properties.backgroundClipMerging);
         assert.isFalse(options.properties.iePrefixHack);
         assert.isFalse(options.properties.ieSuffixHack);
         assert.isTrue(options.properties.merging);
@@ -45,6 +46,7 @@ vows.describe(Compatibility)
       'gets merged options': function(options) {
         assert.isTrue(options.colors.opacity);
         assert.isFalse(options.properties.backgroundSizeMerging);
+        assert.isFalse(options.properties.backgroundClipMerging);
         assert.isTrue(options.properties.colors);
         assert.isFalse(options.properties.iePrefixHack);
         assert.isFalse(options.properties.ieSuffixHack);
@@ -72,6 +74,7 @@ vows.describe(Compatibility)
       'gets template options': function(options) {
         assert.isFalse(options.colors.opacity);
         assert.isFalse(options.properties.backgroundSizeMerging);
+        assert.isFalse(options.properties.backgroundClipMerging);
         assert.isTrue(options.properties.colors);
         assert.isTrue(options.properties.iePrefixHack);
         assert.isTrue(options.properties.ieSuffixHack);
@@ -98,6 +101,7 @@ vows.describe(Compatibility)
       'gets template options': function(options) {
         assert.isFalse(options.colors.opacity);
         assert.isFalse(options.properties.backgroundSizeMerging);
+        assert.isFalse(options.properties.backgroundClipMerging);
         assert.isTrue(options.properties.colors);
         assert.isTrue(options.properties.iePrefixHack);
         assert.isTrue(options.properties.ieSuffixHack);
@@ -134,6 +138,7 @@ vows.describe(Compatibility)
       'gets calculated options': function(options) {
         assert.isTrue(options.colors.opacity);
         assert.isFalse(options.properties.backgroundSizeMerging);
+        assert.isFalse(options.properties.backgroundClipMerging);
         assert.isTrue(options.properties.colors);
         assert.isFalse(options.properties.iePrefixHack);
         assert.isTrue(options.properties.ieSuffixHack);
@@ -161,6 +166,7 @@ vows.describe(Compatibility)
         assert.isTrue(options.colors.opacity);
         assert.isTrue(options.properties.colors);
         assert.isFalse(options.properties.backgroundSizeMerging);
+        assert.isFalse(options.properties.backgroundClipMerging);
         assert.isTrue(options.properties.iePrefixHack);
         assert.isFalse(options.properties.ieSuffixHack);
         assert.isTrue(options.properties.merging);
@@ -187,6 +193,7 @@ vows.describe(Compatibility)
         assert.isTrue(options.colors.opacity);
         assert.isTrue(options.properties.colors);
         assert.isFalse(options.properties.backgroundSizeMerging);
+        assert.isFalse(options.properties.backgroundClipMerging);
         assert.isTrue(options.properties.iePrefixHack);
         assert.isFalse(options.properties.ieSuffixHack);
         assert.isTrue(options.properties.merging);