From 5d573749ebd4aa32c80c77b7a61503efae0f9ef3 Mon Sep 17 00:00:00 2001 From: cristianbote Date: Wed, 27 Apr 2022 13:40:16 +0300 Subject: [PATCH 1/4] (fix) Replace newlines with empty space --- src/core/__tests__/astish.test.js | 15 +++++++++++++++ src/core/astish.js | 12 ++++++++---- 2 files changed, 23 insertions(+), 4 deletions(-) diff --git a/src/core/__tests__/astish.test.js b/src/core/__tests__/astish.test.js index edebf83f..118388ec 100644 --- a/src/core/__tests__/astish.test.js +++ b/src/core/__tests__/astish.test.js @@ -201,4 +201,19 @@ describe('astish', () => { } }); }); + + it('should handle newlines as part of the rule value', () => { + expect( + astish( + `tag { + font-size: first + second; + }` + ) + ).toEqual({ + h1: { + 'font-size': 'first second' + } + }); + }); }); diff --git a/src/core/astish.js b/src/core/astish.js index 1d88e438..84d316bb 100644 --- a/src/core/astish.js +++ b/src/core/astish.js @@ -1,5 +1,5 @@ let newRule = /(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\s*)/g; -let ruleClean = /\/\*[^]*?\*\/|\s\s+|\n/g; +let ruleClean = /\/\*[^]*?\*\/+/g; /** * Convert a css style string into a object @@ -9,15 +9,19 @@ let ruleClean = /\/\*[^]*?\*\/|\s\s+|\n/g; export let astish = (val) => { let tree = [{}]; let block; + let selector; while ((block = newRule.exec(val.replace(ruleClean, '')))) { // Remove the current entry + selector = (block[3] || '').trim().replace(/\s+|\n+/g, ' '); + if (block[4]) { tree.shift(); - } else if (block[3]) { - tree.unshift((tree[0][block[3]] = tree[0][block[3]] || {})); + } else if (selector) { + tree.unshift((tree[0][selector] = tree[0][selector] || {})); } else { - tree[0][block[1]] = block[2]; + selector = (block[1] || '').trim().replace(/\s+|\n+/g, ' '); + tree[0][selector] = block[2].trim().replace(/\s+|\n+/g, ' '); } } From 7e60270067ccf34a2b61c63ef7c7a36f66b0b346 Mon Sep 17 00:00:00 2001 From: cristianbote Date: Wed, 27 Apr 2022 13:59:53 +0300 Subject: [PATCH 2/4] Tests fix --- src/core/__tests__/astish.test.js | 8 ++++---- src/core/astish.js | 13 ++++++++----- 2 files changed, 12 insertions(+), 9 deletions(-) diff --git a/src/core/__tests__/astish.test.js b/src/core/__tests__/astish.test.js index 118388ec..1e21e2a1 100644 --- a/src/core/__tests__/astish.test.js +++ b/src/core/__tests__/astish.test.js @@ -38,7 +38,7 @@ describe('astish', () => { ).toEqual({ prop: 'value', opacity: '0', - '.class,&:hover': { + '.class, &:hover': { '-webkit-touch': 'none' }, '@keyframes foo': { @@ -181,7 +181,7 @@ describe('astish', () => { center/contain; `) ).toEqual({ - background: `url('data:image/svg+xml,')center/contain` + background: `url('data:image/svg+xml,') center/contain` }); }); @@ -195,7 +195,7 @@ describe('astish', () => { 'font-size': '1rem' }, '@media only screen and (min-width: 850px)': { - ' h1': { + h1: { 'font-size': '2rem' } } @@ -211,7 +211,7 @@ describe('astish', () => { }` ) ).toEqual({ - h1: { + tag: { 'font-size': 'first second' } }); diff --git a/src/core/astish.js b/src/core/astish.js index 84d316bb..d536d208 100644 --- a/src/core/astish.js +++ b/src/core/astish.js @@ -1,5 +1,5 @@ let newRule = /(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\s*)/g; -let ruleClean = /\/\*[^]*?\*\/+/g; +let ruleClean = /\/\*[^]*?\*\//g; /** * Convert a css style string into a object @@ -11,17 +11,20 @@ export let astish = (val) => { let block; let selector; + function clean(val) { + return !val ? '' : val.trim().replace(/\s+|\n+/g, ' '); + } + while ((block = newRule.exec(val.replace(ruleClean, '')))) { // Remove the current entry - selector = (block[3] || '').trim().replace(/\s+|\n+/g, ' '); if (block[4]) { tree.shift(); - } else if (selector) { + } else if (block[3]) { + selector = clean(block[3]); tree.unshift((tree[0][selector] = tree[0][selector] || {})); } else { - selector = (block[1] || '').trim().replace(/\s+|\n+/g, ' '); - tree[0][selector] = block[2].trim().replace(/\s+|\n+/g, ' '); + tree[0][clean(block[1])] = clean(block[2]); } } From 69af09ec54bbf7f225294292e3094f07ec4d8336 Mon Sep 17 00:00:00 2001 From: cristianbote Date: Wed, 27 Apr 2022 14:16:27 +0300 Subject: [PATCH 3/4] Smaller --- src/core/astish.js | 16 +++++----------- 1 file changed, 5 insertions(+), 11 deletions(-) diff --git a/src/core/astish.js b/src/core/astish.js index d536d208..9079ff46 100644 --- a/src/core/astish.js +++ b/src/core/astish.js @@ -1,5 +1,5 @@ let newRule = /(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\s*)/g; -let ruleClean = /\/\*[^]*?\*\//g; +let ruleClean = /\/\*[^]*?\*\/| +/g; /** * Convert a css style string into a object @@ -8,23 +8,17 @@ let ruleClean = /\/\*[^]*?\*\//g; */ export let astish = (val) => { let tree = [{}]; - let block; - let selector; - - function clean(val) { - return !val ? '' : val.trim().replace(/\s+|\n+/g, ' '); - } + let block, left; while ((block = newRule.exec(val.replace(ruleClean, '')))) { // Remove the current entry - if (block[4]) { tree.shift(); } else if (block[3]) { - selector = clean(block[3]); - tree.unshift((tree[0][selector] = tree[0][selector] || {})); + left = block[3].replace(/\n+/g, ' ').trim(); + tree.unshift((tree[0][left] = tree[0][left] || {})); } else { - tree[0][clean(block[1])] = clean(block[2]); + tree[0][block[1]] = block[2].replace(/\n+/g, ' ').trim(); } } From c17c3caa08b55c5f0d5ce46444084ae86d2ce929 Mon Sep 17 00:00:00 2001 From: cristianbote Date: Wed, 27 Apr 2022 14:24:59 +0300 Subject: [PATCH 4/4] Hoist to vars --- src/core/astish.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/core/astish.js b/src/core/astish.js index 9079ff46..6a7eb1df 100644 --- a/src/core/astish.js +++ b/src/core/astish.js @@ -1,5 +1,7 @@ let newRule = /(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\s*)/g; let ruleClean = /\/\*[^]*?\*\/| +/g; +let ruleNewline = /\n+/g; +let empty = ' '; /** * Convert a css style string into a object @@ -15,10 +17,10 @@ export let astish = (val) => { if (block[4]) { tree.shift(); } else if (block[3]) { - left = block[3].replace(/\n+/g, ' ').trim(); + left = block[3].replace(ruleNewline, empty).trim(); tree.unshift((tree[0][left] = tree[0][left] || {})); } else { - tree[0][block[1]] = block[2].replace(/\n+/g, ' ').trim(); + tree[0][block[1]] = block[2].replace(ruleNewline, empty).trim(); } }