Skip to content

scryRenderedDOMComponents* does not return in DOM order #2978

@brandonhorst

Description

@brandonhorst

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
});

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions