SSR Hydration issue when email (text) is present in html content

[lorenzo-bluebik]

Thanks so much for this wonderful package.

Working with React@18.2.0 in SSR, it seems that when an email address (in text) is present in the html content rendered, it causes a hydration issue.

Interweave SSR polyfill is in place, so everything works as expected. There isn't an actual problem with the text itself, they are both rendered the same in both client and server.

For some peculiar reason though, when using say something like this:

cont html = "<div class=\"container-fluid p-6\"><h1>Some text with an email address example@example.com as text</h1></div>"
<Markup content={html} />

React will through a Hydration error, saying text is different between server and client (when it's actually the same): Hydration error: Server: "Some text with an email address " (note that server text stops the text in the error right before the whole address) Client: "Some text with an email address example@example.com as text"

When the email is inside an <a> tag it works fine. This works:

cont html = "<div class=\"container-fluid p-6\"><h1>Some text with an email address <a href=\"example@example.com\">example@example.com</a> as text</h1></div>"
<Markup content={html} />

And this works too (without the email in text):

cont html = "<div class=\"container-fluid p-6\"><h1>Some text without an email address as text</h1></div>"
<Markup content={html} />