Question

所以我有一个选择下拉菜单，用户可以在其中选择省份列表。

                    <select
                        className="province-select"
                        onChange={this.regionSelected}
                    >
                        <option>
                            Ontario
                        </option>
                        <option>
                            Quebec
                        </option>
                    </select>

在单元测试中，我想触发on change事件并检查是否按预期调用了this.regionSelected

const wrapperSuccess = shallow(<RegionSelector {...validData} />);

        wrapperSuccess.find(".province-select").simulate('change', { target: { value: 'Ontario' } });

我的RegionSelector组件在实际环境中运行并很有趣。但是，当我运行上面的单元测试时，出现以下错误：

无法读取未定义的属性“目标”

setCurrentRegion(e.target.value)

setCurrentRegion是代码的第一行，它在更改处理程序函数this.regionSelected中调用e.target.value。我检查了酶的文档以及其他几个堆栈溢出的答案，他们都说要传入第二个事件对象。但我是！仍然找不到e.target。我想念什么？谢谢

Answer 1

好！弄清楚了。看来原因是因为eventHandler是组件本身上的一个方法。如果这是通过props传递的eventHandler，那就没问题了。但是由于某种原因，即使通过将第二个参数传递给simulate（）函数，也使用jest的shallow（），eventHandler不会接收到它。我通过监视组件本身的原型来解决了这个问题，这似乎可行

尽管将第二个参数传递给了酶的.simulate（）

1 个答案: