笑话+酶:不;t更新材料输入值

Question

我正在使用jest和酶测试一个材料UI TextField。在文本字段上模拟更改事件后，该值不会更新。在无状态组件中进行测试时，我是否遗漏了什么？

textfield.spec.js

it("on input change should call onChange function passed through props",()=>{
const handleChange = jest.fn();
let props = {
label: 'Test Label',
type: 'text',
name: 'email',
value: "Hello World",
index: 0,
input: {},
defaultValue:'default',
meta: {
touched: true,
error: 'error'
},
onChange:handleChange,
}
const wrapper = mount(<Textfield {...props}/>);
wrapper.find('input').simulate('change',{target:{name:'email',value:"hello"}});
wrapper.update();
expect(handleChange).toHaveBeenCalled();     
expect(wrapper.find('input').prop('value')).toBe("hello")
})

Textfield.js

import React from 'react';
import TextField from '@material-ui/core/TextField';
import './style.scss';
const Textfield = (props) => {
const {label,value,onChange,className,name,id,onKeyDown,multiline,index,error,inputProps,errorMsg,isDisabled} = props;
return (
<TextField
error={error}
id={id}
label={error ? "Incorrect Field" : label}
variant="filled"
value={value}
onChange={onChange}
classname={className}
name={name}
onKeyDown={onKeyDown}
multiline={multiline}
helperText={error && "Incorrect Field."}
inputProps={{
...inputProps,
'data-testid': id
}}
disabled={isDisabled}
/>
);
};
export default Textfield;

Answer 1

我认为测试任何material-ui组件的正确方法是更改其道具，在本例中为value道具。

此外，正如@UKS所指出的，您已经嘲笑了onChange函数，所以不要对该值没有变化感到惊讶。