Add calc() support for margin and padding

Closes #154.
jsdom · Sep 7, 2024 · 25bace5 · 25bace5
1 parent b7af48e
commit 25bace5
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 5 deletions.
diff --git 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
@@ -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
@@ -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)');
+    });
+  }
 });