Enzyme: Method “text” is only meant to be run on a single node. 0 found instead Enzyme: Method “text” is only meant to be run on a single node. 0 found instead reactjs reactjs

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


Its caused by the fact that shallow does not render child componnets and your component been wrapped by a function. So shallow only returns a representation of the function not of the component. You can use dive() to reach the real component

/* global it, expect, describe */import React from 'react'import { shallow } from 'enzyme'import renderer from 'react-test-renderer'import About from '../pages/about.js'describe('With Enzyme', () => {  it('App shows "About"', () => {    const about = shallow(      <About />    ).dive()    expect(about.find('h1').text()).toEqual('About')  })})


Use .first()

example const wrapper = shallow()

wrapper.find('h1 or p or .ClassName or #id').first();

import React from 'react'import { shallow } from 'enzyme'import renderer from 'react-test-renderer'import About from '../pages/about.js'describe('With Enzyme', () => {  it('App shows "About"', () => {    const about = shallow(      <About />   )  expect(about.find('h1').first().text()).toEqual('About') })})


Please see this link on how to use the .findWhere on a shallow copy:https://blogs.sequoiainc.com/an-enzyme-gotcha/

Below is an example looking for nodes/html-elements of type "p" that contain the desired text which represents a salary "$100,000.00".

displayemployee = shallow(<DisplayEmployee employeeData={employee}it('renders the employees salary', () => {  expect(    displayemployee.findWhere(    n => n.type() === 'p' && n.contains('$100,000.00')  ))

The shallow copy returns all the nodes that the react component returns, and I'm searching through those nodes with .findWhere rather than .text. This is because .text expects to look through a single node; .text doesn't know how to scan through many nodes.