使用 Enzyme、Sinon 和 ChainonChange 测试 onChange 不被调用？

Question

我正在尝试为rc-select编写一些测试。我想做的测试是检查 onChange 函数是否被调用。到目前为止我所拥有的：测试组件，使用 rc-select 的样式版本：ReactSelectTestComponent.jsximport React from 'react';import Select from '../../packages/lab/src/select/Select.jsx';const ReactSelectTestComponent = (props) => {    const { options } = props;    const onChange = (event) => {        if (props.onChange) {            props.onChange(event)        }    }    return (        <div>            <Select                name='test'                value='one'                options={options}                onChange={onChange}            />        </div >    )}export default ReactSelectTestComponent;选择.test.js：import SelectTestComponent from './SelectTestComponent'import sinon from 'sinon';import { expect as chaiExpect } from 'chai';  // Using Expect styledescribe('Testing Select component', () => {    it('should call onChange', () => {        const onChange = sinon.spy();        const options =            [                { label: 'one', value: 'one' },                { label: 'two', value: 'two' }            ];        const wrapper = mount(<SelectTestComponent onChange={onChange} options={options} />);        console.log("wrapper.debug()", wrapper.debug())        const selectWrapper = wrapper.find('Select').first();        selectWrapper.simulate('change', { target: { value: "testtest" } })        selectWrapper.update()        chaiExpect(onChange.called).to.be.true;    });})但是，我收到此错误。Expected value   true    Received:      false        Message:      expected false to be true      38 |         selectWrapper.update()      39 |     > 40 |         chaiExpect(onChange.called).to.be.true;         |         ^      41 |     });      42 |       43 |     /*      at Object.<anonymous> (tests/src/Select.test.js:40:9)我应该在 find() 调用中使用另一个选择器吗？我觉得我已经尝试了所有的选择。

Answer 1

工作测试：（需要通过包装器的 props 调用 onChange。

    it("Checking if onChange prop function is called", () => {

        const onChange = sinon.spy();

        const wrapper = mount(

            <SelectTestComponent onChange={onChange} options={options} />

        );

        const func = wrapper.find("Select").props().onChange;

        console.log(wrapper.find("Select").props());

        func({ target: { value: "test" } });

        chaiExpect(onChange.called).to.be.true;

    });