enzyme

I have a React component that I am trying to test using Enzyme/Jest. I am trying to figure out what the most appropriate test would be to ensure the component has rendered. My component has a prop shouldRender that, if false, will cause the component to not render. My component looks like this: import React from 'react'; const propTypes = { shouldRender: React.PropTypes.bool, }; class MyComponent extends React.Component { constructor(props) { super(props); this.state = { foo: 'bar', }; } render() { if (!this.props.shouldRender) { return null; } return ( <div> <span>My component</span> </div> )

I'm trying to setup testing on a new project created with react-create-app. Which now seems to be using React 16 and Jest 3 (which supposedly had some breaking changes, or maybe that was enzime). I'm getting an error similar to this post TypeError: dispatch is not a function when I try to test a method using JEST TypeError: dispatch is not a function at App.componentDidMount (src/components/App.js:21:68) import React from 'react'; import { Provider } from 'react-redux'; import { mount } from 'enzyme'; import { App } from '../components/App'; import configureStore from '../state/store

So say i have this table: <table> <thead> <tr> <th>cat name</th> </tr> </thead> <tbody> {cats.map(cat => { return ( <tr key={cat.id}> <td styleName="table-item">{ cat.name }</td> </tr> ); })} </tbody> </table> How do i go about testing the jsx inside the map function with enzyme? I am able to test the other parts of it fine, like so: describe('<CatsTable />', () => { const wrapper = mount( <CatsTable cats={cats} /> ); it('renders correctly', () => { expect(wrapper.find('table')).to.have.length(1); expect(wrapper.find('tbody')).to.have.length(1); }); }); But if i try the same thing with what's

I'm trying to test an async await function, however im getting an error. ● Should handle getGIF event › should handle getGIF event expect(jest.fn()).toHaveBeenCalledTimes(1) Expected mock function to have been called one time, but it was called zero times. I'm unsure how to test async await functions, so i was using this blog as an example https://medium.com/@rishabhsrao/mocking-and-testing-fetch-with-jest-c4d670e2e167 App.js import React, {Component} from 'react'; import logo from './logo.svg'; import './App.css'; import Card from './Card'; import PropTypes from "prop-types"; const Styles = {

I am trying to test localStorage using sinon. Basically I am very new to unit testing so this might be very basic. Update I managed to come up with this but now its giving me a new error Should wrap property of object Test describe('Initial State', () => { it('should set the initial state for the component', () => { const props = { currentUser: {} }; sinon.stub(window.localStorage, 'setItem'); window.localStorage.setItem('none', 'nothing'); }); }); Umair Sarfraz I managed to resolve it. Thanks to @anoop because his answer was of help but I had to manage it with a major workaround. I am using

I am new to Jest test cases writing, Trying to write the test case for checking navigation in an react application. Currently I have written test case which works like below: I have Login page which is having register link on it, which redirects user to the Register page. So what I am checking is 1. Loading the login page 2. Triggered Register link click event 3. So user moved to the Register page but I am not able to check if the Register page is loaded or not? Is there any way to check the snapshot of the "Register" page and link in URL. I have used jest, enzyme and react-test-render as