Does rehype-raw work with react-markdown in Firefox.

[rachelrj]

I am using rehype-raw as a plugin for react-markdown and it seems to be working in Chrome, but not Firefox.
Chrome:

Firefox:

The code is pretty basic usage. I can show more if necessary.

<ReactMarkdown rehypePlugins={[rehypeRaw]}>{text}</ReactMarkdown>

I am using Firefox version 106.0.1 (latest I think)

[ChristianMurphy]

Welcome @rachelrj!

Sorry you ran into a spot of trouble.
It does support Firefox when built to run in a browser.
I created an example with CRA (react-scripts) as the build tool https://stackblitz.com/edit/github-7ztavd?file=src%2Fapp.tsx and opened it in Firefox 106.0.1
Everything rendered as expected.

screenshot

For the issue you're seeing locally, I'd check developer tools in the browser and look for any warning or error messages.
I suspect a build tool may not be configured correctly, but browser logs would likely give more specific idea of what's going wrong.

[rachelrj]

Thank you for the quick reply. I will look at the browser logs. I am not seeing any console errors. But I will look into build tools too. Do you know of any specific build tools that have caused people issues?
This project is using SSR with Next.js. Has this caused people issues?
And thank you for the example that you've included.

[ChristianMurphy]

It should work in Next.js as well.
Here is a sandbox showing next used with react-markdown and rehype-raw https://stackblitz.com/edit/nextjs-qrwmnc?file=pages%2Findex.js

Do you know of any specific build tools that have caused people issues?

Older versions of Next (version 11 and earlier) had some issues with ESM, and by extension react-markdown and rehype-react.
I haven't heard of any major issues popping up using it with Next since version 12 enabled ESM support by default.

This project is using SSR with Next.js. Has this caused people issues?

Maybe?
Is react-markdown being run client side or server side?
I've heard of issues running it fully serverside, because react-markdown renders async, and Next expects all server side rendered content to be fully sync.
But if that was happening, nothing should be rendering, rather than a single plugin causing an issue. 🤔

I am not seeing any console errors

Hmmm, if not the browser console logs. Anything warning in the next.js logs?

[rachelrj]

Thank you again, this was so helpful. We are using version 10 of Next. So that might be the issue. I really do appreciate the help.