fix: do not merge properties with unset

cssnano · Oct 12, 2018 · 14111bb · 14111bb
1 parent 15076f1
commit 14111bb
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 0 deletions.
diff --git a/packages/postcss-merge-longhand/src/__tests__/boxBase.js b/packages/postcss-merge-longhand/src/__tests__/boxBase.js
@@ -117,4 +117,28 @@ addTests({
     message: 'should not explode box props with custom properties',
     fixture: 'h1{box-bottom:var(--variable)}',
     expected: 'h1{box-bottom:var(--variable)}',
+}, {
+    message: 'should not merge box props where one has an unset property',
+    fixture: 'h1{box-bottom:10px;box-top:unset;box-left:20px}',
+    expected: 'h1{box-bottom:10px;box-top:unset;box-left:20px}',
+}, {
+    message: 'should not merge box props where one has an initial property',
+    fixture: 'h1{box-bottom:10px;box-top:initial;box-left:20px}',
+    expected: 'h1{box-bottom:10px;box-top:initial;box-left:20px}',
+}, {
+    message: 'should not merge box props where one has an inherit property',
+    fixture: 'h1{box-bottom:10px;box-top:initial;box-left:20px}',
+    expected: 'h1{box-bottom:10px;box-top:initial;box-left:20px}',
+}, {
+    message: 'should merge box props when they are all unset',
+    fixture: 'h1{box:unset;box-top:unset;box-left:unset}',
+    expected: 'h1{box:unset}',
+}, {
+    message: 'should merge box props when they are all initial',
+    fixture: 'h1{box:unset;box-top:unset;box-left:unset}',
+    expected: 'h1{box:unset}',
+}, {
+    message: 'should merge box props when they are all inherit',
+    fixture: 'h1{box:unset;box-top:unset;box-left:unset}',
+    expected: 'h1{box:unset}',
 });
diff --git a/packages/postcss-merge-longhand/src/lib/canMerge.js b/packages/postcss-merge-longhand/src/lib/canMerge.js
@@ -4,6 +4,7 @@ const important = node => node.important;
 const unimportant = node => !node.important;
 const hasInherit = node => ~node.value.indexOf('inherit');
 const hasInitial = node => ~node.value.indexOf('initial');
+const hasUnset = node => ~node.value.indexOf('unset');
 
 export default (props, includeCustomProps = true) => {
     if (props.some(hasInherit) && !props.every(hasInherit)) {
@@ -14,6 +15,10 @@ export default (props, includeCustomProps = true) => {
         return false;
     }
 
+    if (props.some(hasUnset) && !props.every(hasUnset)) {
+        return false;
+    }
+
     if (includeCustomProps && props.some(isCustomProp) && !props.every(isCustomProp)) {
         return false;
     }