using react-markdown inside a docker container makes all the content to be rendered inside H2

[Beslinda]

Using react-markdown inside a docker container makes all the content to be rendered inside the header

I am using react-markdown locally and the markdown is parsed correctly into html. When building the project inside a docker container the entire .md content goes inside the header h2 therefor the entire content gets the style of the header. Has anyone stumbled across this issue ?

What could cause this buggy behaviour ?

Your environment

• Node:15.13-alpine
• nginx:1.17-alpine

Steps to reproduce

Take any .md file and create a docker image out of it.

Expected behavior

The .md content should be parsed correctly as shown in the image:

Actual behavior

The entire content gets rendered inside the header h2.

[wooorm]

react-markdown doesn’t have anything to do with docker containers. Nor do I expect docker containers to affect react-markdown.
You are most likely using ReactMarkdown inside an h2 element.

[Beslinda]

No, I do not use it inside h2 element. As I mentioned above when running it locally the markup is rendered correctly but when I build the project inside a docker container that uses node 15, the content is rendered inside h2 for some reason . h2 element is created by react-markdown, see the screenshot below:

[ChristianMurphy]

Thanks for reaching out @Beslinda! Sorry you've run into a spot of trouble.
As @wooorm alluded to, react-markdown runs in the browser, what server it runs on generally doesn't impact how it works.

Some things which could impact how it runs:

1. Different versions of react-markdown being used locally vs in docker, using npm ls | grep react-markdown could help check the version being used, to compare environments
2. react-markdown could be mounted into a different document, as @wooorm noted, there could be an h2 in the surrounding document in one environment not the other.
3. The source content/markdown passed to react-markdown could be different, adding a console.log of the content could help detect any differences.
4. Different builds could be done for development vs production, if a production build is done locally does it have the same result as the build within the Docker container?

[github-actions]

Hi team! Could you describe why this has been marked as external?

Thanks,
— bb

[wooorm]

Closing as this is highly unlikely a problem with react-markdown. Christian’s suggestions can probably lead you to where the problem actually is.