From 25b154623756ad492e12c12d164acf4d4a3730e4 Mon Sep 17 00:00:00 2001 From: Florin Pana Date: Mon, 18 Nov 2024 12:19:08 +0200 Subject: [PATCH] PR review comments addresed --- .../color-modifier-references.test.ts | 7 +++--- test/integration/cross-file-refs.test.ts | 5 ++-- test/integration/custom-group.test.ts | 2 +- test/integration/exclude-parent-keys.test.ts | 5 ++-- test/integration/expand-composition.test.ts | 24 ++++++++----------- .../math-in-complex-values.test.ts | 21 +++++++--------- .../object-value-references.test.ts | 21 +++++++--------- test/integration/output-references.test.ts | 16 ++++++------- test/integration/sd-transforms.test.ts | 10 ++++---- test/integration/swift-UI-color.test.ts | 6 ++--- test/integration/utils.ts | 22 +++++++---------- test/integration/w3c-spec-compliance.test.ts | 5 ++-- 12 files changed, 61 insertions(+), 83 deletions(-) diff --git a/test/integration/color-modifier-references.test.ts b/test/integration/color-modifier-references.test.ts index 4b75e7f..6324a1e 100644 --- a/test/integration/color-modifier-references.test.ts +++ b/test/integration/color-modifier-references.test.ts @@ -43,16 +43,15 @@ describe('typography references', () => { it('supports references inside color modifiers', async () => { const file = await promises.readFile(outputFilePath, 'utf-8'); - const content = excerpt(file, { before: ':root {', after: '--sdModifier' }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs + const content = excerpt(file, { start: ':root {', end: '--sdModifier' }); const expectedOutput = `--sdAlpha: 0.3; --sdColor: #ffffff4d;`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); it('supports color modifier that is a reference itself, containing another reference', async () => { const file = await promises.readFile(outputFilePath, 'utf-8'); - const content = excerpt(file, { before: '--sdModifier: [object Object];', after: '}' }); + const content = excerpt(file, { start: '--sdModifier: [object Object];', end: '}' }); const expectedOutput = `--sdColor2: #0000004d;`; expect(content).to.equal(expectedOutput); }); diff --git a/test/integration/cross-file-refs.test.ts b/test/integration/cross-file-refs.test.ts index 326886a..bf1394f 100644 --- a/test/integration/cross-file-refs.test.ts +++ b/test/integration/cross-file-refs.test.ts @@ -43,8 +43,7 @@ describe('cross file references', () => { it('supports cross file references e.g. expanding typography', async () => { const file = await promises.readFile(outputFilePath, 'utf-8'); - const content = excerpt(file, { before: ':root {', after: '}' }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs + const content = excerpt(file, { start: ':root {', end: '}' }); const expectedOutput = `--sdTypoFontWeight: 400; --sdTypoFontStyle: italic; --sdPrimaryFont: Inter; @@ -78,6 +77,6 @@ describe('cross file references', () => { --sdTypo3FontWeight: 800; --sdTypo3LineHeight: 1.5; --sdTypo3FontSize: 8px;`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); }); diff --git a/test/integration/custom-group.test.ts b/test/integration/custom-group.test.ts index e5473b3..5c61b47 100644 --- a/test/integration/custom-group.test.ts +++ b/test/integration/custom-group.test.ts @@ -53,7 +53,7 @@ describe('custom transform group', () => { await before(); const file = await promises.readFile(outputFilePath, 'utf-8'); - const content = excerpt(file, { before: ':root {', after: '}' }); + const content = excerpt(file, { start: ':root {', end: '}' }); const expectedOutput = `--length: 24;`; expect(content).to.equal(expectedOutput); }); diff --git a/test/integration/exclude-parent-keys.test.ts b/test/integration/exclude-parent-keys.test.ts index 3b533f3..6da68aa 100644 --- a/test/integration/exclude-parent-keys.test.ts +++ b/test/integration/exclude-parent-keys.test.ts @@ -52,11 +52,10 @@ describe('exclude parent keys', () => { await init(cfg, transformOpts); await cleanup(); const file = await promises.readFile(outputFilePath, 'utf-8'); - const content = excerpt(file, { before: ':root {', after: '}' }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs + const content = excerpt(file, { start: ':root {', end: '}' }); const expectedOutput = `--sdCoreColor: #FFFFFF; --sdSemanticColor: #FFFFFF; --sdButtonColor: #FFFFFF;`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); }); diff --git a/test/integration/expand-composition.test.ts b/test/integration/expand-composition.test.ts index a22baa3..12444ab 100644 --- a/test/integration/expand-composition.test.ts +++ b/test/integration/expand-composition.test.ts @@ -64,10 +64,9 @@ describe('expand composition tokens', () => { const file = await promises.readFile(outputFilePath, 'utf-8'); const content = excerpt(file, { - before: ':root {', - after: '--sdDeepRef: italic 800 26px/1.25 Arial;', + start: ':root {', + end: '--sdDeepRef: italic 800 26px/1.25 Arial;', }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs const expectedOutput = `--sdCompositionSize: 24px; --sdCompositionOpacity: 0.5; --sdCompositionFontSize: 96px; @@ -85,13 +84,12 @@ describe('expand composition tokens', () => { --sdShadowSingle: inset 0 4px 10px 0 rgba(0,0,0,0.4); --sdShadowDouble: inset 0 4px 10px 0 rgba(0,0,0,0.4), 0 8px 12px 5px rgba(0,0,0,0.4); --sdRef: italic 800 26px/1.25 Arial;`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); it('optionally can transform typography, border and shadow tokens', async () => { const file = await promises.readFile(outputFilePath, 'utf-8'); - const content = excerpt(file, { before: ':root {', after: '--sdRefFontFamily: Arial;' }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs + const content = excerpt(file, { start: ':root {', end: '--sdRefFontFamily: Arial;' }); const expectedOutput = `--sdCompositionSize: 24px; --sdCompositionOpacity: 0.5; --sdCompositionFontSize: 96px; @@ -134,16 +132,15 @@ describe('expand composition tokens', () => { --sdShadowDouble2Color: rgba(0, 0, 0, 0.4); --sdShadowDouble2OffsetX: 0; --sdShadowDouble2OffsetY: 8px;`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); it('handles references and deep references for expandable values', async () => { const file = await promises.readFile(outputFilePath, 'utf-8'); const content = excerpt(file, { - before: '--sdShadowDouble2OffsetY: 8px;', - after: '--sdDeepRefShadowMulti1Blur: 10px;', + start: '--sdShadowDouble2OffsetY: 8px;', + end: '--sdDeepRefShadowMulti1Blur: 10px;', }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs const expectedOutput = `--sdRefFontFamily: Arial; --sdRefFontWeight: 800; --sdRefLineHeight: 1.25; @@ -164,13 +161,12 @@ describe('expand composition tokens', () => { --sdDeepRefTextDecoration: none; --sdDeepRefTextCase: none; --sdDeepRefFontStyle: italic;`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); it('handles references for multi-shadow value', async () => { const file = await promises.readFile(outputFilePath, 'utf-8'); - const content = excerpt(file, { before: '--sdDeepRefFontStyle: italic;', after: '}' }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs + const content = excerpt(file, { start: '--sdDeepRefFontStyle: italic;', end: '}' }); const expectedOutput = `--sdDeepRefShadowMulti1Blur: 10px; --sdDeepRefShadowMulti1Spread: 0; --sdDeepRefShadowMulti1Color: rgba(0, 0, 0, 0.4); @@ -182,6 +178,6 @@ describe('expand composition tokens', () => { --sdDeepRefShadowMulti2Color: rgba(0, 0, 0, 0.4); --sdDeepRefShadowMulti2OffsetX: 0; --sdDeepRefShadowMulti2OffsetY: 8px;`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); }); diff --git a/test/integration/math-in-complex-values.test.ts b/test/integration/math-in-complex-values.test.ts index c9121f3..27a833d 100644 --- a/test/integration/math-in-complex-values.test.ts +++ b/test/integration/math-in-complex-values.test.ts @@ -40,34 +40,31 @@ describe('sd-transforms advanced tests', () => { it('supports typography tokens with math or fontweight alias', async () => { const file = await promises.readFile(outputFilePath, 'utf-8'); const content = excerpt(file, { - before: ':root {', - after: '--sdBorder: 24px dashed rgba(255, 255, 0, 0.5);', + start: ':root {', + end: '--sdBorder: 24px dashed rgba(255, 255, 0, 0.5);', }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs const expectedOutput = `--sdTypo: 400 24px/1.125 'Arial Black';`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); it('supports border tokens with math width and hexrgba color', async () => { const file = await promises.readFile(outputFilePath, 'utf-8'); const content = excerpt(file, { - before: `--sdTypo: 400 24px/1.125 'Arial Black';`, - after: '--sdShadowSingle: inset 0 4px 10px 0 rgba(0, 0, 0, 0.4);', + start: `--sdTypo: 400 24px/1.125 'Arial Black';`, + end: '--sdShadowSingle: inset 0 4px 10px 0 rgba(0, 0, 0, 0.4);', }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs const expectedOutput = `--sdBorder: 24px dashed rgba(255, 255, 0, 0.5);`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); it('supports box shadow tokens with math dimensions, hexrgba color', async () => { const file = await promises.readFile(outputFilePath, 'utf-8'); const content = excerpt(file, { - before: `--sdBorder: 24px dashed rgba(255, 255, 0, 0.5);`, - after: '}', + start: `--sdBorder: 24px dashed rgba(255, 255, 0, 0.5);`, + end: '}', }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs const expectedOutput = `--sdShadowSingle: inset 0 4px 10px 0 rgba(0, 0, 0, 0.4); --sdShadowDouble: inset 0 4px 10px 0 rgba(0, 0, 0, 0.4), inset 0 4px 10px 0 rgba(255, 255, 255, 0.2);`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); }); diff --git a/test/integration/object-value-references.test.ts b/test/integration/object-value-references.test.ts index 7f1eb1a..d30bbeb 100644 --- a/test/integration/object-value-references.test.ts +++ b/test/integration/object-value-references.test.ts @@ -41,37 +41,34 @@ describe('typography references', () => { it('supports typography objects when referenced by another token', async () => { const file = await promises.readFile(outputFilePath, 'utf-8'); const content = excerpt(file, { - before: `:root {`, - after: '--sdShadow: 0 4px 10px 0 rgba(0,0,0,0.4), inset 0 8px 10px 4px rgba(0,0,0,0.6);', + start: `:root {`, + end: '--sdShadow: 0 4px 10px 0 rgba(0,0,0,0.4), inset 0 8px 10px 4px rgba(0,0,0,0.6);', }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs const expectedOutput = `--sdBefore: italic 400 36px/1 'Aria Sans'; --sdFontHeadingXxl: italic 400 36px/1 'Aria Sans'; --sdAfter: italic 400 36px/1 'Aria Sans';`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); it('supports boxShadow objects when referenced by another token', async () => { const file = await promises.readFile(outputFilePath, 'utf-8'); const content = excerpt(file, { - before: `--sdAfter: italic 400 36px/1 'Aria Sans';`, - after: '--sdFontWeightRefWeight: 400;', + start: `--sdAfter: italic 400 36px/1 'Aria Sans';`, + end: '--sdFontWeightRefWeight: 400;', }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs const expectedOutput = `--sdShadow: 0 4px 10px 0 rgba(0,0,0,0.4), inset 0 8px 10px 4px rgba(0,0,0,0.6); --sdShadowRef: 0 4px 10px 0 rgba(0,0,0,0.4), inset 0 8px 10px 4px rgba(0,0,0,0.6);`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); it('supports border objects when referenced by another token', async () => { const file = await promises.readFile(outputFilePath, 'utf-8'); const content = excerpt(file, { - before: `--sdFontWeightRefStyle: italic;`, - after: '}', + start: `--sdFontWeightRefStyle: italic;`, + end: '}', }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs const expectedOutput = `--sdBorder: 4px solid #FFFF00; --sdBorderRef: 4px solid #FFFF00;`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); }); diff --git a/test/integration/output-references.test.ts b/test/integration/output-references.test.ts index 77c901d..f7060e1 100644 --- a/test/integration/output-references.test.ts +++ b/test/integration/output-references.test.ts @@ -45,12 +45,12 @@ describe('outputReferences integration', () => { const expectedOutput1 = `--sd-my-base-token: 11;`; const expectedOutput2 = `--sd-my-reference-token: var(--sd-my-base-token);`; const content1 = excerpt(file, { - before: ':root {', - after: '--sd-transformed-base-token: 4;', + start: ':root {', + end: '--sd-transformed-base-token: 4;', }); const content2 = excerpt(file, { - before: '--sd-transformed-base-token: 4;', - after: '--sd-transformed-reference-token: var(--sd-my-base-token) * 5;', + start: '--sd-transformed-base-token: 4;', + end: '--sd-transformed-reference-token: var(--sd-my-base-token) * 5;', }); expect(content1).to.equal(expectedOutput1); expect(content2).to.equal(expectedOutput2); @@ -61,12 +61,12 @@ describe('outputReferences integration', () => { const expectedOutput1 = `--sd-transformed-base-token: 4;`; const expectedOutput2 = `--sd-transformed-reference-token: var(--sd-my-base-token) * 5;`; const content1 = excerpt(file, { - before: '--sd-my-base-token: 11;', - after: '--sd-my-reference-token: var(--sd-my-base-token);', + start: '--sd-my-base-token: 11;', + end: '--sd-my-reference-token: var(--sd-my-base-token);', }); const content2 = excerpt(file, { - before: '--sd-my-reference-token: var(--sd-my-base-token);', - after: '}', + start: '--sd-my-reference-token: var(--sd-my-base-token);', + end: '}', }); expect(content1).to.equal(expectedOutput1); expect(content2).to.equal(expectedOutput2); diff --git a/test/integration/sd-transforms.test.ts b/test/integration/sd-transforms.test.ts index f154af6..2fa63f6 100644 --- a/test/integration/sd-transforms.test.ts +++ b/test/integration/sd-transforms.test.ts @@ -42,9 +42,8 @@ describe('sd-transforms smoke tests', () => { it('supports tokens-studio tokens', async () => { const file = await promises.readFile(outputFilePath, 'utf-8'); const content = excerpt(file, { - before: '\n */', + start: '\n */', }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs const expectedOutput = `:root { --sdDimensionScale: 2; --sdDimensionXs: 4px; @@ -82,7 +81,7 @@ describe('sd-transforms smoke tests', () => { --sdColor: #ff00ff; --sdUsesColor: rgba(255, 0, 255, 1); }`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); it('allows easily changing the casing', async () => { @@ -101,8 +100,7 @@ describe('sd-transforms smoke tests', () => { { 'ts/color/modifiers': { format: 'hex' } }, ); const file = await promises.readFile(outputFilePath, 'utf-8'); - const content = excerpt(file, { before: '\n */' }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs + const content = excerpt(file, { start: '\n */' }); const expectedOutput = `:root { --sd-dimension-scale: 2; --sd-dimension-xs: 4px; @@ -140,7 +138,7 @@ describe('sd-transforms smoke tests', () => { --sd-color: #ff00ff; --sd-uses-color: rgba(255, 0, 255, 1); }`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); it('allows easily adding attribute/cti transform to tokens-studio group', async () => { diff --git a/test/integration/swift-UI-color.test.ts b/test/integration/swift-UI-color.test.ts index 7e55209..7f166a2 100644 --- a/test/integration/swift-UI-color.test.ts +++ b/test/integration/swift-UI-color.test.ts @@ -61,10 +61,10 @@ describe('outputReferences integration', () => { it('supports UIColor with color modifiers', async () => { const file = await promises.readFile(outputFilePath, 'utf-8'); - const content = excerpt(file, { before: 'public class {', after: '}' }); + const content = excerpt(file, { start: 'public class {', end: '}' }); const expectedOutput = `public static let colorDanger = UIColor(red: 0.251, green: 0.000, blue: 0.000, alpha: 1) - public static let colorError = UIColor(red: 0.125, green: 0.000, blue: 0.000, alpha: 1) - public static let colorRed = UIColor(red: 1.000, green: 0.000, blue: 0.000, alpha: 1)`; +public static let colorError = UIColor(red: 0.125, green: 0.000, blue: 0.000, alpha: 1) +public static let colorRed = UIColor(red: 1.000, green: 0.000, blue: 0.000, alpha: 1)`; expect(content).to.equal(expectedOutput); }); }); diff --git a/test/integration/utils.ts b/test/integration/utils.ts index 0bb18aa..432c18f 100644 --- a/test/integration/utils.ts +++ b/test/integration/utils.ts @@ -29,24 +29,18 @@ export async function cleanup(dict?: StyleDictionary & { cleaned?: boolean }) { // Take an excerpt of a string and trim whitespace at the ends // and remove indentations after newline -> before the `--` CSS prop starting characters -export function excerpt(content: string, options?: { before?: string; after?: string }) { - const { before, after } = options ?? {}; +export function excerpt(content: string, options?: { start?: string; end?: string }) { + const { start, end } = options ?? {}; let trimmedContent = content; - if (before) { - trimmedContent = trimmedContent.split(before)[1]; + if (start) { + trimmedContent = trimmedContent.split(start)[1]; } - if (after) { - trimmedContent = trimmedContent.split(after)[0]; + if (end) { + trimmedContent = trimmedContent.split(end)[0]; } trimmedContent = trimmedContent.trim(); - const indentMatches = trimmedContent.matchAll(RegExp('(?( [\\t])+)--', 'g')); + const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); - for (const match of indentMatches) { - if (match.groups?.indents) { - const { indents } = match.groups; - trimmedContent = trimmedContent.replace(indents, ''); - } - } - return trimmedContent; + return normalizeWhitespace(trimmedContent); } diff --git a/test/integration/w3c-spec-compliance.test.ts b/test/integration/w3c-spec-compliance.test.ts index bb1e1be..d33d6a5 100644 --- a/test/integration/w3c-spec-compliance.test.ts +++ b/test/integration/w3c-spec-compliance.test.ts @@ -47,8 +47,7 @@ describe('w3c spec compliance smoke test', () => { // https://design-tokens.github.io/community-group/format/ it('supports W3C DTCG draft spec', async () => { const file = await promises.readFile(outputFilePath, 'utf-8'); - const content = excerpt(file, { before: '\n */' }); - const normalizeWhitespace = (str: string) => str.replace(/^\s+/gm, ''); // Remove leading spaces/tabs + const content = excerpt(file, { start: '\n */' }); const expectedOutput = `:root { --sdDimensionScale: 2; --sdDimensionXs: 4px; @@ -86,6 +85,6 @@ describe('w3c spec compliance smoke test', () => { --sdColor: #FF00FF; --sdUsesColor: rgba(255, 0, 255, 1); }`; - expect(normalizeWhitespace(content)).to.equal(normalizeWhitespace(expectedOutput)); + expect(content).to.equal(expectedOutput); }); });