How to fix Method “simulate” is meant to be run on 1 node. 0 found instead in jest

Viewed 541

I am writting a test case using jest in Reactjs but it fails and it gives the error Method “simulate” is meant to be run on 1 node. 0 found instead. I have implemented the test cases by referring to this article.

Component

render() {
        const { errors } = this.state;
        return (
            <div style={{backgroundColor:'linear-gradient(RGBA(182,82,80))' , height:'50vh'}}>
                <Container className='mt-5 mb-3 ' style={{width:'40em',height:'36em',backgroundColor:"White",borderRadius:'20px'}}>
                    <form noValidate onSubmit={this.onSubmit} className='login'>
                        <div className="form-group">
                            <label>Email</label>
                            <input type="text" className="form-control" placeholder="Email"
                                   onChange={this.onChange}
                                   value={this.state.email}
                                   error={errors.email}
                                   id="email"
                                   name="email"
                                   className={classnames("", {
                                       invalid: errors.email || errors.emailnotfound
                                   })}
                            />
                            <span className="red-text">
                                {errors.email}
                                {errors.emailnotfound}
                            </span>
                        </div>
                    </form>

                </Container>
                <Footer/>
            </div>
        );
    }

Test case

import React from 'react';
import {shallow} from 'enzyme';
import login from '../Components/login';

describe('Test case for testing login',() =>{
    it('username check',()=>
    {
        wrapper = shallow(<login/>);
        wrapper.find('input[type="text"]').simulate('change', {target: {name: 'email', value: 'krishankantsinghal'}});
        expect(wrapper.state('email')).toEqual('krishankantsinghal');
    })
})

What could be the possible error? How can I fix this? Thanks in advance

1 Answers

Lowercase component name is supposed to be for browser's native elements like span or table. While it's <login .. it will always rendered literally, without involving your class.

To handle this you must use upper-first format(or "capitalized"):

import Login from './login.jsx';

...
... shallow(<Login ........)
Related