From 3fff0e9ef5f02b4976987f15a35037da07a34663 Mon Sep 17 00:00:00 2001
From: Guillaume <gui.lebas@gmail.com>
Date: Mon, 14 Jun 2021 18:35:42 +0200
Subject: [PATCH] test: computed calc()

---
 lib/CSSStyleDeclaration.test.js |  6 ---
 lib/parsers.test.js             | 66 +++++++++++++++++++++++++++++++--
 2 files changed, 62 insertions(+), 10 deletions(-)

diff --git a/lib/CSSStyleDeclaration.test.js b/lib/CSSStyleDeclaration.test.js
index 1159442d..7a6ebf0c 100644
--- a/lib/CSSStyleDeclaration.test.js
+++ b/lib/CSSStyleDeclaration.test.js
@@ -259,12 +259,6 @@ describe('CSSStyleDeclaration', () => {
     expect(style.getPropertyValue('--fOo')).toBe('purple');
   });
 
-  test('supports calc', () => {
-    const style = new CSSStyleDeclaration();
-    style.setProperty('width', 'calc(100% - 100px)');
-    expect(style.getPropertyValue('width')).toBe('calc(100% - 100px)');
-  });
-
   // Can be removed (already covered by parsers.test.js)
 
   test('colors', () => {
diff --git a/lib/parsers.test.js b/lib/parsers.test.js
index 5e6504e8..3f84a690 100644
--- a/lib/parsers.test.js
+++ b/lib/parsers.test.js
@@ -3,23 +3,81 @@
 const parsers = require('./parsers');
 
 describe('parseInteger', () => {
-  it.todo('test');
+  it('works with calc', () => {
+    expect(parsers.parseInteger('calc(1 + 1)')).toBe('2');
+  });
+  it.todo('more tests');
 });
 describe('parseNumber', () => {
-  it.todo('test');
+  it('works with calc', () => {
+    expect(parsers.parseNumber('calc(1.5 + 1.5)')).toBe('3');
+  });
+  it.todo('more tests');
 });
 describe('parseLength', () => {
-  it.todo('test');
+  it('works with calc', () => {
+    expect(parsers.parseLength('calc(1px + 1px)')).toBe('calc(2px)');
+  });
+  it.todo('more tests');
 });
 describe('parsePercent', () => {
-  it.todo('test');
+  it('works with calc', () => {
+    expect(parsers.parsePercent('calc(1% + 1%)')).toBe('calc(2%)');
+  });
+  it.todo('more tests');
 });
 describe('parseMeasurement', () => {
   it.todo('test');
 });
 describe('parseAngle', () => {
+  it('works with calc', () => {
+    expect(parsers.parseAngle('calc(1deg + 1deg)')).toBe('calc(2deg)');
+  });
   it.todo('test');
 });
+describe('parseTime', () => {
+  it('works with calc', () => {
+    expect(parsers.parseTime('calc(1s + 1s)')).toBe('calc(2s)');
+  });
+  it.todo('more tests');
+});
+describe('parseCalc', () => {
+  const resolveAngle = v => parsers.parseAngle(v, true);
+  const resolveLengthOrPercentage = v => parsers.parseLengthOrPercentage(v, true);
+  const resolveTime = v => parsers.parseTime(v, true);
+  it('returns null with 0 and <dimension-percentage> as operands', () => {
+    expect(parsers.parseCalc('calc(0 + 1px)', resolveLengthOrPercentage)).toBeNull();
+    expect(parsers.parseCalc('calc(1% * 1px)', resolveLengthOrPercentage)).toBeNull();
+  });
+  it('parses a single operand', () => {
+    expect(parsers.parseCalc('calc(1)')).toBe('1');
+    expect(parsers.parseCalc('calc(1px)', resolveLengthOrPercentage)).toBe('calc(1px)');
+  });
+  it('resolves numbers', () => {
+    expect(parsers.parseCalc('calc(1 - 2)')).toBe('-1');
+    expect(parsers.parseCalc('calc(1 + 2)')).toBe('3');
+    expect(parsers.parseCalc('calc(1 * 2)')).toBe('2');
+    expect(parsers.parseCalc('calc(1 / 2)')).toBe('0.5');
+    expect(parsers.parseCalc('calc(1.5 + 2.5 * 3)')).toBe('9');
+    expect(parsers.parseCalc('calc((1 + 2) * 3)')).toBe('9');
+    expect(parsers.parseCalc('calc(1 + 2 * (3 + 4))')).toBe('15');
+    expect(parsers.parseCalc('calc(calc(1 + 2) * 3 * calc(2 - 1))')).toBe('9');
+    expect(parsers.parseCalc('CALc(1 - 2)')).toBe('-1');
+  });
+  it('resolves numerics of the same type', () => {
+    expect(parsers.parseCalc('calc(1% + 2 * 1%)', resolveLengthOrPercentage)).toBe('calc(3%)');
+    expect(parsers.parseCalc('calc(1px + 2px * 1)', resolveLengthOrPercentage)).toBe('calc(3px)');
+    expect(parsers.parseCalc('calc(1px + 2em * 2)', resolveLengthOrPercentage)).toBe(
+      'calc(1px + 4em)'
+    );
+    expect(parsers.parseCalc('calc(1px + 1pc)', resolveLengthOrPercentage)).toBe('calc(17px)');
+    expect(parsers.parseCalc('calc(1turn + 180deg)', resolveAngle)).toBe('calc(180deg)');
+    expect(parsers.parseCalc('calc(1s + 1000ms)', resolveTime)).toBe('calc(2000ms)');
+    expect(parsers.parseCalc('CALc(1px + 1em)', resolveLengthOrPercentage)).toBe(
+      'calc(1px + 1em)'
+    );
+  });
+});
 describe('parseKeyword', () => {
   it('returns null for invalid values', () => {
     const invalid = ['ninitial', 'initiall', '--initial', 'liquid'];