diff --git a/src/renderers/shared/stack/reconciler/__tests__/ReactMultiChildReconcile-test.js b/src/renderers/shared/stack/reconciler/__tests__/ReactMultiChildReconcile-test.js
index d655536ae8..43977bff1a 100644
--- a/src/renderers/shared/stack/reconciler/__tests__/ReactMultiChildReconcile-test.js
+++ b/src/renderers/shared/stack/reconciler/__tests__/ReactMultiChildReconcile-test.js
@@ -13,13 +13,10 @@
var React = require('React');
var ReactDOM = require('ReactDOM');
-var ReactDOMComponentTree = require('ReactDOMComponentTree');
-var ReactInstanceMap = require('ReactInstanceMap');
var stripEmptyValues = function(obj) {
var ret = {};
- var name;
- for (name in obj) {
+ for (var name in obj) {
if (!obj.hasOwnProperty(name)) {
continue;
}
@@ -30,15 +27,7 @@ var stripEmptyValues = function(obj) {
return ret;
};
-/**
- * Child key names are wrapped like '.$key:0'. We strip the extra chars out
- * here. This relies on an implementation detail of the rendering system.
- */
-var getOriginalKey = function(childName) {
- var match = childName.match(/^\.\$([^.]+)$/);
- expect(match).not.toBeNull();
- return match[1];
-};
+var idCounter = 123;
/**
* Contains internal static internal state in order to test that updates to
@@ -46,15 +35,15 @@ var getOriginalKey = function(childName) {
* reusing existing DOM/memory resources.
*/
class StatusDisplay extends React.Component {
- state = {internalState: Math.random()};
+ state = {internalState: idCounter++};
- getStatus = () => {
+ getStatus() {
return this.props.status;
- };
+ }
- getInternalState = () => {
+ getInternalState() {
return this.state.internalState;
- };
+ }
componentDidMount() {
this.props.onFlush();
@@ -67,7 +56,7 @@ class StatusDisplay extends React.Component {
render() {
return (
- {this.state.internalState}
+ {this.props.contentKey}
);
}
@@ -82,39 +71,29 @@ class FriendsStatusDisplay extends React.Component {
* Refs are not maintained in the rendered order, and neither is
* `this._renderedChildren` (surprisingly).
*/
- getOriginalKeys = () => {
+ getOriginalKeys() {
var originalKeys = [];
- // TODO: Update this to a better test that doesn't rely so much on internal
- // implementation details.
- var statusDisplays =
- ReactInstanceMap.get(this)
- ._renderedComponent
- ._renderedChildren;
- var name;
- for (name in statusDisplays) {
- var child = statusDisplays[name];
- var isPresent = !!child;
- if (isPresent) {
- originalKeys[child._mountIndex] = getOriginalKey(name);
+ for (var key in this.props.usernameToStatus) {
+ if (this.props.usernameToStatus[key]) {
+ originalKeys.push(key);
}
}
return originalKeys;
- };
+ }
/**
* Retrieves the rendered children in a nice format for comparing to the input
* `this.props.usernameToStatus`.
*/
- getStatusDisplays = () => {
+ getStatusDisplays() {
var res = {};
- var i;
var originalKeys = this.getOriginalKeys();
- for (i = 0; i < originalKeys.length; i++) {
+ for (var i = 0; i < originalKeys.length; i++) {
var key = originalKeys[i];
res[key] = this.refs[key];
}
return res;
- };
+ }
/**
* Verifies that by the time a child is flushed, the refs that appeared
@@ -123,10 +102,9 @@ class FriendsStatusDisplay extends React.Component {
* but our internal layer API depends on this assumption. We need to change
* it to be more declarative before making ref resolution indeterministic.
*/
- verifyPreviousRefsResolved = (flushedKey) => {
- var i;
+ verifyPreviousRefsResolved(flushedKey) {
var originalKeys = this.getOriginalKeys();
- for (i = 0; i < originalKeys.length; i++) {
+ for (var i = 0; i < originalKeys.length; i++) {
var key = originalKeys[i];
if (key === flushedKey) {
// We are only interested in children up to the current key.
@@ -134,18 +112,18 @@ class FriendsStatusDisplay extends React.Component {
}
expect(this.refs[key]).toBeTruthy();
}
- };
+ }
render() {
var children = [];
- var key;
- for (key in this.props.usernameToStatus) {
+ for (var key in this.props.usernameToStatus) {
var status = this.props.usernameToStatus[key];
children.push(
!status ? null :
@@ -223,35 +201,33 @@ function verifyStatesPreserved(lastInternalStates, statusDisplays) {
* Verifies that the internal representation of a set of `renderedChildren`
* accurately reflects what is in the DOM.
*/
-function verifyDomOrderingAccurate(parentInstance, statusDisplays) {
- var containerNode = ReactDOM.findDOMNode(parentInstance);
+function verifyDomOrderingAccurate(outerContainer, statusDisplays) {
+ var containerNode = outerContainer.firstChild;
var statusDisplayNodes = containerNode.childNodes;
- var i;
- var orderedDomIDs = [];
- for (i = 0; i < statusDisplayNodes.length; i++) {
- var inst = ReactDOMComponentTree.getInstanceFromNode(statusDisplayNodes[i]);
- orderedDomIDs.push(inst._rootNodeID);
+ var orderedDomKeys = [];
+ for (var i = 0; i < statusDisplayNodes.length; i++) {
+ var contentKey = statusDisplayNodes[i].textContent;
+ orderedDomKeys.push(contentKey);
}
- var orderedLogicalIDs = [];
+ var orderedLogicalKeys = [];
var username;
for (username in statusDisplays) {
if (!statusDisplays.hasOwnProperty(username)) {
continue;
}
var statusDisplay = statusDisplays[username];
- orderedLogicalIDs.push(
- ReactInstanceMap.get(statusDisplay)._renderedComponent._rootNodeID
+ orderedLogicalKeys.push(
+ statusDisplay.props.contentKey
);
}
- expect(orderedDomIDs).toEqual(orderedLogicalIDs);
+ expect(orderedDomKeys).toEqual(orderedLogicalKeys);
}
/**
* Todo: Check that internal state is preserved across transitions
*/
function testPropsSequence(sequence) {
- var i;
var container = document.createElement('div');
var parentInstance = ReactDOM.render(
,
@@ -261,7 +237,7 @@ function testPropsSequence(sequence) {
var lastInternalStates = getInternalStateByUserName(statusDisplays);
verifyStatuses(statusDisplays, sequence[0]);
- for (i = 1; i < sequence.length; i++) {
+ for (var i = 1; i < sequence.length; i++) {
ReactDOM.render(
,
container
@@ -269,7 +245,7 @@ function testPropsSequence(sequence) {
statusDisplays = parentInstance.getStatusDisplays();
verifyStatuses(statusDisplays, sequence[i]);
verifyStatesPreserved(lastInternalStates, statusDisplays);
- verifyDomOrderingAccurate(parentInstance, statusDisplays);
+ verifyDomOrderingAccurate(container, statusDisplays);
lastInternalStates = getInternalStateByUserName(statusDisplays);
}
diff --git a/src/renderers/shared/stack/reconciler/__tests__/ReactMultiChildText-test.js b/src/renderers/shared/stack/reconciler/__tests__/ReactMultiChildText-test.js
index 3db920e6be..57d4331d59 100644
--- a/src/renderers/shared/stack/reconciler/__tests__/ReactMultiChildText-test.js
+++ b/src/renderers/shared/stack/reconciler/__tests__/ReactMultiChildText-test.js
@@ -26,17 +26,17 @@ var testAllPermutations = function(testCases) {
var expectedResultAfterUpdate = testCases[j + 1];
var container = document.createElement('div');
- var d = ReactDOM.render({renderWithChildren}
, container);
- expectChildren(d, expectedResultAfterRender);
+ ReactDOM.render({renderWithChildren}
, container);
+ expectChildren(container, expectedResultAfterRender);
- d = ReactDOM.render({updateWithChildren}
, container);
- expectChildren(d, expectedResultAfterUpdate);
+ ReactDOM.render({updateWithChildren}
, container);
+ expectChildren(container, expectedResultAfterUpdate);
}
}
};
-var expectChildren = function(d, children) {
- var outerNode = ReactDOM.findDOMNode(d);
+var expectChildren = function(container, children) {
+ var outerNode = container.firstChild;
var textNode;
if (typeof children === 'string') {
textNode = outerNode.firstChild;