Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Deno SSR/SSG support #690

Closed
shishkin opened this issue Jan 18, 2023 · 7 comments
Closed

Deno SSR/SSG support #690

shishkin opened this issue Jan 18, 2023 · 7 comments

Comments

@shishkin
Copy link

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/[email protected]/node/_utils.ts:23:9)
    at Object.isContext (https://deno.land/[email protected]/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
Copy link

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
Copy link
Member

magicmatatjahu commented Jan 19, 2023

@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
Copy link
Author

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
Copy link
Member

@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
Copy link
Author

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 #692.

@magicmatatjahu
Copy link
Member

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

@shishkin
Copy link
Author

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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants