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

React seems to skip rendering semicolon in inline styles. #8986

Closed
moimael opened this issue Feb 13, 2017 · 5 comments
Closed

React seems to skip rendering semicolon in inline styles. #8986

moimael opened this issue Feb 13, 2017 · 5 comments

Comments

@moimael
Copy link

moimael commented Feb 13, 2017

Do you want to request a feature or report a bug?
bug

What is the current behavior?
With SSR we get this warning using inline styles :

Warning: React attempted to reuse markup in a container but the checksum was invalid. This generally means that you are using server rendering and the markup generated on the server was not what the client was expecting. React injected new markup to compensate which works but you have lost many of the benefits of server rendering. Instead, figure out why the markup being generated is different on the client or server:
 (client) ound-position:center;" data-reactid="2">
 (server) ound-position:center" data-reactid="2"><

I'm not sure if the browser is adding the semicolon or if react is skipping it on the server.

What is the expected behavior?
We should not get any warning, markup from client and server should match.

Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?
15.4.2
Chrome / Linux
Firefox / Linux

@gaearon
Copy link
Collaborator

gaearon commented Feb 13, 2017

Can you provide the code reproducing this?

@moimael
Copy link
Author

moimael commented Feb 13, 2017

Since it is using SSR it seems hard to provide a fiddle. I can try to extract the code, but it's basic SSR using renderToString and renderToStaticMarkup.

@moimael
Copy link
Author

moimael commented Feb 13, 2017

To give more precisions, looking at the output of server rendering, React seems to never add a semicolon after the last item in the style attribute.

@gaearon
Copy link
Collaborator

gaearon commented Feb 13, 2017

Maybe you have an HTML minifier that strips the ; on the server?

@moimael
Copy link
Author

moimael commented Feb 13, 2017

Oh yeah you're right, we have html-minifier on the server side. It seems to remove the semicolon. Thanks for your help !

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