In the code below, I am testing a component that is a simple list. I initialize with props that result in one node. Then, I setProps to add another node before it. Then, I get both of them using scryRenderedDOMComponentsWithClass. In the DOM, test1 comes before test2, but in the scry results, that is not true. It appears to be returning the node which was inserted first.
var CommentList = React.createClass({
render: function() {
var commentNodes = this.props.data.map(function (text) {
return (
<div className="comment" key={text}>{text}</div>
);
});
return (
<div className="commentList">
{commentNodes}
</div>
);
}
});
var data1 = ['test2'];
var data2 = ['test1', 'test2'];
var node = TestUtils.renderIntoDocument(<CommentList data={data1} />);
node.setProps({data: data2}, function () {
var comments = TestUtils.scryRenderedDOMComponentsWithClass(node, 'comment');
console.log(comments[0].getDOMNode().innerHTML); //prints test2
console.log(comments[1].getDOMNode().innerHTML); //prints test1
});
In the code below, I am testing a component that is a simple list. I initialize with props that result in one node. Then, I
setPropsto add another node before it. Then, I get both of them usingscryRenderedDOMComponentsWithClass. In the DOM,test1comes beforetest2, but in thescryresults, that is not true. It appears to be returning the node which was inserted first.