enzyme

问题 The Issue I am just getting started with enzyme and react testing. I am trying to get enzyme working with karma and webpack on a trivial react component. My issue is that prop() on the wrapper returns null and I am not sure why. Greeter.js import React from 'react'; /* * A trivial component we added while trying to get the react testing working * */ export default class Greeter extends React.Component { constructor(props) { super(props); this.state = { name: props.initialName }; this

问题 I'm using Create React App. I created a Jest test that uses a manual mock. The test renders my App component and I'm trying to mock a nested component. It's still picking up the original BarChart component. containers/__tests__/App.js import React from 'react'; import { shallow, mount } from 'enzyme'; const barChartPath = '../../components/d3/BarChart/BarChart'; describe('App', () => { beforeEach(() => { const mockBarChart = require('../../components/d3/BarChart/__mocks__/BarChart').default;

问题 This post follows up with my previous question: previous question I have come across a test which requires me to run mount in react native. I have gone through the documentation in jest and have found that before running the test suite you specifically need to setup a test environment capable of running jsdom for mount to work: The link to docs is: testEnvironment Because of it's horrible documentation. I can't figure out how to create the customEnvironment class and what after that? what do

问题 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

问题 How can i test if useEffect called dispatch with requestMovies on mount? import { useDispatch } from 'react-redux'; export const requestMovies = page => ({ type: MoviesTypes.REQUEST_MOVIES, page, }); const MoviesShowcaseList = () => { const { page } = useShallowEqualSelector(state => state.movies); const dispatch = useDispatch(); const fetchNextMoviesPage = () => { dispatch(requestMovies(page + 1)); }; useEffect(fetchNextMoviesPage, []); return (...); }; 回答1: First, we use jest.mock to get

问题 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'); }); }); 回答1: I managed to resolve it. Thanks to

问题 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

问题 There has got to be a simple way to do this, but I can't find documented syntax anywhere. I have a React component with a prop that I'd like to mock in Jest like this: jest.mock('./common/MultiSelect', 'MultiSelect'); That works, except that I end up with a React warning cluttering my test results: Warning: Unknown prop options on tag. Remove this prop from the element. The component I'm mocking does have an options prop, and I really don't care how it's rendered, so how can I mock it in such

问题 Unfortunately, where I am working, we do not do unit tests on React Components. As I am fairly new to the industry as well, I have no experience whatsoever writing unit tests for software. This puts me in an odd predicament when trying to learn on my own, as the examples I have seen online are either poorly explained, or just not meant for beginners. I recently checked out testing React Components with Enzyme and Jest, and thought the combination looked promising. My goal here is this: I

问题 There are a few material-ui components that do not render their results in the same place as the component is placed by their parent. Among these we have the Dialog , Menu , etc. This makes it apparently impossible to test for their content's presence in a jest.js wrapper with some parent component mounted in it. For example given the following component: class DropdownMenu extends React.Component { onButtonClick = (e) => { this.setState({ open: true, anchorEl: e.currentTarget }); } render()