运行测试时使用保留字“let”答案

【问题标题】：Use of reserved word 'let' when running tests运行测试时使用保留字“let”
【发布时间】：2017-04-09 21:11:35
【问题描述】：

在运行测试时开始出现这个我似乎无法修复的错误。

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');
    });
  });
});

任何想法我什至可以找出它在说哪个“让”？

我在 Node v7.8.0 上运行它

【问题讨论】：

第 866 行的 test/browser/index.js 文件中有什么内容？
不确定如何在测试运行时访问该文件。
根据您的 Karma 配置，该文件应该已经存在。即，该目录中有什么？
抱歉，上面的测试文件是 browser/index.js，我猜“let”问题是在导入的文件之一中
您是否尝试过针对此类似问题的任何解决方案？ SyntaxError: Use of const in strict mode

标签： reactjs mocha.js karma-runner preact

【解决方案1】：

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

【讨论】：

【解决方案2】：

这可能会解决您的问题。您需要在您的业力文件中添加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'
    ],
    ....
  });
};

【讨论】：

【解决方案3】：

在运行 Karma 测试时，我也遇到了与 Ubuntu Linux 相同的问题。问题出在业力配置中的 browsers 字段。

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

使用 Chromeheadless

browsers: ['ChromeHeadless'],

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

【讨论】：

请详细说明您的答案，以便每个人都能从您的帖子中受益并学习。

【解决方案4】：

我刚刚遇到了类似的问题。根据@STEEL 的回答，通过安装npm install karma-chrome-launcher 并将浏览器更改为ChromeHeadless，我能够运行测试。但是，我发现 Chrome 工作而 PhantomJS 没有工作的原因是因为我的 babel.config.js 文件中有 Chrome 而不是 PhantomJS，所以 Karma 没有正确地转换为 PhantomJS。一旦我将 PhantomJS 添加到我的 babel 预设中的目标列表中，它就会正确编译。这是我的babel.config.js 文件的样子：

const presets = [
  ["@babel/env", {
    targets: {
      edge: "17",
      firefox: "60",
      chrome: "67",
      safari: "11.1",
      phantomjs: "2.1.1"
    },
    useBuiltIns: "usage"
  }]
];

module.exports = { presets };

我的配置没有从 webpack 配置文件中加载设置。相反，它使用以下字段在 karma.config.js 中设置 webpack 的配置：

webpack: {
  module: {
    rules: [
      { test: /\.js/, exclude: /node_modules/, loader: 'babel-loader' }
    ]
  },
  watch: true,
  mode: 'none'
},

【讨论】：