Javascript 如何使用React.createElement（）测试在渲染中创建的子React组件

我正在尝试测试一个定制的react元素，它构建在一些特殊的react元素之上 代码：

此.\u onControlChange基于文本字段值操纵状态。这就是我想要测试的，不同的文本字段输入会触发组件的不同状态

笑话代码：

var customComponent = TestUtils.renderIntoDocument( <CustomField /> );
var customField = TestUtils.findRenderedComponentWithType(customComponent, customField);
TestUtils.Simulate.change(customField, {target: {value: 'Hello, world'}});

var customComponent=TestUtils.renderIntoDocument（）；
var customField=TestUtils.findRenderedComponentWithType（customComponent，customField）；
TestUtils.Simulate.change（customField，{target:{value:'Hello，world'}）；

我尝试为onControlChange模拟函数，看看它是否被调用，它被调用了0次。我还尝试在simulate（）调用前后查看customField变量的状态，但并没有任何变化。我想知道我是否遗漏了一些可以模拟在文本字段中键入的内容

我尝试了所有的选项来选择标签，类型和类，但没有成功。当console.log显示渲染组件时，我可以看到textfield元素。有没有办法通过ref获取TextField的实例？

您似乎误用了。自定义组件中的输入字段实际上是一个

TextField

var txtField = TestUtils.findRenderedComponentWithType(customComponent, TextField);
TestUtils.Simulate.change(txtField, {target: {value: 'Hello, world'}});

---

您还重新定义了

customField

，因此我在这里更改了变量名。

更改事件是在

TextField

组件上处理的，而不是

customField

，对吗？我会尝试

查找类型为（…，TextField）的DeredComponent

。要记住的另一件事是，在React 0.12+中，您需要在自定义JSX组件中使用

，或者JSX将它们视为HTML（因此

而不是

）@BinaryMuse我的代码遵循initialcapitals，我不擅长为问题编写代码。这似乎不是问题所在。使用withTag、withClass等重试…根本找不到子组件。是否有任何方法可以检查呈现的react文档以查看呈现的HTML？示例代码中的“findRenderedComponentWithType”拼写错误为“findRenderedComponentWithType”。无法修改，因为“编辑”必须至少更改6个字符。@VigneshManogar感谢您指出错误，现已修复。对代码的更改建议最好先添加注释，就像您在这里所做的那样。

var txtField = TestUtils.findRenderedComponentWithType(customComponent, TextField);
TestUtils.Simulate.change(txtField, {target: {value: 'Hello, world'}});