无法在 webdriverio 测试文件中导入 redux 存储答案

【问题标题】：can't import redux store in webdriverio test file无法在 webdriverio 测试文件中导入 redux 存储
【发布时间】：2018-08-28 16:30:17
【问题描述】：

我正在尝试导入我的 redux 存储，以便确保可以正确访问和设置存储，但尝试导入 redux 存储会出现以下错误：

 ERROR: Unexpected token import
firefox
/Users/Name/Desktop/project/internal-dashboard/dashboard/src/store.js:1
(function (exports, require, module, __filename, __dirname) { import rootReducer from './reducers/rootReducer';
                                                              ^^^^^^

Syntax    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:139:10)
    at Module._compile (module.js:607:28)
    at Object.Module._extensions..js (module.js:654:10)
    at Module.load (module.js:556:32)
    at tryModuleLoad (module.js:499:12)
    at Function.Module._load (module.js:491:3)
    at Module.require (module.js:587:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/Users/Name/Desktop/project/internal-dashboard/dashboard/test/login.js:2:15)

不知道为什么它告诉我这是一个意外令牌。该应用程序在我启动时运行正常，那么为什么在我运行 webdriverio 测试时，它在存储文件中使用的导入令牌出现问题？

这是商店文件：

import rootReducer from './reducers/rootReducer';
import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import { composeWithDevTools } from 'redux-devtools-extension';


const store = createStore(
    rootReducer,
    composeWithDevTools(applyMiddleware(thunk))
);

export default store;

这是我的登录测试

let assert = require('assert');
import store from '../src/store';

describe("Login Page", () => {
    console.log(store.getState());
    it('should tell user to enter a username', () => {
        browser.url('./');
        let loginHeader = $('p=SIGN IN');
        loginHeader.waitForExist(20000);

        browser.setValue('#username', '');
        browser.setValue('#password', '');
        browser.click('.ui.button');

        let enterUsernameDiv = $('div=Please enter a username');
        enterUsernameDiv.waitForExist(10000);
    });
}

【问题讨论】：

标签： reactjs redux webdriver-io

【解决方案1】：

您不能真正使用 webdriverio 打开 redux 商店，webdriverio 对您的代码一无所知，它正在打开浏览器并导航到页面。

为了检查你的 redux 存储，你需要使用单元测试，比如 jest。你现在做的更多的是功能测试。

【讨论】：

所以对于真正的端到端测试，我必须同时进行 jest 和 webdriver 测试？
@james 没有 webdriverio 适合端到端测试。在你的 webdriverio 中，你不需要知道你的 redux 状态。对于 webdriverio，您的网站是使用 react/redux 还是 angular 构建的并不重要。对于端到端测试，重要的是应用程序是否正常工作。
如果你想确保你的代码能正常工作，并且如果你做改变它不会在未来中断，你应该做单元测试。但这确实是为了测试单个功能是隔离的。

【解决方案2】：

正如redux website的安装指南中提到的那样

请注意，与 Redux 本身不同，Redux 生态系统中的许多包不提供 UMD 构建，所以我们推荐使用 CommonJS 模块像 Webpack 和 Browserify 这样的打包工具，让你最舒服开发经验。

在 node 中单独使用 redux 时执行以下操作将解决问题

import { createStore, applyMiddleware } from 'redux';

成为

const { createStore, applyMiddleware } = require('redux');

【讨论】：