Fixes #938 - removing unused at-rules with `!important`.

Why:

* When an at-rule is referenced from a shorthand property, the latter
  needs to be broken apart, which as a result strips `!important`
  modifier. So after checking shorthands need to be restored back.

diff --git a/History.md b/History.md
index 4ede7cf..f72fd63 100644 (file)
--- a/History.md
+++ b/History.md
@@ -1,3 +1,8 @@
+[4.1.1 / 2017-xx-xx](https://github.com/jakubpawlowicz/clean-css/compare/v4.1.0...4.1)
+==================
+
+* Fixed issue [#938](https://github.com/jakubpawlowicz/clean-css/issues/938) - removing unused at-rules with `!important`.
+
 [4.1.0 / 2017-05-07](https://github.com/jakubpawlowicz/clean-css/compare/4.0...v4.1.0)
 ==================
 

diff --git a/lib/optimizer/level-2/remove-unused-at-rules.js b/lib/optimizer/level-2/remove-unused-at-rules.js
index bb6e5a3..e60d5e7 100644 (file)
--- a/lib/optimizer/level-2/remove-unused-at-rules.js
+++ b/lib/optimizer/level-2/remove-unused-at-rules.js
@@ -1,6 +1,7 @@
 var populateComponents = require('./properties/populate-components');
 
 var wrapForOptimizing = require('../wrap-for-optimizing').single;
+var restoreFromOptimizing = require('../restore-from-optimizing');
 
 var Token = require('../../tokenizer/token');
 
@@ -79,6 +80,8 @@ function markCounterStylesAsUsed(atRules) {
         if (wrappedProperty.components[0].value[0][1] in atRules) {
           delete atRules[property[2][1]];
         }
+
+        restoreFromOptimizing([wrappedProperty]);
       }
 
       if (property[1][1] == 'list-style-type' && property[2][1] in atRules) {
@@ -130,6 +133,8 @@ function markFontFacesAsUsed(atRules) {
             delete atRules[normalizedMatch];
           }
         }
+
+        restoreFromOptimizing([wrappedProperty]);
       }
 
       if (property[1][1] == 'font-family') {
@@ -175,6 +180,8 @@ function markKeyframesAsUsed(atRules) {
             delete atRules[component.value[j][1]];
           }
         }
+
+        restoreFromOptimizing([wrappedProperty]);
       }
 
       if (animationNameRegex.test(property[1][1])) {

diff --git a/test/optimizer/level-2/remove-unused-at-rules-test.js b/test/optimizer/level-2/remove-unused-at-rules-test.js
index 35083eb..3d2e8c6 100644 (file)
--- a/test/optimizer/level-2/remove-unused-at-rules-test.js
+++ b/test/optimizer/level-2/remove-unused-at-rules-test.js
@@ -23,6 +23,10 @@ vows.describe('remove unused at rules')
       'one used declaration and one unused': [
         '@counter-style test{system:fixed;symbols:url(one.png) url(two.png);suffix:" "}@counter-style test2{system:fixed;symbols:url(one.png) url(two.png);suffix:" "}.block{list-style-type:test}',
         '@counter-style test{system:fixed;symbols:url(one.png) url(two.png);suffix:" "}.block{list-style-type:test}'
+      ],
+      'one used declaration with !important': [
+        '@counter-style test{system:fixed;symbols:url(one.png) url(two.png);suffix:" "}.block{list-style:test!important}',
+        '@counter-style test{system:fixed;symbols:url(one.png) url(two.png);suffix:" "}.block{list-style:test!important}'
       ]
     }, { level: { 2: { removeUnusedAtRules: true } } })
   )
@@ -63,6 +67,10 @@ vows.describe('remove unused at rules')
       'one used declaration and one unused': [
         '@font-face{font-family:test}@font-face{font-family:test2}.block{font:16px test}',
         '@font-face{font-family:test}.block{font:16px test}'
+      ],
+      'one used with !important': [
+        '@font-face{font-family:test}.block{font:16px test!important}',
+        '@font-face{font-family:test}.block{font:16px test!important}'
       ]
     }, { level: { 2: { removeUnusedAtRules: true } } })
   )
@@ -103,6 +111,10 @@ vows.describe('remove unused at rules')
       'one used declaration and one unused': [
         '@keyframes test{0%{opacity:0}100%{opacity:1}}@keyframes test2{0%{opacity:0}100%{opacity:1}}.block{animation-name:test}',
         '@keyframes test{0%{opacity:0}100%{opacity:1}}.block{animation-name:test}'
+      ],
+      'one used with !important': [
+        '@keyframes test{0%{opacity:0}100%{opacity:1}}.block{animation:1s ease-in test!important}',
+        '@keyframes test{0%{opacity:0}100%{opacity:1}}.block{animation:1s ease-in test!important}'
       ]
     }, { level: { 2: { removeUnusedAtRules: true } } })
   )