nfl / react-helmet

A document head manager for React
MIT License
17.4k stars 660 forks source link

SSR tags get replaced on first render #98

Open lemonCMS opened 8 years ago

lemonCMS commented 8 years ago

Hello,

Thanx for this great library and the fix for FOUC.

Thast said, there is still a very small problem when using SSR + Client react When using toComponent on the server render.

{head.title.toComponent()}
{head.meta.toComponent()}
{head.link.toComponent()}
{head.script.toComponent()}

The function will output a Element with the data-reactid attribute.

The when react is run on the client, these tags will then be replaced because the equation in updateTags failes return newElement.isEqualNode(existingTag);.

Because the new tag does not have adata-reactid attribute.

In the dropin replacement i created when there was that FOUC problem i could fix this, by removing the data-reactid attribute from the existing tags. (https://github.com/lemonCMS/react-helmet/blob/master/README.md). I hope this can help you.

Kind regards Raymond

cwelch5 commented 8 years ago

Thanks, good find. Sounds like stripping out the data-reactid in updateTags, when that attribute exists, would be a good solution.

potench commented 8 years ago

@lemonCMS are you planning on PRing this change? https://github.com/lemonCMS/react-helmet/commit/8efd8a55e89d2a7f0915dc563e3b09a2fe43988b

jonjaques commented 8 years ago

Heyo, so I tried rebasing @lemonCMS commit on top of HEAD and had some issues; it also didn't appear to fix the issue. (Also sorry for the reference spam)

I got this error when trying to build it against react@15.0.1, and babel@6:

warning.js:44 Warning: Element: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://fb.me/react-special-props)

That may be unrelated though, as I'm depending on this inside of my protium package and npm-link is weird. Will continue to investigate, but would be awesome if someone who was already setup to build this could try it out (it's a very small change).