Add Fibers to ReactTreeTraversal

This traverses parent based on the type of internal instance it is passed.
If it is a Fiber it may have to traverse multiple steps until it finds a
HostComponent.

This will allow us to use the event system with Fiber.

scripts/fiber/tests-failing.txt

@@ -11,13 +11,6 @@ src/addons/__tests__/renderSubtreeIntoContainer-test.js
 * should update context if it changes due to setState
 * should update context if it changes due to re-render
 
-src/addons/transitions/__tests__/ReactCSSTransitionGroup-test.js
-* should clean-up silently after the timeout elapses
-* should keep both sets of DOM nodes around
-* should switch transitionLeave from false to true
-* should transition from one to null
-* should transition from false to one
-
 src/isomorphic/classic/__tests__/ReactContextValidator-test.js
 * should pass previous context to lifecycles
 
@@ -388,17 +381,6 @@ src/renderers/shared/hooks/__tests__/ReactHostOperationHistoryHook-test.js
 * gets reported when a child is inserted
 * gets reported when a child is removed
 
-src/renderers/shared/shared/__tests__/ReactTreeTraversal-test.js
-* should traverse two phase across component boundary
-* should traverse two phase at shallowest node
-* should traverse enter/leave to sibling - avoids parent
-* should traverse enter/leave to parent - avoids parent
-* should enter from the window
-* should enter from the window to the shallowest
-* should leave to the window
-* should leave to the window from the shallowest
-* should determine the first common ancestor correctly
-
 src/renderers/shared/shared/event/__tests__/EventPluginHub-test.js
 * should prevent non-function listeners, at dispatch
 * should not prevent null listeners, at dispatch

scripts/fiber/tests-passing.txt

@@ -75,8 +75,13 @@ src/addons/__tests__/update-test.js
 src/addons/transitions/__tests__/ReactCSSTransitionGroup-test.js
 * should warn if timeouts aren't specified
 * should not warn if timeouts is zero
+* should clean-up silently after the timeout elapses
+* should keep both sets of DOM nodes around
+* should switch transitionLeave from false to true
 * should work with no children
 * should work with a null child
+* should transition from one to null
+* should transition from false to one
 * should use transition-type specific names when they're provided
 * should clear transition timeouts when unmounted
 * should handle unmounted elements properly
@@ -963,8 +968,17 @@ src/renderers/shared/hooks/__tests__/ReactHostOperationHistoryHook-test.js
 
 src/renderers/shared/shared/__tests__/ReactTreeTraversal-test.js
 * should not traverse when traversing outside DOM
+* should traverse two phase across component boundary
+* should traverse two phase at shallowest node
 * should not traverse when enter/leaving outside DOM
 * should not traverse if enter/leave the same node
+* should traverse enter/leave to sibling - avoids parent
+* should traverse enter/leave to parent - avoids parent
+* should enter from the window
+* should enter from the window to the shallowest
+* should leave to the window
+* should leave to the window from the shallowest
+* should determine the first common ancestor correctly
 
 src/renderers/shared/shared/event/__tests__/EventPluginRegistry-test.js
 * should be able to inject ordering before plugins

src/renderers/dom/fiber/ReactDOMFiber.js

@@ -75,6 +75,9 @@ var DOMRenderer = ReactFiberReconciler({
                typeof props.dangerouslySetInnerHTML.__html === 'string') {
       domElement.innerHTML = props.dangerouslySetInnerHTML.__html;
     }
+    if (typeof props.id === 'string') {
+      domElement.id = props.id;
+    }
     return domElement;
   },
 
@@ -99,6 +102,9 @@ var DOMRenderer = ReactFiberReconciler({
                typeof newProps.dangerouslySetInnerHTML.__html === 'string') {
       domElement.innerHTML = newProps.dangerouslySetInnerHTML.__html;
     }
+    if (typeof newProps.id === 'string') {
+      domElement.id = newProps.id;
+    }
   },
 
   createTextInstance(text : string, internalInstanceHandle : Object) : TextInstance {

src/renderers/shared/shared/ReactTreeTraversal.js

@@ -11,29 +11,47 @@
 
 'use strict';
 
+var { HostComponent } = require('ReactTypeOfWork');
+
+function getParent(inst) {
+  if (inst._hostParent !== undefined) {
+    return inst._hostParent;
+  }
+  if (typeof inst.tag === 'number') {
+    do {
+      inst = inst.return;
+      // TODO: If this is a HostContainer we might want to bail out.
+      // That is depending on if we want nested subtrees (layers) to bubble
+      // events to their parent.
+    } while (inst && inst.tag !== HostComponent);
+    return inst;
+  }
+  return null;
+}
+
 /**
  * Return the lowest common ancestor of A and B, or null if they are in
  * different trees.
  */
 function getLowestCommonAncestor(instA, instB) {
   var depthA = 0;
-  for (var tempA = instA; tempA; tempA = tempA._hostParent) {
+  for (var tempA = instA; tempA; tempA = getParent(tempA)) {
     depthA++;
   }
   var depthB = 0;
-  for (var tempB = instB; tempB; tempB = tempB._hostParent) {
+  for (var tempB = instB; tempB; tempB = getParent(tempB)) {
     depthB++;
   }
 
   // If A is deeper, crawl up.
   while (depthA - depthB > 0) {
-    instA = instA._hostParent;
+    instA = getParent(instA);
     depthA--;
   }
 
   // If B is deeper, crawl up.
   while (depthB - depthA > 0) {
-    instB = instB._hostParent;
+    instB = getParent(instB);
     depthB--;
   }
 
@@ -43,8 +61,8 @@ function getLowestCommonAncestor(instA, instB) {
     if (instA === instB) {
       return instA;
     }
-    instA = instA._hostParent;
-    instB = instB._hostParent;
+    instA = getParent(instA);
+    instB = getParent(instB);
   }
   return null;
 }
@@ -57,7 +75,7 @@ function isAncestor(instA, instB) {
     if (instB === instA) {
       return true;
     }
-    instB = instB._hostParent;
+    instB = getParent(instB);
   }
   return false;
 }
@@ -66,7 +84,7 @@ function isAncestor(instA, instB) {
  * Return the parent instance of the passed-in instance.
  */
 function getParentInstance(inst) {
-  return inst._hostParent;
+  return getParent(inst);
 }
 
 /**
@@ -76,7 +94,7 @@ function traverseTwoPhase(inst, fn, arg) {
   var path = [];
   while (inst) {
     path.push(inst);
-    inst = inst._hostParent;
+    inst = getParent(inst);
   }
   var i;
   for (i = path.length; i-- > 0;) {
@@ -99,12 +117,12 @@ function traverseEnterLeave(from, to, fn, argFrom, argTo) {
   var pathFrom = [];
   while (from && from !== common) {
     pathFrom.push(from);
-    from = from._hostParent;
+    from = getParent(from);
   }
   var pathTo = [];
   while (to && to !== common) {
     pathTo.push(to);
-    to = to._hostParent;
+    to = getParent(to);
   }
   var i;
   for (i = 0; i < pathFrom.length; i++) {