chore(#560): add wip cucumber support

examples/druxt-site/test/cypress.config.js

@@ -1,7 +1,42 @@
-const { defineConfig } = require("cypress");
+const { defineConfig } = require('cypress')
+const webpack = require('@cypress/webpack-preprocessor')
+const preprocessor = require('@badeball/cypress-cucumber-preprocessor')
+
+async function setupNodeEvents(on, config) {
+  await preprocessor.addCucumberPreprocessorPlugin(on, config);
+
+  on(
+    'file:preprocessor',
+    webpack({
+      webpackOptions: {
+        resolve: {
+          extensions: ['.ts', '.js'],
+        },
+        module: {
+          rules: [
+            {
+              test: /\.feature$/,
+              use: [
+                {
+                  loader: '@badeball/cypress-cucumber-preprocessor/webpack',
+                  options: config,
+                },
+              ],
+            },
+          ],
+        },
+      },
+    })
+  )
+
+  // Make sure to return the config object as it might have been modified by the plugin.
+  return config
+}
 
 module.exports = defineConfig({
   e2e: {
-    baseUrl: 'http://localhost:3000'
+    specPattern: '**/*.feature',
+    supportFile: false,
+    setupNodeEvents,
   },
-});
+})

examples/druxt-site/test/cypress/e2e/Homepage.feature

@@ -0,0 +1,5 @@
+Feature: Homepage
+
+  Scenario: Anonymous user visits the homepage
+    Given I visit the homepage
+    Then I see "#__nuxt" element

examples/druxt-site/test/cypress/e2e/Homepage/index.js

@@ -0,0 +1,5 @@
+/* globals cy */
+import { Given, Then } from '@badeball/cypress-cucumber-preprocessor'
+
+Given('I visit the homepage', () => cy.visit('/'))
+Then('I see "#__nuxt" element', () => cy.get('#__nuxt').should('exist'))

package.json

@@ -20,6 +20,7 @@
     "dev": "siroc dev",
     "example:druxt-site": "cd examples/druxt-site && yarn && yarn dev",
     "example:druxt-site:test": "start-server-and-test 'yarn example:druxt-site' http://localhost:3000 'npx cypress run --project examples/druxt-site/test'",
+    "example:druxt-site:test:open": "start-server-and-test 'yarn example:druxt-site' http://localhost:3000 'npx cypress open --project examples/druxt-site/test'",
     "lint": "eslint --ext .js,.vue packages/*/src",
     "lint:commit": "commitlint",
     "lint:renovate": "renovate-config-validator",
@@ -33,9 +34,11 @@
   "devDependencies": {
     "@babel/core": "7.17.12",
     "@babel/preset-env": "7.17.12",
+    "@badeball/cypress-cucumber-preprocessor": "^12.1.0",
     "@changesets/cli": "2.22.0",
     "@commitlint/cli": "17.0.0",
     "@commitlint/config-conventional": "17.0.0",
+    "@cypress/webpack-preprocessor": "^5.12.2",
     "@vue/test-utils": "1.3.0",
     "babel-core": "7.0.0-bridge.0",
     "bundlewatch": "0.3.3",
@@ -55,9 +58,13 @@
     "rimraf": "3.0.2",
     "siroc": "0.16.0",
     "start-server-and-test": "^1.14.0",
+    "ts-node": "^10.9.1",
     "vue": "2.6.14",
     "vue-jest": "3.0.7",
     "vue-template-compiler": "2.6.14"
   },
+  "cypress-cucumber-preprocessor": {
+    "nonGlobalStepDefinitions": true
+  },
   "packageManager": "[email protected]"
 }