Get the "current" Fiber from each node along the path
This fixes the issue where using the .return pointer isn't guaranteed to return the current Fiber so we might read the wrong props when we try to get the current event.
Sebastian Markbage committed
Dec 2, 2016 at 20:03 UTC
ee4984980e7f7b030e2a4b371bb45db294924f3b
4 files changed
+14
-11
scripts/fiber/tests-failing.txt
-4
@@ -27,10 +27,6 @@ src/renderers/art/__tests__/ReactART-test.js
27
src/renderers/dom/__tests__/ReactDOMProduction-test.js
28
* should throw with an error code in production
29
30
-src/renderers/dom/shared/__tests__/ReactBrowserEventEmitter-test.js
31
-* should bubble to the right handler after an update
32
-* should invoke handlers that were removed while bubbling
33
-
30
src/renderers/dom/shared/__tests__/ReactDOM-test.js
31
* throws in render() if the mount callback is not a function
32
* throws in render() if the update callback is not a function
scripts/fiber/tests-passing.txt
+2
@@ -556,11 +556,13 @@ src/renderers/dom/shared/__tests__/ReactBrowserEventEmitter-test.js
556
* should invoke a simple handler registered on a node
557
* should not invoke handlers if ReactBrowserEventEmitter is disabled
558
* should bubble simply
559
+* should bubble to the right handler after an update
560
* should continue bubbling if an error is thrown
561
* should set currentTarget
562
* should support stopPropagation()
563
* should stop after first dispatch if stopPropagation
564
* should not stopPropagation if false is returned
565
+* should invoke handlers that were removed while bubbling
566
* should not invoke newly inserted handlers while bubbling
567
* should have mouse enter simulated by test utils
568
* should infer onTouchTap from a touchStart/End
src/renderers/shared/shared/ReactTreeTraversal.js
+12
-2
@@ -12,6 +12,7 @@
12
'use strict';
13
14
var { HostComponent } = require('ReactTypeOfWork');
15
+var { getNodeFromInstance, getInstanceFromNode } = require('EventPluginUtils');
16
17
function getParent(inst) {
18
if (inst._hostParent !== undefined) {
@@ -22,9 +23,18 @@ function getParent(inst) {
23
inst = inst.return;
24
// TODO: If this is a HostRoot we might want to bail out.
25
// That is depending on if we want nested subtrees (layers) to bubble
25
- // events to their parent.
26
+ // events to their parent. We could also go through parentNode on the
27
+ // host node but that wouldn't work for React Native and doesn't let us
28
+ // do the portal feature.
29
} while (inst && inst.tag !== HostComponent);
27
- return inst;
30
+ // Going through the Host Node will guarantee that we get the "current"
31
+ // Fiber, instead of the alternate because that pointer is updated when
32
+ // props update.
33
+ // TODO: This is a bit hacky and possibly slow. We should ideally have
34
+ // something in the reconciler that allow us to do this safely.
35
+ if (inst) {
36
+ return getInstanceFromNode(getNodeFromInstance(inst));
37
+ }
38
}
39
return null;
40
}
src/renderers/shared/shared/event/EventPluginHub.js
-5
@@ -126,11 +126,6 @@ var EventPluginHub = {
126
// TODO: shouldPreventMouseEvent is DOM-specific and definitely should not
127
// live here; needs to be moved to a better place soon
128
if (typeof inst.tag === 'number') {
129
- // TODO: This is not safe because we might want the *other* Fiber's
130
- // props depending on which is the current one. This will usually be the
131
- // current Fiber but if we're walking up the tree using TreeTraversal for
132
- // bubbling, we will not be guaranteed to walk up the current tree when
133
- // a Fiber has been reused.
129
const props = inst.memoizedProps;
130
listener = props[registrationName];
131
if (shouldPreventMouseEvent(registrationName, inst.type, props)) {