运行测试时使用保留字'let‘

Question

开始得到这个错误，我似乎无法修复，当我运行我的测试。

09 04 2017 22:08:20.577:INFO [karma]: Karma v1.6.0 server started at http://0.0.0.0:9876/
09 04 2017 22:08:20.580:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
09 04 2017 22:08:20.602:INFO [launcher]: Starting browser PhantomJS
09 04 2017 22:08:23.661:INFO [PhantomJS 2.1.1 (Windows 8 0.0.0)]: Connected on socket SPM1D8Mj1w6ABbGuAAAA with id 7910462
PhantomJS 2.1.1 (Windows 8 0.0.0) ERROR
  SyntaxError: Use of reserved word 'let' in strict mode
  at test/browser/index.js:886

我相信这是在某些包更新的时候发生的。

我的Karma配置如下所示：

require('babel-register');

const webpack = require('../webpack.config.babel.js');

module.exports = function(config) {
  config.set({
    basePath: '../',
    frameworks: ['mocha', 'chai-sinon'],
    browsers: ['PhantomJS'],
    files: ['test/browser/**/*.js'],
    preprocessors: {
      'test/**/*.js': ['webpack'],
      'src/**/*.js': ['webpack']
    },
    webpack,
    webpackMiddleware: { noInfo: true }
  });
};

测试非常简单

import { h, render, rerender } from 'preact';
import { route } from 'preact-router';
import App from '../../src/components/app';

/*global sinon,expect*/
describe('App', () => {
  var scratch;

  before(() => {
    scratch = document.createElement('div');

    (document.body || document.documentElement).appendChild(scratch);
  });

  beforeEach(() => {
    scratch.innerHTML = '';
  });

  after(() => {
    scratch.parentNode.removeChild(scratch);
  });

  describe('routing', () => {
    it('should render the homepage', () => {
      render(<App />, scratch);
      expect(scratch.innerHTML).not.contain('Home');
    });

    it('should render the header', () => {
      render(<App />, scratch);
      expect(scratch.innerHTML).to.contain('header');
    });

    it('should render the footer', () => {
      render(<App />, scratch);

      expect(scratch.innerHTML).to.contain('footer');
    });

    it('should render the social media links', () => {
      render(<App />, scratch);

      expect(scratch.innerHTML).to.contain('a');
    });
  });
});

你知道我在哪里可以找到它说的是哪个"let“吗？

我在Node v7.8.0上运行此程序

Answer 1

问题是特定于浏览器的。因此，如果您没有使用Babel将源代码编译为ES5，那么测试将无法在PhantomJS中运行。Webpack即时处理编译工作。因为我看不到您的Webpack配置文件的源代码，所以我猜测问题出在"webpack.config.babel.js“中的一个属性值。

Answer 2

这可能会解决你的问题。您需要在karma文件中添加babel-polyfill和phantomjs-polyfill，如下所示-

module.exports = function(config) {
  config.set({
    ....
    files: [
      './node_modules/babel-polyfill/dist/polyfill.js',
       './node_modules/phantomjs-polyfill/bind-polyfill.js',
       'test/browser/**/*.js'
    ],
    ....
  });
};

Answer 3

在运行Karma测试时，我也遇到了同样的Ubuntu Linux问题。问题出在karma配置中的浏览器字段。

我有过Chrome，后来我尝试了PhantomJS。但最终发现在Linux上使用“Chromeheadless”可以解决这个问题。因为只运行控制台视图的机器只能运行无头应用程序。

使用Chromeheadless

browsers: ['ChromeHeadless'],

此外，如果您仍然面临问题，请尝试在karma.conf.js中使用flags: ['--no-sandbox'],