Question

已经浪费了三天试图让这个测试通过。无法找到任何解决方案，它似乎模拟点击不会调用组件功能。

测试用例：

it('checking focus is called', () => {
    const wrapper = shallow(<NexMultiselect {...mock_props} />);

    wrapper.instance().c = {autosuggest: { input: {focus: ()=>{}} }};
    wrapper.instance().focus = jest.fn();
    wrapper.find('.values_container').simulate('click');

    expect(wrapper.instance().focus).toHaveBeenCalled();
});

组件渲染功能：

    return (
        <span className="multiselect">
            { label && id &&
            <div className="form__field-label"><label htmlFor={id}>{label}</label></div> }
            <span onClick={this.focus} className="values_container">
                {renderedValues}
                <NexAutocomplete
                    {...other}
                    onUpdate={this.onSearchUpdate}
                    data={this.state.data}
                    filter={[{
                        searchOn: 'value',
                        display: 'display'
                    }]}
                    value={this.state.inputText}
                    preferValueFromProps={this.state.preferValueFromProps}
                    ref={c => this.c = c}
                    disabled={size && values.length >= size }
                />
            </span>
        </span>
    );

Answer 1

通过将onClick={this.focus}更改为onClick={() => this.focus()}来解决此问题。

这阻止了class method被调用而不是被调用 mock function

模拟事件点击不会调用组件方法Jest / Enzyme

1 个答案: