Method “props” is only meant to be run on a single node. 0 found instead. Enzyme -Error

Question

In my react app I am testing my container using jest and enzyme. I am testing createAgent feature of my container. But my test fails and I come across the error below.

Container.js

import React, { Component } from "react";
import { connect } from "react-redux";
import PropTypes from "prop-types";
import { push } from "react-router-redux";
import { getIds, getAgents, getAgent } from "../../reducers/agents";
import {
  readAgents,
  confirmDeleteAgent,
  cancelDeleteAgent,
  deleteAgent
} from "../../actions";
import List from "../../components/List";

class Agents extends Component {
  static propTypes = {
    //props
  };

  createAgent = () => {
    this.props.push("/agents/add");
  };

  render() {
    //render code
    return (
      <button className="ui primary button" 
        onClick={this.createAgent}>
        Add
      </button>
    //render code
    )
  }
};

containerTest.js

import React from "react";
import ReactDOM from "react-dom";
import { Provider } from "react-redux";
import configureStore from "../../store/configureStore";
import Agents from "./index";
import { mount, shallow } from "enzyme";

it("should call instance methods on agents", () => {
  const store = configureStore();
  let mockCreateAgent = jest.fn();
  Agents.prototype.createAgent = mockCreateAgent;
  const wrapper = shallow(
    <Provider store={store}>
      <Agents />
    </Provider>
  );
  wrapper.find('.ui primary button').simulate('click');
  expect(mockCreateAgent).toHaveBeenCalled();
});

Error:

   Method “props” is only meant to be run on a single node. 0 found 
   instead.

  at ShallowWrapper.single 
    (node_modules/enzyme/build/ShallowWrapper.js:1516:17)
  at ShallowWrapper.props 
     (node_modules/enzyme/build/ShallowWrapper.js:867:21)
  at ShallowWrapper.prop 
     (node_modules/enzyme/build/ShallowWrapper.js:1075:21)
  at ShallowWrapper.simulate 
      (node_modules/enzyme/build/ShallowWrapper.js:838:28)
  at Object.<anonymous>.it 
      (src/containers/Agents/Agents.test.js:31:38)
      at Promise (<anonymous>)
  at Promise.resolve.theI.el (node_modules/p-map/index.js:42:16)
      at <anonymous>

How can I solve this issue? I am new to this testing using jest and enzyme.Any help will really appreciable.

Solution

Actually you are finding the element in wrong way. You have declared classed for button but you are finding it as a element. Check the below corrected code.

wrapper.find('button.ui.primary.button').simulate('click');

Test it and let me know if you face any issue.

Comments

[kugtas]

Right now you are looking for your button in Provider. Try using dive(): airbnb.io/enzyme/docs/api/ShallowWrapper/dive.html

[Khushi]

i need to check whether the function createAgent() is called or not. How it possible?

[kugtas]

have u tried wrapper.dive().find('.ui primary button').simulate('click'); ?

[Khushi]

yes. Then the error message is like this: Invariant Violation: Could not find "store" in either the context or props of "Connect(Agents)". Either wrap the root component in a <Provider>, or explicitly pass "store" as a prop to "Connect(Agents)".