我正在尝试测试一些formik的select元素,并且模拟更改无效。
对于formik的输入元素,相同的模拟更改效果很好。
组件:
<Field
type="text"
name={'clientsData.language1_id'}
className={this.props.classes.textField}
label="Primary Language"
select
margin="normal"
variant="outlined"
component={TextField}
InputLabelProps={{
shrink: true
}}>
}}>
{this.props.languages.map(val => (
<MenuItem key={val.id} value={val.id}>
{val.value}
</MenuItem>
))}
</Field>
包装盒:
wrapper = mount(
<Router history={hist}>
<ClientsContacts
clientsData={clientsData}
languages={languages}
gender={gender}
race={race}
genders_identified={genderIdentified}
actions={{ getDictionaryApiCall: mockGetDictionaryApiCall, getListApiCall: mockGetListApiCall }}
/>
</Router>
)
模拟更改和一些控制台日志以更好地理解:
console.log(
wrapper
// .find('Select')
.find('input')
.at(6)
.debug()
)
wrapper
.find('input')
.at(6)
.simulate('change', { target: { value: '122344556644', name: 'clientsData.language1_id' } })
console.log(
wrapper
.find('input')
.at(6)
.props()
)
console.log的屏幕截图:
上面的控制台日志屏幕快照显示,即使进行模拟更改,值也不会更改。
答案 0 :(得分:0)
我能够直接使用props.onChange来解决它
wrapper
.find('SelectInput')
.at(0)
.props()
.onChange({ target: { id: 1, value: 'American Sign Language', name: 'clientsData.language1_id' } })
wrapper.update()