Deno SSR/SSG support

[shishkin]

I've searched for similar issues but could not find anything. I'm trying to get this component work on Deno with Lume. I followed the Next.js guide with @asyncapi/react-component loaded via esm.sh. But I ran into issues with dependencies like JSDOM, isomorphic-dompurify and react-icons. While I was able to replace react-icons with https://github.com/UrielCh/react-icons, I'm stuck with JSDOM and isomorphic-dompurify.

JSDOM calls into unsupported Deno API:

error: Uncaught Error: Not implemented: isContext
  throw new Error(message);
        ^
    at notImplemented (https://deno.land/std@0.173.0/node/_utils.ts:23:9)
    at Object.isContext (https://deno.land/std@0.173.0/node/vm.ts:62:3)
    at new Window (file:///.../node_modules/jsdom/lib/jsdom/browser/Window.js:253:10)
    at exports.createWindow (file:///.../node_modules/jsdom/lib/jsdom/browser/Window.js:95:10)
    at new JSDOM (file:///.../node_modules/jsdom/lib/api.js:36:20)
    at file:///.../node_modules/isomorphic-dompurify/index.js:1:402
    ...

And isomorphic-dompurify seems to have messed up export maps.

So, this is not a "bug" against this project but merely a call for help and maybe a suggestion to add a test case for the component to render in Deno. All help is appreciated.

[github-actions[bot]]

Welcome to AsyncAPI. Thanks a lot for reporting your first issue. Please check out our contributors guide and the instructions about a basic recommended setup useful for opening a pull request.
Keep in mind there are also other channels you can use to interact with AsyncAPI community. For more details check out this issue.

[magicmatatjahu]

@shishkin Component doesn't use JSDOM internally, it's a problem with isomorphic-dompurify - https://github.com/kkomelin/isomorphic-dompurify/blob/master/package.json#L35 Only what can I suggest to override the sanitize function exported by isomorphic-dompurify (ref: https://github.com/asyncapi/asyncapi-react/blob/next/library/src/components/Markdown.tsx#L17) and to something like that:

function sanitize(html: string) { 
  return html; 
}`

of course you need to remember that it's not the safe. Another option is to find some equivalent for jsdom (and maybe for isomorphic-dompurify) in Deno ecosystem.

[shishkin]

I see. I guess isomorphic-dompurify should support native ES imports. I'll create an issue there.

And would it be possible to remove react-icons? I think this package is an overkill for the single us of HiChevronRight. It can easily be replaced with just an angle bracket or static SVG:

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m8.25 4.5l7.5 7.5l-7.5 7.5"/></svg>

[magicmatatjahu]

@shishkin

And would it be possible to remove react-icons? I think this package is an overkill for the single us of HiChevronRight. It can easily be replaced with just an angle bracket or static SVG:

We can, however component is treeshakable https://github.com/asyncapi/asyncapi-react/blob/next/library/package.json#L42, so it means that for bundled apps we only leave HiChevronRight icon. Do you want open issue/PR for that?

[shishkin]

We can, however component is treeshakable https://github.com/asyncapi/asyncapi-react/blob/next/library/package.json#L42, so it means that for bundled apps we only leave HiChevronRight icon.

Yes, I understand the total bundle only has that single SVG. I still think it's worth minimizing dependencies, especially in the ESM world.

Do you want open issue/PR for that?

Submitted https://github.com/asyncapi/asyncapi-react/pull/692.

[magicmatatjahu]

@shishkin Can we close that issue, or you wanna wait for fixing ESM problem in the isomorphic-dompurify package? :)

[shishkin]

Yes, we can close this now. I was finally able to server-render this component on Deno by overriding dependencies.

I've filed an issue to isomorphic-dompurify but it seems more complex to resolve in isomorphic case though.