react: Incorrect "unable to reuse markup" warning message
React 0.13 improved warning message when it fails to reuse server rendered markup and now shows the exact incorrect part. But it shows wrong part if there are text nodes containing some html-escaped chars (single quotes, double quotes etc.) somewhere before this incorrect part. For example, React shows this message…
(client) sxg4h94hs.2.1.0.1">{"Hi!"
(server) sxg4h94hs.2.1.0.1">"Hi!"
…but this part is ok. The problematic markup (which actually renders differently on client and server) is located after this place in DOM.
If i remove "Hi!" text from the rendered markup, React shows correct warning message and points to the real problematic place.
About this issue
- Original URL
- State: closed
- Created 9 years ago
- Comments: 22 (4 by maintainers)
@spicyj @jordansexton I’m still experiencing this problem. I see the red herring messages related to data attributes such as required vs required=“” but generally the problem is somewhere else in the vicinity. It would be great to somehow improve this error messaging or provide some sort of more robust debugging tools as server rendering is painful enough without these mismatch issues.
Maybe someone can give me advice on best practices as I’m running into issues for mismatch between client and server when components change some props coming from flux bindings based upon initial query params and/or browser storage data. It seems with these mismatch issues I would have to wait to update my flux state until didMount which feels a little over engineered and in efficient since this data is available on the client before mounting the component. Also this is prone to issues with race conditions as maybe some component data depends upon data retrieved from http request if a cookie is present and it is unknown if this data will return before or after component mounting