Fixes #422 - proper calc() handling in background position.

diff --git a/History.md b/History.md
index 100dffe..3a8f4ad 100644 (file)
--- a/History.md
+++ b/History.md
@@ -1,3 +1,8 @@
+[3.0.2 / 2015-xx-xx](https://github.com/jakubpawlowicz/clean-css/compare/v3.0.1...v3.0.2)
+==================
+
+* Fixed issue [#422](https://github.com/GoalSmashers/clean-css/issues/422) - handling calc as a unit.
+
 [3.0.1 / 2014-12-19](https://github.com/jakubpawlowicz/clean-css/compare/v3.0.0...v3.0.1)
 ==================
 

diff --git a/lib/properties/validator.js b/lib/properties/validator.js
index 0bfe313..6294201 100644 (file)
--- a/lib/properties/validator.js
+++ b/lib/properties/validator.js
@@ -8,10 +8,12 @@ module.exports = (function () {
   var widthKeywords = ['thin', 'thick', 'medium', 'inherit', 'initial'];
   var allUnits = ['px', '%', 'em', 'rem', 'in', 'cm', 'mm', 'ex', 'pt', 'pc', 'vw', 'vh', 'vmin', 'vmax'];
   var cssUnitRegexStr = '(\\-?\\.?\\d+\\.?\\d*(' + allUnits.join('|') + '|)|auto|inherit)';
+  var cssCalcRegexStr = '(\\-moz\\-|\\-webkit\\-)?calc\\([^\\)]+\\)';
   var cssFunctionNoVendorRegexStr = '[A-Z]+(\\-|[A-Z]|[0-9])+\\(([A-Z]|[0-9]|\\ |\\,|\\#|\\+|\\-|\\%|\\.|\\(|\\))*\\)';
   var cssFunctionVendorRegexStr = '\\-(\\-|[A-Z]|[0-9])+\\(([A-Z]|[0-9]|\\ |\\,|\\#|\\+|\\-|\\%|\\.|\\(|\\))*\\)';
   var cssVariableRegexStr = 'var\\(\\-\\-[^\\)]+\\)';
   var cssFunctionAnyRegexStr = '(' + cssVariableRegexStr + '|' + cssFunctionNoVendorRegexStr + '|' + cssFunctionVendorRegexStr + ')';
+  var cssUnitOrCalcRegexStr = '(' + cssUnitRegexStr + '|' + cssCalcRegexStr + ')';
   var cssUnitAnyRegexStr = '(none|' + widthKeywords.join('|') + '|' + cssUnitRegexStr + '|' + cssVariableRegexStr + '|' + cssFunctionNoVendorRegexStr + '|' + cssFunctionVendorRegexStr + ')';
 
   var cssFunctionNoVendorRegex = new RegExp('^' + cssFunctionNoVendorRegexStr + '$', 'i');
@@ -19,6 +21,7 @@ module.exports = (function () {
   var cssVariableRegex = new RegExp('^' + cssVariableRegexStr + '$', 'i');
   var cssFunctionAnyRegex = new RegExp('^' + cssFunctionAnyRegexStr + '$', 'i');
   var cssUnitRegex = new RegExp('^' + cssUnitRegexStr + '$', 'i');
+  var cssUnitOrCalcRegex = new RegExp('^' + cssUnitOrCalcRegexStr + '$', 'i');
   var cssUnitAnyRegex = new RegExp('^' + cssUnitAnyRegexStr + '$', 'i');
 
   var backgroundRepeatKeywords = ['repeat', 'no-repeat', 'repeat-x', 'repeat-y', 'inherit'];
@@ -103,10 +106,7 @@ module.exports = (function () {
       return backgroundAttachmentKeywords.indexOf(s) >= 0 || validator.isValidVariable(s);
     },
     isValidBackgroundPositionPart: function (s) {
-      if (backgroundPositionKeywords.indexOf(s) >= 0)
-        return true;
-
-      return cssUnitRegex.test(s) || validator.isValidVariable(s);
+      return backgroundPositionKeywords.indexOf(s) >= 0 || cssUnitOrCalcRegex.test(s) || validator.isValidVariable(s);
     },
     isValidBackgroundPosition: function (s) {
       if (s === 'inherit')

diff --git a/test/integration-test.js b/test/integration-test.js
index bbef782..3892ddc 100644 (file)
--- a/test/integration-test.js
+++ b/test/integration-test.js
@@ -2206,6 +2206,12 @@ title']{display:block}",
       'a{background:url(1.png);background-size:28px 28px}'
     ]
   }),
+  'background position': cssContext({
+    'calc as a value': [
+      '*{background:white calc(100% - 10px) center no-repeat;background-image:url(test.png)}',
+      '*{background:url(test.png) calc(100% - 10px) center no-repeat #fff}'
+    ]
+  }),
   'background size with +properties.backgroundSizeMerging': cssContext({
     'with background-size property': [
       'a{background:none;background-image:url(1.png);background-size:28px 28px}',