rkit / react-select2-wrapper

Wrapper for Select2
MIT License
163 stars 97 forks source link

Testing: Unable to update value in jest/enzyme tests #87

Open CWSites opened 5 years ago

CWSites commented 5 years ago

I'm trying to update the value of a Select2 component, then trigger the onChange to get my test as close to how a real user would.

Component

filterColumns = [
    { text: 'Test', id: 0, value: 'test' },
    { text: 'Foo Bar', id: 1, value: 'foo-bar' }
];

handleInputChange(event) {
     console.log(`${event.currentTarget.name} changed to ${event.currentTarget.value}`);
});
<Select2 jest="filter"
                onChange={this.handleInputChange}
                value={filterArray[i].filter}
                data={this.props.filterColumns} />

Test

Value is never updated, onChange is never called. This is how React + Enzyme say to fire the change event for a select element but it isn't working.

it('addFilter works', () => {
    const wrapper = mount(<CustomFilters filterColumns={filterColumns} />);
    wrapper.find('Select2[jest="filter"]').simulate('change', { target: { value: 'test' } }); 
});

I have also tried the following different ways of updating the value. filterSelect.value = 'test'; filterSelect.instance().value = 'test'; filterSelect.simulate('change');