feat(e2e): add cucumber test runner (#711)

danielroe · web-flow · commit fb306e026207 · 2024-01-17T15:19:44.000Z
diff --git a/examples/app-cucumber/app.vue b/examples/app-cucumber/app.vue
@@ -0,0 +1,5 @@
+<template>
+  <div>
+    <NuxtWelcome />
+  </div>
+</template>
diff --git a/examples/app-cucumber/cucumber.json b/examples/app-cucumber/cucumber.json
@@ -0,0 +1,14 @@
+{
+  "default": {
+    "paths": [
+      "test/acceptance/features/**/*.feature"
+    ],
+    "import": [
+      "test/acceptance/**/*.ts"
+    ],
+    "publish": false,
+    "format": [
+      "summary"
+    ]
+  }
+}
diff --git a/examples/app-cucumber/nuxt.config.ts b/examples/app-cucumber/nuxt.config.ts
@@ -0,0 +1,4 @@
+// https://nuxt.com/docs/api/configuration/nuxt-config
+export default defineNuxtConfig({
+  devtools: { enabled: true }
+})
diff --git a/examples/app-cucumber/package.json b/examples/app-cucumber/package.json
@@ -0,0 +1,23 @@
+{
+  "name": "nuxt-app-cucumber",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "nuxt build",
+    "dev": "nuxt dev",
+    "generate": "nuxt generate",
+    "preview": "nuxt preview",
+    "postinstall": "nuxt prepare",
+    "test": "NODE_OPTIONS='--loader ts-node/esm' NODE_ENV=test cucumber-js"
+  },
+  "dependencies": {
+    "nuxt": "^3.9.1",
+    "vue": "^3.4.7",
+    "vue-router": "^4.2.5"
+  },
+  "devDependencies": {
+    "@cucumber/cucumber": "^10.2.1",
+    "@nuxt/test-utils": "latest",
+    "ts-node": "^10.9.2"
+  }
+}
diff --git a/examples/app-cucumber/test/acceptance/features/home/features/home.feature b/examples/app-cucumber/test/acceptance/features/home/features/home.feature
@@ -0,0 +1,6 @@
+@tag-home-page
+
+Feature: 🏠 Home Page
+
+  Scenario: 🏠 Home Page is displayed
+    Given the user goes on the home page
diff --git a/examples/app-cucumber/test/acceptance/features/playwright/step-definitions/playwright.given-steps.ts b/examples/app-cucumber/test/acceptance/features/playwright/step-definitions/playwright.given-steps.ts
@@ -0,0 +1,15 @@
+import assert from 'node:assert'
+import { Given } from '@cucumber/cucumber'
+import { $fetch, createPage } from '@nuxt/test-utils/e2e'
+
+Given(/^the user goes on the home page$/u, async function (): Promise<void> {
+  // Browser test
+  const page = await createPage('/')
+  const text = await page.getByRole('heading', { name: 'Welcome to Nuxt!' }).innerText()
+  assert.match(text, /Welcome to Nuxt!/)
+  await page.close()
+
+  // SSR test
+  const html: string = await $fetch('/')
+  assert.match(html, /<!DOCTYPE html>/)
+})
diff --git a/examples/app-cucumber/test/acceptance/features/support/hooks.ts b/examples/app-cucumber/test/acceptance/features/support/hooks.ts
@@ -0,0 +1,8 @@
+import { fileURLToPath } from 'node:url'
+import { setup } from '@nuxt/test-utils/e2e'
+
+await setup({
+  runner: 'cucumber',
+  server: true,
+  rootDir: fileURLToPath(new URL('../../../..', import.meta.url))
+})
diff --git a/examples/app-cucumber/tsconfig.json b/examples/app-cucumber/tsconfig.json
@@ -0,0 +1,3 @@
+{
+  "extends": "./.nuxt/tsconfig.json"
+}
diff --git a/package.json b/package.json
@@ -30,7 +30,7 @@
   "scripts": {
     "lint": "eslint --ext .vue,.ts,.js,.mjs .",
     "lint:fix": "eslint --ext .vue,.ts,.js,.mjs . --fix",
-    "test:examples": "pnpm -r test",
+    "test:examples": "pnpm -r test --filter !nuxt-app-cucumber && pnpm -r test --filter nuxt-app-cucumber",
     "test:types": "vue-tsc --noEmit",
     "test:unit": "vitest test/unit --run",
     "prepack": "unbuild",
@@ -63,6 +63,7 @@
     "vitest-environment-nuxt": "^1.0.0"
   },
   "devDependencies": {
+    "@cucumber/cucumber": "^10.2.1",
     "@jest/globals": "29.7.0",
     "@nuxt/devtools": "1.0.8",
     "@nuxt/eslint-config": "0.2.0",
@@ -93,6 +94,7 @@
     "vue-tsc": "1.8.27"
   },
   "peerDependencies": {
+    "@cucumber/cucumber": "^10.2.1",
     "@jest/globals": "^29.5.0",
     "@testing-library/vue": "^7.0.0 || ^8.0.1",
     "@vitest/ui": "^0.34.6 || ^1.0.0",
@@ -107,6 +109,9 @@
     "vue-router": "^4.0.0"
   },
   "peerDependenciesMeta": {
+    "@cucumber/cucumber": {
+      "optional": true
+    },
     "@testing-library/vue": {
       "optional": true
     },
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/core/setup/cucumber.ts b/src/core/setup/cucumber.ts
diff --git a/src/core/setup/index.ts b/src/core/setup/index.ts
diff --git a/src/core/types.ts b/src/core/types.ts

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+{`
	`2`	`+ "extends": "./.nuxt/tsconfig.json"`
	`3`	`+}`