How to test React component with children using jest and enzyme?

Question

Component to be tested. this.props.children have child components of example.js

class Example extends component {
  constructor(){
      super(props);
      this.state={};
    }
   render() {
        <div>{this.props.children}</div>
     }
}

test case

it("should render  Example with children", () => {
    const wrapper = shallow(<Example {...props} />);
     expect(wrapper.find("div").text()).toBe(""); //
   });

how to test the child components passed ?

Thanks.

score 3 · Accepted Answer · answered Oct 01 '21 at 04:39

3

You can use like below

describe('Parent Component', () => {
   it('renders Child component', () => {
   const wrapper = shallow(<Parent store={store} />);
   expect(wrapper.find(Child).length).toEqual(1);
  });
});

Also if you want to test only child component div use like this

const wrapper = shallow(<MyComponent />);
expect(wrapper.find('Foo')).to.have.lengthOf(1);

answered Oct 01 '21 at 04:39

Vishal Nai

268
1
12

what should be the values passed to store?it showing child undefind – Akshay Gireesh Oct 01 '21 at 05:11
1

that is only for your reference, you can pass props if you have that in you child otherwise without props is also fine – Vishal Nai Oct 01 '21 at 05:15

How to test React component with children using jest and enzyme?

1 Answers1