Fixed the issue with incorrectly throwing errors on valid content val…

…ues containing `open-quote` (#2279) * Fix incorrectly throwing error on valid content values in dev * Remove invalid regex pattern `calc` * Remove invalid content value `counter` * Several content values can be used simultaneously, except for `normal`, `none` and global values * Update .changeset/sweet-donkeys-film.md Co-authored-by: Mateusz Burzyński <[email protected]>
emotion-js · Mar 16, 2021 · 830dd0e · 830dd0e
1 parent 734b36b
commit 830dd0e
Show file tree

Hide file tree

Showing 6 changed files with 13 additions and 19 deletions.
diff --git a/.changeset/sweet-donkeys-film.md b/.changeset/sweet-donkeys-film.md
@@ -0,0 +1,5 @@
+---
+'@emotion/serialize': patch
+---
+
+Fixed the issue with incorrectly throwing errors on valid content values containing `open-quote`.
diff --git a/packages/css/test/__snapshots__/warnings.test.js.snap b/packages/css/test/__snapshots__/warnings.test.js.snap
@@ -4,7 +4,6 @@ exports[`does not warn when valid values are passed for the content property 1`]
 .emotion-0 {
   content: normal;
   content: none;
-  content: counter;
   content: open-quote;
   content: close-quote;
   content: no-open-quote;
@@ -22,6 +21,7 @@ exports[`does not warn when valid values are passed for the content property 1`]
   content: counter(chapter_counter);
   content: counters(section_counter, ".");
   content: attr(value string);
+  content: open-quote counter(chapter_counter);
 }
 
 <div

diff --git a/packages/css/test/warnings.test.js b/packages/css/test/warnings.test.js
@@ -11,7 +11,6 @@ console.error = jest.fn()
 const validValues = [
   'normal',
   'none',
-  'counter',
   'open-quote',
   'close-quote',
   'no-open-quote',
@@ -28,7 +27,8 @@ const validValues = [
   'conic-gradient(hotpink, #8be9fd)',
   'counter(chapter_counter)',
   'counters(section_counter, ".")',
-  'attr(value string)'
+  'attr(value string)',
+  'open-quote counter(chapter_counter)'
 ]
 
 afterEach(() => {

diff --git a/packages/react/__tests__/__snapshots__/warnings.js.snap b/packages/react/__tests__/__snapshots__/warnings.js.snap
@@ -4,7 +4,6 @@ exports[`does not warn when valid values are passed for the content property 1`]
 .emotion-0 {
   content: normal;
   content: none;
-  content: counter;
   content: open-quote;
   content: close-quote;
   content: no-open-quote;
@@ -22,6 +21,7 @@ exports[`does not warn when valid values are passed for the content property 1`]
   content: counter(chapter_counter);
   content: counters(section_counter, ".");
   content: attr(value string);
+  content: open-quote counter(chapter_counter);
 }
 
 <div

diff --git a/packages/react/__tests__/warnings.js b/packages/react/__tests__/warnings.js
@@ -11,7 +11,6 @@ console.error = jest.fn()
 const validValues = [
   'normal',
   'none',
-  'counter',
   'open-quote',
   'close-quote',
   'no-open-quote',
@@ -28,7 +27,8 @@ const validValues = [
   'conic-gradient(hotpink, #8be9fd)',
   'counter(chapter_counter)',
   'counters(section_counter, ".")',
-  'attr(value string)'
+  'attr(value string)',
+  'open-quote counter(chapter_counter)'
 ]
 
 beforeEach(() => {

diff --git a/packages/serialize/src/index.js b/packages/serialize/src/index.js
@@ -61,19 +61,8 @@ let processStyleValue = (
 }
 
 if (process.env.NODE_ENV !== 'production') {
-  let contentValuePattern = /(attr|calc|counters?|url|(((repeating-)?(linear|radial))|conic)-gradient)\(/
-  let contentValues = [
-    'normal',
-    'none',
-    'counter',
-    'open-quote',
-    'close-quote',
-    'no-open-quote',
-    'no-close-quote',
-    'initial',
-    'inherit',
-    'unset'
-  ]
+  let contentValuePattern = /(attr|counters?|url|(((repeating-)?(linear|radial))|conic)-gradient)\(|(no-)?(open|close)-quote/
+  let contentValues = ['normal', 'none', 'initial', 'inherit', 'unset']
 
   let oldProcessStyleValue = processStyleValue