search

eugene-sea / karma-cucumber-js

Karma adapter for running Cucumber.js features
10 stars 4 forks source link

Cannot see how to use tagged hooks for scenario.After() #12

Closed pieroway closed 7 years ago

pieroway commented 7 years ago

Does karma-cucumber-js allow for tagged hooks when calling scenario.After()? We are using scenario.After() hooks to reset our sinon.stubs and spy's in multiple .steps.ts files, but because I can't tag them to run specifically for the feature they pertain to, all the scenario.After() get run for every scenario being run. When, as per the example, there should only be one instead of the 15 run from that feature file implementation of the steps.ts file. So, can we run the scenario.After() step only for the associated tag, or am I out of luck? Thanks, Alan For example: Trigger Delete Application action

eugene-sea commented 7 years ago

It is a cucumber.js feature. I do not know if cucumber.js 1.3 supports tagged hooks but latest cucumber.js 2.x does support it. On weekend I plan to update karma-cucumber-js to support cucumber.js 2.x.

eugene-sea commented 7 years ago

Try this:

  this.Before({tags: ["@foo"]}, function (scenario) {
    // This hook will be executed before scenarios tagged with @foo
  });
pieroway commented 7 years ago

i'd tried that, on Before and After but it doesn't work. I'll wait for you to update to cucumber.js 2.x and hope this solves my problem. if not, the test still run, it's just the extra Afters are a nuisance we will accept for now. the only real harm is they skew the numbers. thanks for the coming update.

eugene-sea commented 7 years ago

Which version of cucumber.js do you use?

I have tried tagged hook in cucumber.js 1.3.1 and it works as expected.

pieroway commented 7 years ago

I was using 1.3.0 but just updated to 1.3.1 to see what happens. Still having issues:

Here is a subset of my code.

/// 'use strict'; adapter.addStepDefinitions(scenario => { this.After({tags: ["@foo"]}, function (scenario) { // do something }); });

I get a tslint error: [tslint] Shadowed variable: 'scenario' (no-shadowed-variable) (parameter) scenario: any

And when run I get: Uncaught TypeError: _this.After is not a function

Can I see your sample code to compare with mine? I wouldn't be surprised if I have the wrong syntax.

pieroway commented 7 years ago

caveat - I freely admit I still considered a novice at this so some of my lack of understanding is due to my only starting to learn angular and typescript in the past 8 months.

New information:

Apparently this is working, but since I was getting a typescript compile error (I think) stating the supplied parameters did not match any signature of call target I guess I never actually ran them using tags in place.

But, by actually running the test anyway, I can see by setting a break point that it would get hit when the tag was applicable and was not getting hit when the tag wasn't applicable despite the compile error.

Great that we can start using tagged hooks, but bad that we have to generate a lot of erroneous compile errors.

Any suggestions? Thanks Al

ts-loader: Using typescript@2.2.1

error TS2346: Supplied parameters do not match any signature of call target.

The code:


// sample scenario
@Confirm
Scenario: Some scenario
    Given something
    When I do something
    Then then something happened

// sample scenario step after hook
scenario.After('@Confirm', () => {
    console.log('do something after my confirm scenarios');
});

here is my package.json if it helps

{
  "name": "myproject",
  "version": "0.0.1",
  "description": "my project",
  "keywords": [
    "angular2",
    "typescript",
    "webpack"
  ],
  "scripts": {
    "lint": "tslint \"src/**/*.ts\"",
    "start": "gulp",
    "build": "gulp build",
    "test": "karma --conf ./karma.conf.js start",
  },
  "dependencies": {
    "@angular/common": "2.4.8",
    "@angular/compiler": "2.4.8",
    "@angular/core": "2.4.8",
    "@angular/forms": "2.4.8",
    "@angular/http": "2.4.8",
    "@angular/platform-browser": "2.4.8",
    "@angular/platform-browser-dynamic": "2.4.8",
    "@angular/router": "3.4.8",
    "angular2-busy": "1.0.2",
    "angular2-fontawesome": "0.9.0",
    "angular2-ui-switch": "1.2.0",
    "angular2-uuid": "1.1.1",
    "bootstrap": "3.3.7",
    "bootstrap-vertical-tabs": "1.2.2",
    "chart.js": "2.5.0",
    "core-js": "2.4.1",
    "dragula": "3.7.2",
    "font-awesome": "4.7.0",
    "ipaddr.js": "1.3.0",
    "jquery": "3.1.1",
    "lodash": "4.17.4",
    "moment-timezone": "0.5.11",
    "ng2-bootstrap": "1.3.3",
    "ng2-charts": "1.5.0",
    "ng2-dragula": "1.3.0",
    "ng2-select": "1.2.0",
    "ng2-table": "1.3.2",
    "ng2-translate": "5.0.0",
    "ngx-clipboard": "3.0.5",
    "reflect-metadata": "0.1.10",
    "rxjs": "5.2.0",
    "sta-interface": "file:../common/sta-interface",
    "sta-dictionary": "file:../common/sta-dictionary",
    "typeahead.js": "0.11.1",
    "validator": "7.0.0",
    "zone.js": "0.7.7"
  },
  "devDependencies": {
    "@types/chai": "3.4.35",
    "@types/core-js": "0.9.35",
    "@types/cucumber": "0.0.37",
    "@types/jasmine": "2.5.43",
    "@types/jquery": "2.0.40",
    "@types/karma-jasmine": "0.0.29",
    "@types/lodash": "4.14.53",
    "@types/node": "7.0.5",
    "@types/selenium-webdriver": "2.53.40",
    "@types/sinon": "1.16.35",
    "@types/typeahead": "0.11.27",
    "chai": "3.5.0",
    "chromedriver": "2.27.3",
    "codelyzer": "3.0.0-beta.0",
    "concurrently": "3.3.0",
    "copy-webpack-plugin": "4.0.1",
    "css-loader": "0.26.2",
    "cucumber": "1.3.0",
    "cucumber-tsflow": "1.1.2",
    "extract-text-webpack-plugin": "2.0.0",
    "file-loader": "0.10.1",
    "gulp": "3.9.1",
    "gulp-load-plugins": "1.5.0",
    "gulp-shell": "0.5.2",
    "html-loader": "0.4.5",
    "html-webpack-plugin": "2.28.0",
    "jasmine-core": "2.5.2",
    "karma": "1.5.0",
    "karma-chai": "0.1.0",
    "karma-chrome-launcher": "2.0.0",
    "karma-coverage": "1.1.1",
    "karma-cucumber-js": "1.0.1",
    "karma-jasmine": "1.1.0",
    "karma-junit-reporter": "1.2.0",
    "karma-mocha-reporter": "2.2.2",
    "karma-phantomjs-launcher": "^1.0.4",
    "karma-sinon": "1.0.5",
    "karma-sourcemap-loader": "0.3.7",
    "karma-webpack": "2.0.2",
    "null-loader": "0.1.1",
    "optimize-css-assets-webpack-plugin": "1.3.1",
    "raw-loader": "0.5.1",
    "rimraf": "2.6.1",
    "run-sequence": "1.2.2",
    "sanitize-filename": "1.6.1",
    "selenium-webdriver": "3.1.0",
    "sinon": "2.0.0-pre.5",
    "style-loader": "0.13.2",
    "ts-loader": "2.0.1",
    "tslint": "4.5.1",
    "typescript": "2.2.1",
    "webpack": "2.2.1",
    "webpack-dev-server": "2.4.1",
    "webpack-merge": "3.0.0"
  },
  "private": true
}
eugene-sea commented 7 years ago

In your code what is the type of scenario variable?

pieroway commented 7 years ago

I'm guessing my cucumber.d.ts is out of date but I wouldn't know where to find the correct one. Below is the end of the cucumber.d.ts file I'm including.


    // rest of file not included in this post

    export interface IScenario {
        World: { new (): any };
        setDefaultTimeout(timeout: number): void;
        Before(callback: Function): void;
        After(callback: Function): void;
        Given(regExp: RegExp, callback: Function): void;
        When(regExp: RegExp, callback: Function): void;
        Then(regExp: RegExp, callback: Function): void;
    }

    export interface IKarmaCucumberAdapter {
        addStepDefinitions(callback: (scenario: cucumber.IScenario) => void): void;
    }
}

declare var Cucumber: {
    new (features: [string, string][], stepDefinitions: () => void, options?: { tags: string[]; }): cucumber.ICucumber;
};
declare var CucumberHTML: { DOMFormatter: { new (rootElement: HTMLElement): cucumber.IDOMFormatter; } };

declare var __adapter__: cucumber.IKarmaCucumberAdapter;
eugene-sea commented 7 years ago

I have published new version of karma-cucumber-js with updated typings

pieroway commented 7 years ago

Thank you. This works well now. I'm officially happy. :) I appreciate the fix.