如何使用开玩笑和酶单元测试反应reduxsauce saga？

Question

我是新手做出反应和减少。 我正在开发一个项目，为此我希望通过使用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在答案中的建议尝试解决方案后，之前的错误（在UPDATE 1之前）再次开始出现。

Answer 1

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

在package.json中添加此jest配置：

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

并在testsetup.js添加此

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

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