[minor] Gherkin support (#49)

Author: mmisty

.gitignore

@@ -13,6 +13,7 @@
 /integration/downloads
 /integration/screenshots
 /integration/e2e/temp/
+/integration/cucumber/temp/
 
 # coverage and test reports
 /reports
@@ -28,4 +29,10 @@
 /allure-results-jest
 /allure-report
 /filtered_tests.json
+
+
+# grep
+spec_pattern*.json
+filter*.json
+
 adapter-ctl.sh

README.pack.md

@@ -20,6 +20,7 @@ Some settings were taken from [@shelex/cypress-allure-plugin](https://www.npmjs.
  - Wraps custom commands into parent step, so report is cleaner
  - has interface to set status message for tests - `cy.allure().testDetails({ message: "This test is skipped because needs to be reviewed" })`
  - writes test files after each test - so you can watch execution in Allure TestOps
+ - [gherkin support](./docs/gherkin.md)
 
 Example report is here - [Allure Report example](https://mmisty.github.io/cypress-allure-adapter-example/)
 
@@ -157,6 +158,7 @@ That's it! :tada:
 | **issuePrefix** <br/>_type: string_<br/><br/>ex: `http://jira.com` or `http://jira.com/PROJECT-1/*/browse`                                                                                                                          | The same as tmsPrefix - for issue `cy.allure().issue('PROJ-02')`                                                                                                                                                                                                                                                                                                                                                                                                                                              |
 | **allureShowDuplicateWarn**<br/>_type: boolean_<br/>_default: false_                                                                                                                                                                | Show console warnings about test duplicates.                                                                                                                                                                                                                                                                                                                                                                                                                                                                  |
 | **allureShowTagsInTitle**<br/>_type: boolean_<br/>_default: undefined_                                                                                                                                                              | Whether to show tags in test title or not. When undefined will keep title as is                                                                                                                                                                                                                                                                                                                                                                                                                               |
+| **allureAddNonSpecialTags**<br/>_type: boolean_<br/>_default: true_                                                                                                                                                                 | Whether to add non-special tags to tests                                                                                                                                                                                                                                                                                                                                                                                                                                                                      |
 
 
 ### tmsPrefix and issuePrefix

cypress.config.ts

@@ -2,8 +2,7 @@ import { defineConfig } from 'cypress';
 import { setupPlugins } from './integration/plugins';
 
 const cypressFolder = 'integration';
-
-export default defineConfig({
+export const commonConfig: Cypress.ConfigOptions = {
   e2e: {
     specPattern: `${cypressFolder}/e2e/**/*.(cy|test|spec).(j|t)s`,
     supportFile: `${cypressFolder}/support/index.ts`,
@@ -32,6 +31,7 @@ export default defineConfig({
       allureAddVideoOnPass: 'true',
       allureShowDuplicateWarn: 'true',
       allureShowTagsInTitle: false,
+      allureAddNonSpecialTags: 'true',
       // allureWrapCustomCommands: '!qaId,!cust',
       // allureWrapCustomCommands: 'qaId,cust',
       // allureLogCyCommands: 'false',
@@ -40,10 +40,12 @@ export default defineConfig({
       issuePrefix: 'http://jira/*',
     },
 
-    setupNodeEvents(on, config) {
-      setupPlugins(on, config);
+    async setupNodeEvents(on, config) {
+      await setupPlugins(on, config);
 
       return config;
     },
   },
-});
+};
+
+export default defineConfig(commonConfig);

cypress.cucumber-test.config.ts

@@ -0,0 +1,17 @@
+import { defineConfig } from 'cypress';
+import { commonConfig } from './cypress.config';
+
+export default defineConfig({
+  ...commonConfig,
+  e2e: {
+    ...commonConfig.e2e,
+    specPattern: 'integration/cucumber/temp/**/*.feature',
+    env: {
+      allure: true,
+      ...(commonConfig.e2e?.env || {}),
+      cucumber: 'true',
+      omitFiltered: true,
+      filterSpecs: true,
+    },
+  },
+});

cypress.cucumber.config.ts

@@ -0,0 +1,16 @@
+import { defineConfig } from 'cypress';
+import { commonConfig } from './cypress.config';
+
+export default defineConfig({
+  ...commonConfig,
+  e2e: {
+    ...commonConfig.e2e,
+    specPattern: 'integration/cucumber/**/**/*.feature',
+    env: {
+      ...(commonConfig.e2e?.env || {}),
+      cucumber: 'true',
+      omitFiltered: true,
+      filterSpecs: true,
+    },
+  },
+});

docs/gherkin.md

@@ -0,0 +1,19 @@
+## Gherkin support
+
+This plugin supports gherkin support.
+
+If you use `@badeball/cypress-cucumber-preprocessor` plugin
+then also there would be tags support available.
+
+Special tags will add meta info to report.
+
+Example(in this example it will add several links to test):
+```gherkin
+  @issue("ABC-001")
+  @tms("ABC-002")
+  @tms("ABC-003","Description__of__ticket")
+  Scenario: should have several tms tags
+    Given I log message "test"
+```
+
+Special tags are the same as allure interface items, see [interface](./interface.md) 

integration/cucumber-steps/common.ts

@@ -0,0 +1,13 @@
+import { When, Then, Given } from '@badeball/cypress-cucumber-preprocessor';
+
+When('I visit site', () => {
+  cy.log('visit site');
+});
+
+Then('I should see a search bar {string}', (text: string) => {
+  cy.log(text);
+});
+
+Given('I log message {string}', (text: string) => {
+  cy.log(text);
+});

integration/cucumber/first.feature

@@ -0,0 +1,21 @@
+Feature: test cucumber
+  Background:
+    Given I visit site
+
+  Scenario: 01 visiting the frontpage
+    Then I should see a search bar "hello"
+
+  Scenario: 02 visiting the frontpage
+    Then I should see a search bar "hello"
+
+  Scenario Outline: 03 visiting the frontpage
+    Then I should see a search bar "<text>"
+    Examples:
+    | text  |
+    | hello |
+    | bye   |
+
+  @P1
+  @failOnPurpose
+  Scenario: 04 visiting the frontpage
+    Then This step should fail

integration/cucumber/first.ts

@@ -0,0 +1,7 @@
+import { Then } from '@badeball/cypress-cucumber-preprocessor';
+
+Then('This step should fail', () => {
+  cy.wrap({ a: 1 }).then(t => {
+    expect(t).eq(2);
+  });
+});

integration/cucumber/tags.feature

@@ -0,0 +1,91 @@
+@release1.1
+@parentSuite("Other")
+@epic("Cucumber")
+Feature: duckduckgo.com
+  Background:
+    Given I visit site
+
+  @suite("Suite")
+  @subSuite("Child")
+  Scenario: 01.1 should have suite,subsuite
+    Given I log message "test with tag"
+
+  @P1
+  Scenario: 01 should have tag
+    Given I log message "test with tag"
+
+  @issue("ABC-454")
+  Scenario: 02 should have issue tag
+    Given I log message "test with issue"
+
+  @issue("ABC-454","issue__link__description")
+  Scenario: 03 should have issue tag with description
+    Given I log message "test"
+
+  @issue("ABC-123")
+  @issue("ABC-456")
+  Scenario: 04 should have several issue tags
+    Given I log message "test"
+
+  @tms("ABC-454")
+  Scenario: 05 should have tms tag
+    Given I log message "test with issue"
+
+  @tms("ABC-454","issue__link__description")
+  Scenario: 06 should have tms tag with description
+    Given I log message "test"
+
+  @tms("ABC-123")
+  @tms("ABC-456")
+  Scenario: 07 should have several tms tags
+    Given I log message "test"
+
+  @link("https://example.com")
+  Scenario: 08 should have link tag
+    Given I log message "test with issue"
+
+  @link("https://example.com","example__text")
+  Scenario: 09 should have link tag with text
+    Given I log message "test with issue"
+
+  @link("https://example.com","example__text","issue")
+  Scenario: 10 should have link tag with text and 'issue' type
+    Given I log message "test with issue"
+
+  @link("https://example.com","example__text","tms")
+  Scenario: 11 should have link tag with text and 'tms' type
+    Given I log message "test with issue"
+
+  @feature("Tags")
+  @story("Special__tags")
+  Scenario: 12 should have epic/feature/story tag
+    Given I log message "test with issue"
+
+
+  @severity("minor")
+  @owner("T__P")
+  @fullName("Full__name")
+  @allureId("123")
+  @language("javascript")
+  @thread("01")
+  @lead("AP")
+  @host("MACBOOK")
+  @layer("API")
+  @browser("Chrome")
+  @device("COMP")
+  @os("MAC")
+  @label("path","value")
+  Scenario: 13 should have meta - severity,owner,etc
+    Given I log message "test with issue"
+
+  Scenario Outline: 14 with examples
+    Then I should see a search bar "<text>"
+    @simple
+    Examples:
+      | text  |
+      | hello |
+
+    @complex
+    Examples:
+      | text  |
+      | bye   |

integration/plugins/events-forwarder.ts

@@ -0,0 +1,33 @@
+import { EventEmitter } from 'events';
+
+export class EventForwarder {
+  private emitter: EventEmitter;
+  private task: Cypress.Tasks;
+  public on: Cypress.PluginEvents;
+
+  public constructor() {
+    this.emitter = new EventEmitter();
+    this.task = {};
+
+    this.on = (action, arg) => {
+      if (action === 'task') {
+        Object.assign(this.task, arg);
+      } else {
+        this.emitter.on(action, arg as () => void);
+      }
+    };
+  }
+
+  public forward(on: Cypress.PluginEvents): void {
+    for (const event of this.emitter.eventNames()) {
+      /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+      on(event as any, async (...args: unknown[]) => {
+        for (const listener of this.emitter.listeners(event)) {
+          // eslint-disable-next-line no-await-in-loop
+          await listener(...args);
+        }
+      });
+    }
+    on('task', this.task);
+  }
+}

integration/plugins/index.ts

@@ -9,6 +9,8 @@ import { redirectLogBrowser } from 'cypress-redirect-browser-log/plugins';
 import { configureAllureAdapterPlugins } from '@src/plugins';
 import { startTestServer } from './test-server';
 import { Server } from 'http';
+import { addCucumberPreprocessorPlugin } from '@badeball/cypress-cucumber-preprocessor';
+import { EventForwarder } from './events-forwarder';
 
 /**
  * Clear compiled js files from previous runs, otherwise coverage will be messed up
@@ -25,8 +27,10 @@ const clearJsFiles = () => {
 const isCoverage = (config: PluginConfigOptions) => {
   return process.env[COVERAGE] === 'true' || config.env[COVERAGE] === true;
 };
+const eventForwarder = new EventForwarder();
 
-export const setupPlugins = (on: PluginEvents, config: PluginConfigOptions) => {
+export const setupPlugins = async (cyOn: PluginEvents, config: PluginConfigOptions) => {
+  const { on } = eventForwarder;
   clearJsFiles();
   const isCov = isCoverage(config);
 
@@ -43,7 +47,12 @@ export const setupPlugins = (on: PluginEvents, config: PluginConfigOptions) => {
     return browserHandler(browser, opts);
   });
 
+  cyOn('file:preprocessor', preprocessor(isCov, config));
+
+  await addCucumberPreprocessorPlugin(on, config);
+
   const allure = configureAllureAdapterPlugins(on, config);
+
   on('before:run', details => {
     allure?.writeEnvironmentInfo({
       info: {
@@ -53,13 +62,12 @@ export const setupPlugins = (on: PluginEvents, config: PluginConfigOptions) => {
     });
   });
 
-  on('file:preprocessor', preprocessor(isCov));
-
   console.log('CYPRESS ENV:');
   console.log(config.env);
 
   // register grep plugin
   pluginGrep(on, config);
+
   let server: Server;
 
   on('task', {
@@ -104,6 +112,8 @@ export const setupPlugins = (on: PluginEvents, config: PluginConfigOptions) => {
     console.log(`SCREENSHOT: ${details.path}`);
   });
 
+  eventForwarder.forward(cyOn);
+
   // It's IMPORTANT to return the config object
   // with any changed environment variables
   return config;

integration/plugins/ts-preprocessor.ts

@@ -1,8 +1,12 @@
 import { TsconfigPathsPlugin } from 'tsconfig-paths-webpack-plugin';
 import path from 'path';
 import type { Configuration } from 'webpack';
+import createBundler from '@bahmutov/cypress-esbuild-preprocessor';
 
-export const preprocessor = (isCoverage: boolean) => {
+// eslint-disable-next-line @typescript-eslint/no-var-requires
+const createEsbuildPlugin = require('@badeball/cypress-cucumber-preprocessor/esbuild').createEsbuildPlugin;
+
+export const preprocessor = (isCoverage: boolean, config: Cypress.PluginConfigOptions) => {
   // eslint-disable-next-line @typescript-eslint/no-var-requires
   const tsconfigPath = path.resolve(__dirname, '../tsconfig.json');
 
@@ -28,6 +32,14 @@ export const preprocessor = (isCoverage: boolean) => {
     ],
   };
 
+  const cucumberBundler = createBundler({
+    define: {
+      global: 'window',
+    },
+    tsconfig: tsconfigPath,
+    plugins: [createEsbuildPlugin(config)],
+  });
+
   const rules = isCoverage ? [coverageRule, tsRule] : [tsRule];
 
   const webpackOptions: Configuration = {
@@ -55,5 +67,9 @@ export const preprocessor = (isCoverage: boolean) => {
     webpackOptions,
   };
 
-  return wp(options);
+  if (config.env['cucumber'] === 'true') {
+    console.log('Will Run cucumber tests');
+  }
+
+  return config.env['cucumber'] === 'true' ? cucumberBundler : wp(options);
 };