From 41f73bb32313468373cc8a71f61fab2661ed9447 Mon Sep 17 00:00:00 2001
From: Bram Meerten <bram.mee@gmail.com>
Date: Wed, 26 Jun 2024 14:58:18 +0200
Subject: [PATCH] Add  support for margin and padding #154

---
 lib/properties/margin.js    |  1 +
 lib/properties/padding.js   |  1 +
 test/CSSStyleDeclaration.js | 20 +++++++++++++++-----
 3 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/lib/properties/margin.js b/lib/properties/margin.js
index 3a42cd7..fc6f031 100644
--- a/lib/properties/margin.js
+++ b/lib/properties/margin.js
@@ -12,6 +12,7 @@ var isValid = function (v) {
     type === TYPES.NULL_OR_EMPTY_STR ||
     type === TYPES.LENGTH ||
     type === TYPES.PERCENT ||
+    type === TYPES.CALC ||
     (type === TYPES.INTEGER && (v === '0' || v === 0))
   );
 };
diff --git a/lib/properties/padding.js b/lib/properties/padding.js
index 3848913..a82900b 100644
--- a/lib/properties/padding.js
+++ b/lib/properties/padding.js
@@ -9,6 +9,7 @@ var isValid = function (v) {
     type === TYPES.NULL_OR_EMPTY_STR ||
     type === TYPES.LENGTH ||
     type === TYPES.PERCENT ||
+    type === TYPES.CALC ||
     (type === TYPES.INTEGER && (v === '0' || v === 0))
   );
 };
diff --git a/test/CSSStyleDeclaration.js b/test/CSSStyleDeclaration.js
index 0ee7cd4..b2f20a2 100644
--- a/test/CSSStyleDeclaration.js
+++ b/test/CSSStyleDeclaration.js
@@ -727,9 +727,19 @@ describe('CSSStyleDeclaration', () => {
     assert.strictEqual(style.getPropertyValue('--fOo'), 'purple');
   });
 
-  it('supports calc', () => {
-    const style = new CSSStyleDeclaration();
-    style.setProperty('width', 'calc(100% - 100px)');
-    assert.strictEqual(style.getPropertyValue('width'), 'calc(100% - 100px)');
-  });
+  for (const property of [
+    'width',
+    'height',
+    'margin',
+    'margin-top',
+    'bottom',
+    'right',
+    'padding',
+  ]) {
+    it(`supports calc for ${property}`, () => {
+      const style = new CSSStyleDeclaration();
+      style.setProperty(property, 'calc(100% - 100px)');
+      assert.strictEqual(style.getPropertyValue(property), 'calc(100% - 100px)');
+    });
+  }
 });