ReactMount: Two valid but unequal nodes with the same `%s`: %s

[syranide]

https://github.com/facebook/react/blob/master/src/browser/ui/ReactMount.js#L81

It seems this is mainly the cause of invalid nesting of tags, <a><div /></a>, <table><tr></tr></table>, etc. I know there are some issues/PRs regarding this already but AFAIK they're trying to solve/detect it, it seems reasonable to just improve this (very non-informative) error message in the meantime.

PS. I've probably seen 2-3 people get bitten by it myself now that I think about it.

[sophiebits]

Do you have a repro? I don't think invalid nesting should cause this error.

[syranide]

@spicyj Had a debugging session with skrebbel on IRC who encountered that error, turns out that he had <a><div /></a> and his browser turned it into <a /><div /><a /> and I assume React sometimes happened upon the second <a /> and found that it was not the element it was expecting (i.e, the first).

[sophiebits]

I don't believe browsers will do that for <a> (though they will if there are nested links). But I'm confused because I don't believe the newly-created elements will have data-reactid attributes at all.

[sophiebits]

Here's a demo showing that data-reactid shouldn't end up duplicated in that case:

http://jsbin.com/racecimo/1/edit

Let me know if you see otherwise.

[syranide]

Reproduced it with:

http://jsfiddle.net/kb3gN/1874/

(i.e, yes you shouldn't do that, but it may still make sense to warn that it could be the cause)

[sophiebits]

Curious, thank you.

[syranide]

Same issue:

#1436

[sophiebits]

Another possible cause of this error (just writing here for posterity):

React receiving events on elements that have been removed from the DOM. This shouldn't happen unless there is a bug in React; it happens in 0.9 and 0.10 due to a React bug. The issue has been fixed in master (in c62c2c5 and 3e34739) and will be in the next release.

[sophiebits]

See also #101.

[yoshuawuyts]

I just ran into this issue, it was indeed caused by invalid nesting, e.g.

<a>
  <div>
    <a></a>
  </div>
</a>

[syranide]

Some love for #1987 perhaps :)