黄瓜-量角器无法识别步骤定义

Question

我已经用Protractor和Cucumber设置了Angular6项目来运行用户验收测试，但是一旦运行测试用例，每个规范都会得到以下错误：

未定义。 使用以下代码段实现：

我已经尝试了所有可能的黄瓜版本（2,3,4），语法和导入方式的组合-但仍然遇到相同的错误或此错误：

未处理的拒绝TypeError：this.registerHandler不是函数

我还尝试过更改量角器，黄瓜，框架版本以及黄瓜版本，但仍然无法正常工作。

我使用普通字符串或正则表达式，回调，异步等都没关系，步骤定义不会被重新识别。

有什么建议可以使这项工作吗？

非常感谢你。

下面是我的实际配置：

回购：

https://github.com/stevensgarcia/uat-cucumber

脚手架：

e2e
├── src/
│   ├── features/
│   │   └── home.feature
│   ├── hooks/
│   ├── pages/
│   │   ├── basePage.ts
│   │   ├── courseDetails.ts
│   │   ├── homePage.ts
│   │   └── locator.interface.ts
│   ├── steps/
│   │   └── home.steps.ts
│   └── homePage.e2e-spec.ts
└── tsconfig.e2e.json

黄瓜

exports.config = {
  allScriptsTimeout: 60000,
  useAllAngular2AppRoots: true,
  capabilities: {
    browserName: 'chrome'
  },
  // SELENIUM_PROMISE_MANAGER: false,
  // required feature files
  specs: [
    './e2e/src/features/*.feature'
  ],
  directConnect: true,
  // seleniumAddress: 'http://localhost:4444/wd/hub',
  baseUrl: 'http://localhost:4200/',
  framework: 'custom',
  frameworkPath: require.resolve('protractor-cucumber-framework'),
  onPrepare() {
    require('ts-node').register({
      project: './e2e/tsconfig.e2e.json'
    });
  },

  cucumberOptions: {
    // required step definitions
    compiler: [],
    require : [ './e2e/src/**/*.steps.ts' ],
    strict  : true,
    format  : ['pretty'],
    dryRun  : false,
    tags    : []
  },
  disableChecks: true,
};

家庭功能

Feature: To work with home page

  @smoke
  Scenario: Click course of application
    Given I navigate to application
    When I get all the heading
    When I click the 'Selenium framework development' course
    Then I should see 'Selenium framework development' course in coursedetails page

home.steps.ts

import { defineSupportCode } from 'cucumber';
import { HomePage } from '../pages/homePage';
import { expect } from 'chai';
import { CourseDetailsPage } from '../pages/courseDetails';

defineSupportCode(({Given, When, Then}) => {

  const homePage = new HomePage();
  const coursedetails = new CourseDetailsPage();

  Given(/^I navigate to application$/, async() => {
    await homePage.OpenBrowser('http://localhost:4200');
  });

  When(/^I get all the heading$/, async() => {
    await homePage.GetAllHeadings();
  });

  When(/^I click the '([^\"]*)' course$/, async(headingText) => {
    await homePage.ClickFirstHeading(headingText.toString());
  });

  Then(/^I should see '([^\"]*)' course in coursedetails page$/, async(course) => {
    // tslint:disable-next-line:no-unused-expression
    expect(coursedetails.GetCourseHeading).to.be.not.null;
  });

});

输出：

>> uatPlayground  (develop *) !3008 $ ./node_modules/.bin/cucumber-js -r ./e2e/src/steps ./e2e/src/features
Feature: To work with home page

  @smoke
  Scenario: Click course of application
  ? Given I navigate to application
  ? When I get all the heading
  ? When I click the 'Selenium framework development' course
  ? Then I should see 'Selenium framework development' course in coursedetails page

Warnings:

1) Scenario: Click course of application - e2e/src/features/home.feature:4
   Step: Given I navigate to application - e2e/src/features/home.feature:5
   Message:
     Undefined. Implement with the following snippet:

       Given('I navigate to application', function (callback) {
         // Write code here that turns the phrase above into concrete actions
         callback(null, 'pending');
       });

2) Scenario: Click course of application - e2e/src/features/home.feature:4
   Step: When I get all the heading - e2e/src/features/home.feature:6
   Message:
     Undefined. Implement with the following snippet:

       When('I get all the heading', function (callback) {
         // Write code here that turns the phrase above into concrete actions
         callback(null, 'pending');
       });

3) Scenario: Click course of application - e2e/src/features/home.feature:4
   Step: When I click the 'Selenium framework development' course - e2e/src/features/home.feature:7
   Message:
     Undefined. Implement with the following snippet:

       When('I click the \'Selenium framework development\' course', function (callback) {
         // Write code here that turns the phrase above into concrete actions
         callback(null, 'pending');
       });

4) Scenario: Click course of application - e2e/src/features/home.feature:4
   Step: Then I should see 'Selenium framework development' course in coursedetails page - e2e/src/features/home.feature:8
   Message:
     Undefined. Implement with the following snippet:

       Then('I should see \'Selenium framework development\' course in coursedetails page', function (callback) {
         // Write code here that turns the phrase above into concrete actions
         callback(null, 'pending');
       });

1 scenario (1 undefined)
4 steps (4 undefined)
0m00.000s

Answer 1

1）黄瓜4不支持defineSupportCode ，您应该使用import { Given, Then, When } from "cucumber"; Cucumber import { Given, Then, When } from "cucumber"; 在home.steps.ts 。

import { Given, Then, When } from "cucumber";
import { HomePage } from '../pages/homePage';
import { expect } from 'chai';
import { CourseDetailsPage } from '../pages/courseDetails';

const homePage = new HomePage();
const coursedetails = new CourseDetailsPage();

Given(/^I navigate to application$/, async() => {
  await homePage.OpenBrowser('http://localhost:4200');
});

When(/^I get all the heading$/, async() => {
  await homePage.GetAllHeadings();
});

When(/^I click the '([^\"]*)' course$/, async(headingText) => {
  await homePage.ClickFirstHeading(headingText.toString());
});

Then(/^I should see '([^\"]*)' course in coursedetails page$/, async(course) => {
  // tslint:disable-next-line:no-unused-expression
  expect(coursedetails.GetCourseHeading).to.be.not.null;
});

2）在cucumber.conf.ts ，应该是cucumberOpts ，而不是cucumberOptions ，而且格式化程序： pretty自黄瓜4起就被删除了。

  cucumberOpts: {
    // required step definitions
    compiler: [],
    require : [ 'e2e/src/steps/*.steps.ts' ],
    strict  : true,
    dryRun  : false,
    tags    : []
  },