From 25fe0defb57213b298200086487b1483ce4d993d Mon Sep 17 00:00:00 2001
From: Jordan Drake <jordan@jdrake.co.uk>
Date: Fri, 12 Oct 2018 12:28:24 +0100
Subject: [PATCH] fix: do not merge properties with unset

---
 .../src/__tests__/boxBase.js                  | 24 +++++++++++++++++++
 .../src/lib/canMerge.js                       |  5 ++++
 2 files changed, 29 insertions(+)

diff --git a/packages/postcss-merge-longhand/src/__tests__/boxBase.js b/packages/postcss-merge-longhand/src/__tests__/boxBase.js
index 87d0e48a3..104e019c6 100644
--- 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-bottom:unset;box-top:unset;box-left:unset;box-right:unset}',
+    expected: 'h1{box:unset}',
+}, {
+    message: 'should merge box props when they are all initial',
+    fixture: 'h1{box-bottom:initial;box-top:initial;box-left:initial;box-right:initial}',
+    expected: 'h1{box:initial}',
+}, {
+    message: 'should merge box props when they are all inherit',
+    fixture: 'h1{box-bottom:inherit;box-top:inherit;box-left:inherit;box-right:inherit}',
+    expected: 'h1{box:inherit}',
 });
diff --git a/packages/postcss-merge-longhand/src/lib/canMerge.js b/packages/postcss-merge-longhand/src/lib/canMerge.js
index f651e9da3..437f768b2 100644
--- 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;
     }