Only reuse server-rendered React nodes if there are no unexpected siblings #1912
Conversation
|
what should i expect if i use server side to render version of the page which wasn't done with react that anyway is a bit different from the react server? |
|
@oriSomething React require identical markup to reuse server-render nodes, but that is not what this PR addresses, this is just about an edge-case some people have gotten confused by. |
|
This throws if you have any existing markup in the element, regardless of if it was produced using React's server rendering? Seems a little aggressive. |
@spicyj :) |
|
Can you add a test for that? |
src/browser/ui/ReactMount.js
Outdated
There was a problem hiding this comment.
this should really be a warning since it's dev-only.
There was a problem hiding this comment.
Can do, I was a bit unsure and did a quick search, found a file using invariant in dev and didn't think more about it. We really should allow people to turn some warnings into errors though, because this is a clear case of "you really don't want to do/miss this".
There was a problem hiding this comment.
Fixed (wups, gotta fix test too, EDIT: fixed).
There was a problem hiding this comment.
What file does dev-only invariants?
There was a problem hiding this comment.
|
@spicyj Added. |
Warn if mounting into node with dirty rendered markup
4 participants
PR for #996
I choose to believe that users should be correcting their own "mistakes", rather than have React transparently fix and unknowingly introduce weird edge-cases and visual artifacts.
Quite simply, this PR enforces that there are no other nodes except the node rendered by React inside the target, it obviously does not warn if there isn't a node rendered by React inside the target. It only performs this check in DEV.
There is another test in #1903 which complements this PR.