protractor - 如何配置 Protractor 以使用 Cucumber

Question

截至0.20.1 Protractor 现在完全支持 cucumber ，但我正在努力寻找有关如何正确配置它的任何文档。知道如何设置 world.js 吗？

我在 https://github.com/whyvez/angular-cucumber-example/blob/master/features/support/world.coffee 找到了这个例子但我不确定您是否仍需要指定所有需要的模块和配置，因为 Protractor 配置文件(referenceConf.js)已经包含所有这些信息。

assert = require 'assert'
path = require 'path'

protractor = require 'protractor'
webdriver = require 'selenium-webdriver'

driver = new webdriver.Builder().
  usingServer('http://localhost:4444/wd/hub').
  withCapabilities(webdriver.Capabilities.chrome()).
  build()

driver.manage().timeouts().setScriptTimeout(100000)

ptor = protractor.wrapDriver driver

class World
  constructor: (callback) ->
    @browser = ptor
    @By = protractor.By
    @assert = assert
    callback()

module.exports.World = World

Answer 1

我创建了一个示例项目来展示如何使用 Cucumber 配置 Protractor 并利用 World。

The World 是一个在不同场景之间共享共性的地方，这样您就可以让您的代码井井有条。

实际上，您只需在/features 下名为/support 的文件夹中创建您的 world.js 文件。你也会把你的钩子(Hook)放在那里。您的步骤定义中将提供每个属性或函数。

世界.js:

module.exports = function() {

  this.World = function World(callback) {
    this.prop = "Hello from the World!";

    this.greetings = function(name, callback) {
      console.log("\n----Hello " + name);
      callback();
    };

    callback();
}

然后在您的步骤中:

var sampleSteps = function() {

    this.Given(/^this is the first sample$/, function (callback) {
      console.log("\n----" + this.prop);
      callback();
    });

    this.Given(/^this is the second sample$/, function (callback) {
      this.greetings("everybody", callback);
    });

};

module.exports = sampleSteps;

你的 protractor.js 配置文件看起来像这样:

exports.config = {

  specs: [
    'e2e/features/*.feature'
  ],

  capabilities: {
    'browserName': 'chrome'
  },

  baseUrl: 'http://localhost:8081/',

  framework: 'cucumber',

};

这是 GitHub 存储库。

https://github.com/plopcas/st-protractor-cucumber

希望这可以帮助。