Fix mouseenter handlers fired twice

[yuanoook]

The bug

mouseenter handler gets fired twice, in a component ReactDOM.render-ed in another component.

ReactDOM.render(<AnotherComponent />, hostEl, () => {
  ReactDOM.render(<AComponentMouseEnterWronglyFiredTwice />, hostEl.childNodes[1]);
});

function AComponentMouseEnterWronglyFiredTwice() {
     return (<>
        <div
            onMouseEnter={() => {console.log('You may see this twice');}}
        >
            Move mouse TO here
        </div>
        <div>Move mouse FROM here</div>
     </>)
}

The bug issue #16763
The reproduction demo https://codesandbox.io/s/hungry-field-kgkli

The cause

For any event happened in ReactDOM.render-ed component in another component.
In function handleTopLevel(bookKeeping) {...}, we'll get two ancestors (at least) for bookKeeping.

It's ok for most of the events, but mouseenter is different.
mouseenter is extracted out from mouseout/mouseover.

When mouseout gets dealt twice in handleTopLevel in the situation above, mouseenter gets fired twice on the same node.

The fix

EnterLeaveEventPlugin.js

extractEvents(...) {
    ...
    if (isOutEvent && from && nativeEventTarget !== fromNode) {
      return [leave];
    }
    return [leave, enter];
}

[sizebot]

Details of bundled changes.

Comparing: cdbfa50...3fed177

react-dom

File	Filesize Diff	Gzip Diff	Prev Size	Current Size	Prev Gzip	Current Gzip	ENV
react-dom.profiling.min.js	0.0%	+0.1%	117.34 KB	117.37 KB	36.96 KB	36.99 KB	NODE_PROFILING
react-dom-server.browser.development.js	0.0%	0.0%	142.1 KB	142.1 KB	37.12 KB	37.12 KB	UMD_DEV
ReactDOM-dev.js	0.0%	0.0%	958.53 KB	958.62 KB	211.05 KB	211.07 KB	FB_WWW_DEV
react-dom-test-utils.production.min.js	0.0%	0.0%	11.19 KB	11.19 KB	4.16 KB	4.16 KB	UMD_PROD
react-dom-test-utils.development.js	0.0%	-0.0%	55.73 KB	55.73 KB	15.49 KB	15.49 KB	NODE_DEV
react-dom-test-utils.production.min.js	0.0%	🔺+0.1%	10.96 KB	10.96 KB	4.09 KB	4.09 KB	NODE_PROD
react-dom.development.js	0.0%	0.0%	933.73 KB	933.82 KB	210.43 KB	210.45 KB	UMD_DEV
react-dom.production.min.js	0.0%	0.0%	113.68 KB	113.71 KB	36.65 KB	36.66 KB	UMD_PROD
react-dom.profiling.min.js	0.0%	+0.1%	117.23 KB	117.27 KB	37.67 KB	37.69 KB	UMD_PROFILING
react-dom.development.js	0.0%	0.0%	927.81 KB	927.9 KB	208.81 KB	208.83 KB	NODE_DEV
react-dom.production.min.js	0.0%	0.0%	113.61 KB	113.63 KB	35.96 KB	35.97 KB	NODE_PROD
ReactDOM-prod.js	-0.1%	0.0%	381.1 KB	380.8 KB	69.51 KB	69.52 KB	FB_WWW_PROD
ReactDOM-profiling.js	-0.1%	0.0%	387.04 KB	386.74 KB	70.55 KB	70.57 KB	FB_WWW_PROFILING
react-dom-server.browser.development.js	0.0%	0.0%	138.04 KB	138.04 KB	36.11 KB	36.11 KB	NODE_DEV
react-dom-unstable-native-dependencies.development.js	0.0%	-0.0%	60.71 KB	60.71 KB	15.84 KB	15.84 KB	UMD_DEV
react-dom-unstable-fizz.node.development.js	0.0%	-0.1%	3.87 KB	3.87 KB	1.51 KB	1.51 KB	NODE_DEV

Generated by 🚫 dangerJS against 3fed177

[trueadm]

This is a really good fix – I can confirm that this is indeed an issue. Thank you for this fix and the repro cases!