如何使用 jest 和酶对 reduxsauce saga 进行单元测试？

Question

我是 react 和 redux 的新手。 我正在开发一个项目，为此我想通过使用 reduxsauce 和 redux-saga 来拥有 redux，但我正在努力为这些编写单元测试。 这是我的文件夹结构：

我的 App-test.js：

import App from '../../../assets/src/App'
import React from 'react';
import renderer from 'react-test-renderer';
import configureStore from 'redux-mock-store'
import createStore from './Redux'


describe('App', () => {

const initialState = {output:100}
    const mockStore = configureStore()
    let store,container
        const store = createStore()
    beforeEach(()=>{
        store = mockStore(initialState)
        container = shallow(<App store={store} /> )
    })


  it('renders correctly', () => {
    const rendered = renderer.create(
      <App/>
    );
    expect(rendered.toJSON()).toMatchSnapshot();
  });
});

这是我的 App.js：

import React from 'react';
import ReactDOM from 'react-dom';
import Index from './Screens/Index';
import { Provider } from 'react-redux'
import createStore from './Redux'

const store = createStore()

const rootElement = document.getElementById('subscription');

export default class App extends React.Component {

render() {
    return (
      <Provider store={store}>
        <Index />
      </Provider>
    );
  }

}

ReactDOM.render(<App />, rootElement);

我已尝试使用 mockStore 和 store 变量，但出现以下错误：

有什么建议吗？

谢谢

更新 1

我现在将代码静音，现在我的 App-test.js 文件如下所示：

import App from '../../../assets/src/App'
import React from 'react';
import renderer from 'react-test-renderer';
import configureStore from 'redux-mock-store'
import createStore from './Redux'


describe('App', () => {

const initialState = {output:100}
    const mockStore = configureStore()
    let store,container
        const store = createStore()
//    beforeEach(()=>{
////        store = mockStore(initialState)
//        container = shallow(<App store={store} /> )
//    })


  it('renders correctly', () => {
    const rendered = renderer.create(
      <App/>
    );
    expect(rendered.toJSON()).toMatchSnapshot();
  });
});

但我现在得到不同的错误：

更新 2

在尝试了 Rami Enbashi 在答案中建议的解决方案后，之前的错误（更新 1 之前）再次开始出现。

Answer 1

这似乎是一个转译问题。您需要注册 Babel，以便在运行单元测试之前它将 ES6 转换为 ES5。一种方法是这样做。

在package.json 添加这个笑话配置：

  "jest": {
     "setupTestFrameworkScriptFile": "./scripts/testsetup.js"
  }

在testsetup.js 中添加这个

require('babel-register')();
require("babel-polyfill");
require("babel-jest");
.....

请务必阅读 Jest 文档以获取更多配置或所需插件。并确保先安装它们。