Javascript 开玩笑的间谍没有';在onChange事件上检测方法调用
我正在用jest/酶测试反应成分。我编写这个测试是为了测试输入标记上的onChange事件调用。我想监视这个方法并检查它是否被触发 以下是我的组件代码:Javascript 开玩笑的间谍没有';在onChange事件上检测方法调用,javascript,reactjs,jestjs,enzyme,Javascript,Reactjs,Jestjs,Enzyme,我正在用jest/酶测试反应成分。我编写这个测试是为了测试输入标记上的onChange事件调用。我想监视这个方法并检查它是否被触发 以下是我的组件代码: export default class Login extends Component { constructor(props) { super(props); autoBind(this); } handleChangeFields() { const email = this.email.value
export default class Login extends Component {
constructor(props) {
super(props);
autoBind(this);
}
handleChangeFields() {
const email = this.email.value;
const password = this.password.value;
const validationResults = {
email: isValidEmail(email),
password: password.length >= 8,
};
const isValidFields = Object.values(validationResults).every(Boolean);
}
render() {
return (
<form onSubmit={this.validateLoginForm}>
<input
type="email"
name="email"
ref={(input) => this.email = input}
placeholder="Email *"
onChange={this.handleChangeFields}
/>
<input
type="password"
name="password"
ref={(input) => this.password = input}
placeholder="Password *"
onChange={this.handleChangeFields}
/>
<input
type="submit"
value="login"
/>
</form>
);
}
}
我不明白为什么jest.spyOn没有检测到mwthod呼叫。我做错了什么
import React from 'react';
import { shallow, mount } from 'enzyme';
import Login from './Login';
describe('<Login /> Component', () => {
let wrapper;
const props = {
};
beforeEach(() => {
wrapper = mount(<Login {...props} />);
});
describe('<Login /> rendering', () => {
test('should call fields change method', () => {
const instance = wrapper.instance();
const spyChange = jest.spyOn(instance, 'handleChangeFields');
const input = wrapper.find('input').at(0);
input.simulate('change', { target: { value: 'test@test.com' } });
expect(spyChange).toHaveBeenCalled();
expect(wrapper.state().activeBtn).toBeFalsy();
});
});
});
Expected number of calls: >= 1
Received number of calls: 0