Reactjs 反应测试：在组件中查找组件

我可以在下面代码的第一个“查找器”中找到一个组件

var myComponent = ReactTestUtils.findRenderedDOMComponentWithClass(myDiv, 'myComponent')

如果我随后使用返回的组件对象并使用它来查找更深层的对象，如：

var myInput = ReactTestUtils.findRenderedDOMComponentWithClass(myComponent, 'myInput')

我得到这个错误：

不变冲突：findAllInRenderedTree（…）：实例必须是 复合构件 at invariant（node_modules/fbjs/lib/invariant.js:44:15）

我无法确定从FindRenderedomComponentWithClass返回的是什么类型，因为（a）Javascript和（b）ReactTestUtils都有

我的整个测试如下所示：

import ReactTestUtils from 'react-dom/lib/ReactTestUtils';

describe('simple test', function() {

  jsdom({ skipWindowCheck: true });

  it('Getting Simulate to Work', function() {
    class SomeComponent extends React.Component {
      render() {
        return (
          <div className="myComponent">
            <input type="textfield" className="myInput" ></input>
            <span className="child1" />
          </div>
        );
      }
    }
    var myDiv = ReactTestUtils.renderIntoDocument(
      <SomeComponent/>
    );
    var myComponent = ReactTestUtils.findRenderedDOMComponentWithClass(myDiv, 'myComponent')
    var myInput = ReactTestUtils.findRenderedDOMComponentWithClass(myComponent, 'myInput')
  });
});

从'react dom/lib/reactestutils'导入ReactTestUtils'；
描述（'简单测试'，函数（）{
jsdom（{skipWindowCheck:true}）；
它（'开始模拟工作'，函数（）{
类SomeComponent扩展了React.Component{
render（）{
返回(
);
}
}
var myDiv=reactestutils.renderIntoDocument(
);
var myComponent=reactestutils.findrendrededomcomponentwithclass（myDiv，“myComponent”）
var myInput=ReactTestUtils.FindRenderedomComponentWithClass（myComponent，'myInput'）
});
});

之所以出现此错误，是因为

myInput

不是复合组件。这是本机浏览器输入。复合组件是由

React.Component

（不是div、span、输入或按钮等）制成的组件

您可以在输入中添加

ref

：

<input type="textfield" className="myInput" ref="myInput">

并使用

React.findDOMNode

查找它：

React.findDOMNode（this.refs.myInput）

（这里的

this

指的是包含输入的组件实例，这意味着在您的情况下，您需要在某处组件的定义中调用它）

然后，您应该只使用

findRenderededomComponentWithClass

查找属于

React.Component

实例的组件（即，您定义为类并注册为带有React with

类SomeComponent extensed React.Component的组件）