У меня есть компонент SignIn и пытаюсь написать контрольный пример для этого компонента. Поскольку я новичок в написании тестового примера, я столкнулся с некоторой проблемой. Я использую шутку и фермент.

Компонент входа

const formFeilds = [ { name: "email", label: "Email Address", type: "email", class: "single-element", invalidMsg: "This is not valid email address" }, { name: "password", label: "Password", type: "password", class: "single-element", invalidMsg: "The email id and password don't match. Click on forgot password to change" } ]; class SignIn extends React.Component { constructor(props) { super(props); this.state = { formData: { firstName: null, lastName: null, email: null, password: null }, valid: { email: null, password: null, valid: null }, loginError: null, showPassword: false, recaptchaValidation: null, recpatchaValue: null, loading: false }; this.onSubmit = this.onSubmit.bind(this); } render() { return ( {amp}lt;section className="login"{amp}gt; {amp}lt;React.Fragment{amp}gt; {amp}lt;div className="col-md-6 col-sm-6 col-xs-12 login-left-container"{amp}gt; {amp}lt;Login image={login1} header="Hey there! Start your journey towards simplicity now" loginType="signin" /{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;div className="col-md-6 col-sm-6 col-xs-12 login-right-container"{amp}gt; {amp}lt;div className="login-inner-container"{amp}gt; {amp}lt;h4{amp}gt;Login{amp}lt;/h4{amp}gt; {amp}lt;p className="account"{amp}gt; Are you new To Factoreal?{amp}lt;Link to="/register"{amp}gt;{amp}lt;span{amp}gt;Sign up here{amp}lt;/span{amp}gt;{amp}lt;/Link{amp}gt; {amp}lt;/p{amp}gt; {formFeilds.map((item, index) ={amp}gt; ( {amp}lt;Input containerClass="" type={item.type} name={item.name} placeholder={item.label} value={this.state.formData[item.name]} onChange={this.inputEntered} key={index} id={"custom-css-outlined-input_"   index} getValid={this.captureValidFlag} showPassword={this.state.showPassword} handleClickShowPassword={() ={amp}gt; { this.setState({ showPassword: !this.state.showPassword }) }} {amp}gt;{amp}lt;/Input{amp}gt; ))} {amp}lt;div style={{height: 20}}{amp}gt; {this.state.loginError ? ( {amp}lt;span className="error-msg"{amp}gt;{this.state.loginError}{amp}lt;/span{amp}gt; ) : null} {amp}lt;/div{amp}gt; {amp}lt;div className="captcha-container"{amp}gt; {amp}lt;ReCAPTCHA sitekey={constants.recaptchaSitekey} onChange={this.onChangeRecaptcha} onExpired={this.onExpiredRecaptcha} onErrored={this.onErrorRecaptcha} size="normal" ref={recaptchaRef} /{amp}gt; {amp}lt;Link to="/forgot-password" className="forgot"{amp}gt; Forgot password? {amp}lt;/Link{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;a className="btn btn-primary-cta" onClick={this.onSubmit} disabled={!this.state.valid.valid|| !this.state.recaptchaValidation} {amp}gt; Sign In {amp}lt;/a{amp}gt; {amp}lt;p className="or"{amp}gt; {amp}lt;span{amp}gt;OR{amp}lt;/span{amp}gt; {amp}lt;/p{amp}gt; {amp}lt;SocialMediaLogin google="Signin with Google" facebook="Signin with Facebook" /{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {/* {amp}lt;Loader loading={this.state.loading}/{amp}gt; */} {amp}lt;/React.Fragment{amp}gt; {amp}lt;/section{amp}gt; ); } } export default SignIn; 

Signin.test.js

 import React from 'react'; import Adapter from 'enzyme-adapter-react-16'; import { shallow, configure } from 'enzyme'; import SignIn from "../components/login/SignIn"; configure({adapter: new Adapter()}); describe('Test case for testing SignIn Component', () ={amp}gt; { it('should render without throwing an error', () ={amp}gt; { expect(shallow({amp}lt;SignIn /{amp}gt;).find('section.login').exists()).toEqual(true) }); it('renders a email input', () ={amp}gt; { expect(shallow({amp}lt;SignIn /{amp}gt;).find('#custom-css-outlined-input_0').length).toEqual(1) }); it('renders a password input', () ={amp}gt; { expect(shallow({amp}lt;SignIn /{amp}gt;).find('#custom-css-outlined-input_1').length).toEqual(1) }); }); describe('Email input', () ={amp}gt; { it('should respond to change event and change the state of the SignIn Component', () ={amp}gt; { const wrapper = shallow({amp}lt;SignIn /{amp}gt;); wrapper.find('#custom-css-outlined-input_0').simulate('change', {target: {name: 'email', value: 'blah@gmail.com'}}); expect(wrapper.state('email')).toEqual('blah@gmail.com'); }) }) describe('Password input', () ={amp}gt; { it('should respond to change event and change the state of the SignIn Component', () ={amp}gt; { const wrapper = shallow({amp}lt;SignIn /{amp}gt;); wrapper.find('#custom-css-outlined-input_1').simulate('change', {target: {name: 'password', value: 'cats'}}); expect(wrapper.state('password')).toEqual('cats'); }) }) 

Ошибка:

введите описание изображения здесь