使用webpack对Protractor进行预处理e2e测试文件(ES6样式)

Question

我正在使用

1. 反应:申请
2. npm:包经理
3. mocha/chai/sinon:单元测试
4. 量角器:e2e测试

在我的申请中.整个应用程序是用ES6编写的,但e2e测试是普通的javascript.我也想为我的e2e测试文件使用ES6样式,但我面临的问题是预处理或编译ES6文件到普通的javascript,然后运行量角器agains编译的文件.任何人都可以请指出如何使用webpack与babel将这些ES6文件转换为普通的javascript？

这是我的protractor.conf.js:

/*eslint-disable no-var*/
'use strict';

exports.config = {
  specs: ['../tests/e2e/**/*.js'],
  capabilities: {
    browserName: 'chrome'
  },
  baseUrl: 'http://localhost:3000',
  frameworks: ['mocha', 'chai'],
  onPrepare: function() {
    browser.ignoreSynchronization = true;
  }
};

一个简单的测试:

/*eslint-disable no-var*/
'use strict';

var chai = require('chai');
var sinon = require('sinon');
var sinonChai = require('sinon-chai');

var expect = chai.expect;
chai.use(sinonChai);

describe('app login flow', function() {

  var loginUrl, homeUrl;

  it('sets up initial variables', function() {
    browser.get('/teams');
    loginUrl = browser.getCurrentUrl();

    browser.sleep(6000).then(function() {
      homeUrl = browser.getCurrentUrl();
      expect('1').to.equal('1');
    })
  });
});

Answer 1

只需require('babel/register');在protractor.conf.js文件的最顶部添加即可解决问题.有关更多信息,请在github上查看此问题

所以protractor.conf.js现在看起来像这样:

/*eslint-disable no-var*/
'use strict';

require('babel/register');

exports.config = {
  specs: ['../tests/e2e/**/*.js'],
  capabilities: {
    browserName: 'chrome'
  },
  baseUrl: 'http://localhost:3000',
  frameworks: ['mocha', 'chai'],
  onPrepare: function() {
    browser.ignoreSynchronization = true;
  },

};

现在可以用ES6编写测试文件.

/*eslint-disable no-var*/
'use strict';

import chai from 'chai';
import sinon from 'sinon';
import sinonChai from 'sinon-chai';

let expect = chai.expect;
chai.use(sinonChai);

describe('app login flow', () => {
  let loginUrl, homeUrl;
  it('sets up initial variables', () => {
    browser.get('/teams');

    browser.sleep(6000).then(() => {
      expect('1').to.equal('1');
    })
  });
});

PS.制作量角器一个很好的参考与ReactJs工作: 测试阵营与量角器应用程序由乔尔Auterson

UPDATE

万一有人读到这个答案底部的链接 - 我刚才写了这篇文章,现在它已经过时了.:) ExpectedConditions可能是你想要的! - Joel Auterson