jest测试react+redux在prop中说未定义的值

Question

我正在Jest中测试一个使用React和Redux制作的程序，我在控制台中收到了这个错误。

console.error
Warning: Failed prop type: The prop `prop` is marked as required in `Component`, but its value is `undefined`.

这是我为测试编写的代码：

import React from 'react';
import { Provider } from 'react-redux';
import renderer from 'react-test-renderer';
import configureStore from 'redux-mock-store';
import App from './App';

const mockStore = configureStore([]);

describe('My Connected React-Redux Component', () => {
let store;
let component;

beforeEach(() => {
store = mockStore({
prop: [],
hasErrored: false,
isLoading: false,
});
component = renderer.create(
<Provider store={store}>
<App />
</Provider>
);
});

it('should render with given state from Redux store', () => {
expect(component.toJSON()).toMatchSnapshot();
});

这就是App.js的样子(提供者添加在index.js上(

import Component from './components/Component';
function App() {
return (
<div className="App">
<Component></Component>
</div>
);
}
export default App;

Answer 1

App组件渲染Component组件。是Component在抱怨它需要一个道具。您应该更新mapStateToProps以提供prop，或者您可以简单地执行：

import Component from './components/Component';
function App() {
return (
<div className="App">
<Component prop="foo"></Component>
</div>
);
}
export default App;