Is it possible to create a emotion cache in the Server mode on browser?

Current behavior: Use emotion cache with @emotion/server cannot extract CSS on the browser.

To reproduce:

https://codesandbox.io/s/emotion-issue-template-forked-ij0lf7?file=/src/main.jsx

Expected behavior: I want to run SSR in browser

Environment information:

• react version: 17
• @emotion/react version: 11

[Andarist]

I didn’t have much time to think how I’d like to handle this. It is something that I’d like to get fixed, one way or another - but I can’t promise any deadlines for this. While this is annoying I think there are some higher priority issues to be handled in relation to React 18 and I didn’t have time to give my attention to them either.

The ideal solution here would solve this somehow without adding all of the “server-side” code to the default browser bundles (and that is a tricky part of this problem). I encourage any attempts to make it work and I promise to review PRs implementing this.

[Jack-Works]

Same code, works in React 17 but not in 18

React 17: https://codesandbox.io/s/emotion-issue-template-forked-ih4od6?file=/src/main.jsx React 18: https://codesandbox.io/s/emotion-issue-template-forked-dn5dqr?file=/src/main.jsx