From 26e4e3e8b68479f0e3cb8fbec723da47afd6ac98 Mon Sep 17 00:00:00 2001 From: Sam Magura Date: Thu, 28 Apr 2022 17:44:10 -0400 Subject: [PATCH] Update "no component selectors" error message (#2727) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Update "no component selectors" error message The message now references the swc Emotion plugin which also supports component selectors, like @emotion/babel-plugin. * Add changeset for "no component selecters" error message change * Update .changeset/big-years-relate.md Co-authored-by: Mateusz Burzyński --- .changeset/big-years-relate.md | 5 +++++ .../test/no-babel/__snapshots__/index.test.js.snap | 4 ++-- packages/serialize/src/index.js | 13 +++++++------ 3 files changed, 14 insertions(+), 8 deletions(-) create mode 100644 .changeset/big-years-relate.md diff --git a/.changeset/big-years-relate.md b/.changeset/big-years-relate.md new file mode 100644 index 000000000..29c7e30b0 --- /dev/null +++ b/.changeset/big-years-relate.md @@ -0,0 +1,5 @@ +--- +'@emotion/serialize': patch +--- + +Changed the error message "Component selectors can only be used in conjunction with @emotion/babel-plugin" to reference the new SWC Emotion plugin which will support component selectors soon. diff --git a/packages/css/test/no-babel/__snapshots__/index.test.js.snap b/packages/css/test/no-babel/__snapshots__/index.test.js.snap index 15f8e46f8..46b809fff 100644 --- a/packages/css/test/no-babel/__snapshots__/index.test.js.snap +++ b/packages/css/test/no-babel/__snapshots__/index.test.js.snap @@ -12,11 +12,11 @@ exports[`css @supports 1`] = ` /> `; -exports[`css component as selectors (object syntax) 1`] = `"Component selectors can only be used in conjunction with @emotion/babel-plugin."`; +exports[`css component as selectors (object syntax) 1`] = `"Component selectors can only be used in conjunction with @emotion/babel-plugin, the swc Emotion plugin, or another Emotion-aware compiler transform."`; exports[`css component as selectors (object syntax) 2`] = `"The above error occurred in the component:"`; -exports[`css component selectors without target 1`] = `"Component selectors can only be used in conjunction with @emotion/babel-plugin."`; +exports[`css component selectors without target 1`] = `"Component selectors can only be used in conjunction with @emotion/babel-plugin, the swc Emotion plugin, or another Emotion-aware compiler transform."`; exports[`css composition 1`] = ` .emotion-0 { diff --git a/packages/serialize/src/index.js b/packages/serialize/src/index.js index 08bb1067d..d27f510dd 100644 --- a/packages/serialize/src/index.js +++ b/packages/serialize/src/index.js @@ -106,6 +106,11 @@ if (process.env.NODE_ENV !== 'production') { } } +const noComponentSelectorMessage = + 'Component selectors can only be used in conjunction with ' + + '@emotion/babel-plugin, the swc Emotion plugin, or another Emotion-aware ' + + 'compiler transform.' + function handleInterpolation( mergedProps: void | Object, registered: RegisteredCache | void, @@ -119,9 +124,7 @@ function handleInterpolation( process.env.NODE_ENV !== 'production' && interpolation.toString() === 'NO_COMPONENT_SELECTOR' ) { - throw new Error( - 'Component selectors can only be used in conjunction with @emotion/babel-plugin.' - ) + throw new Error(noComponentSelectorMessage) } return interpolation } @@ -247,9 +250,7 @@ function createStringFromObject( key === 'NO_COMPONENT_SELECTOR' && process.env.NODE_ENV !== 'production' ) { - throw new Error( - 'Component selectors can only be used in conjunction with @emotion/babel-plugin.' - ) + throw new Error(noComponentSelectorMessage) } if ( Array.isArray(value) &&