@emotion/server crash on import in Worker environment

Current behavior:

Looks like @emotion/server always assumes a Node.js environment. However, it is now possible to do SSR in Workers environment (such as Cloudflare Workers). This package breaks on import because some dependencies (html-tokenize) try to access Buffer, Stream, and other Node-only APIs.

I’ve tried to get some of the problems fixed: https://github.com/LinusU/buffer-from/issues/13 However, html-tokenize have other issues.

To reproduce:

Run import createEmotionServer from '@emotion/server/create-instance' in a worker or a browser environment.

It cannot be reproduced in Codesandbox because looks like they add some Node API polyfills (Buffer, etc).

Expected behavior:

It should not crash on import. More specifically, it would be great if there was an ESM build or a way to import only the necessary functions. For example, importing createExtractCriticalToChunks and createConstructStyleTagsFromChunks, and leaving out createRenderStylesToStream, which is the one causing problems and not needed for this use case.

Right now I have this code, which works in Node but not in workers.

[Andarist]

I’d prefer not to mix ESM with require - it’s a can of worms that I prefer closed ;p

[Andarist]

Maybe the simplest solution would be to convert these imports to dynamic import() expressions inside createRenderStylesToNodeStream():

We probably can’t do that because this would taint the whole function - it would have to become async and that would be a breaking change.