score:53
use link
instead of <link />
:
describe('<offcanvasmenu />', () => {
it('contains 5 <link /> components', () => {
const wrapper = shallow(<offcanvasmenu />);
expect(wrapper.find(link)).to.have.length(5);
});
});
it appears in the 1st example in the airbnb/enzyme docs:
it('should render three <foo /> components', () => {
const wrapper = shallow(<mycomponent />);
expect(wrapper.find(foo)).to.have.length(3);
});
the syntax .to.have.length
is for the chai assertion library. for jest use .tohavelength
:
it('should render three <foo /> components', () => {
const wrapper = shallow(<mycomponent />);
expect(wrapper.find(foo)).tohavelength(3);
});
score:3
this error can happen when you've got a parenthesis misplaced such that .to.have
incorrectly is placed within the parenthesis of expect(...)
:
correct:
expect(wrapper.find(<link />)).to.have.length(5);
causes typeerror: cannot read property 'have' of undefined:
expect(wrapper.find(<link />).to.have.length(5));
score:11
this could be because you don't have the chai assertion library installed in your dependencies or have not imported it in your tests file. therefore, you need to install chai-enzyme and import it in your test file i.e.
npm install chai
import { expect } from 'chai';
score:39
in their documentation enzyme is using chai assertion, so if you want to use expect(***).to.have.length(***)
you need to install chai-enzyme
and use its expect
. it will, therefore, lead to issues with expect(***).tomatchsnapshot()
if you use jest snapshots, but this article will help you to solve it, so you can do both.
Source: stackoverflow.com
Related Query
- React testing with Jest and Enzyme @react-google-maps/api returns TypeError: Cannot read property 'maps' of undefined
- React enzyme testing, Cannot read property 'have' of undefined
- Cannot read property '.then' of undefined when testing async action creators with redux and react
- Cannot read property 'contextTypes' of undefined Unit Testing enzyme
- React test with enzyme TypeError: Cannot read property 'state' of undefined
- Error: Uncaught [TypeError: Cannot read property 'x' of undefined Jest react testing
- Jest testing promise in React gives TypeError: Cannot read property 'finally' of undefined
- React Testing library: TypeError: Cannot read property 'articles' of undefined
- React testing component in Jest.js and got TypeError: Cannot read property 'map' of undefined
- TypeError: Cannot read property 'map' of undefined react test with enzyme and mocha
- TypeError: Cannot read property 'src' of undefined when loading script in React Enzyme
- Unit testing with enzyme got Cannot read property 'be' of undefined
- React Facebook Login with Enzyme mount - TypeError cannot read property 'parentNode' of undefined
- React testing library - cannot read property 'prototype' of undefined while mocking named class component import
- React - uncaught TypeError: Cannot read property 'setState' of undefined
- react router v^4.0.0 Uncaught TypeError: Cannot read property 'location' of undefined
- React with ES7: Uncaught TypeError: Cannot read property 'state' of undefined
- Cannot read property 'history' of undefined (useHistory hook of React Router 5)
- React - TypeError: Cannot read property 'props' of undefined
- React Router: Cannot read property 'pathname' of undefined
- React Typescript: Line 0: Parsing error: Cannot read property 'name' of undefined
- React Tutorial: TypeError: Cannot read property 'props' of undefined
- TypeError: Cannot read property 'javascript' of undefined + terser webpack plugin + react js
- React Material-UI Modal TypeError: Cannot read property 'hasOwnProperty' of undefined
- How to test form submission in React with Jest and Enzyme? Cannot read property 'preventDefault' of undefined
- React propType cannot read property of undefined
- React cannot read property map of undefined
- enzyme simulate submit form, Cannot read property 'value' of undefined
- TypeError: Cannot read property 'prototype' of undefined React Express
- TypeError: Cannot read property 'error' of undefined on React Chrome Extension
More Query from same tag
- iOS browser scrolling bug
- I have a MaterialUi Table wrapped within a Paper component. How can I add a minimize button to minimize my table or the Paper component?
- how to use containsLocation in react-google-maps/api library
- Refactoring to Fetch API only once React.JS
- "404 Not Found" on React website subfolders
- error using hooks i don't know what is wrong
- How do I convert CSS to Styled-Components with input[type="submit"] attribute?
- How to fix the Property 'setConfirmDelete' does not exist on type 'JSX.IntrinsicElements' in reactjs
- How to change button background color when I click the button in React using Hooks
- React: Passing a function received as props to another function
- How to Access Variable Outside of Return in a Child from Parent?
- IntelliJ TypeScript plugin complains that "window is not defined" in React project
- How to reset a redux slice state with Redux Toolkit (RTK)
- Where are build messages after compile is complete?
- how to push an item into an array if it is inside a javascript object [state.lastValue.push is not a function]
- react-hook-form doesn't render MUI RadioGroup with selected option when going back to previous step
- Why is socket.io event firing multiple times from react?
- How to invoke onChange for radio button using react-bootstrap?
- React app with express and axios gives error on rendering the data
- How to do fetch with React Hooks; ESLint enforcing `exhaustive-deps` rule, which causes infinite loop
- Tailwind CSS Grid Spacing Messed Up
- Show/Hide components in ReactJS
- How do I add a class to each element in an array of React Components?
- Can't resolve 'history/createBrowserHistory'
- react ts withRouter connect error
- Make Unit Test Wait for Data filled by Asynchronous Fetch
- Async arrow function expected no return value
- React dropdown that opens a unique div and closes the active one on click
- Add mouse hover effects into style
- How store data from fetch