Insert test fixture into product journey tests

Author: ostenbom

playwright.config.ts

@@ -8,7 +8,8 @@ import { defineConfig, devices } from "@playwright/test";
 // import path from 'path';
 // dotenv.config({ path: path.resolve(__dirname, '.env') });
 
-export const baseURL = process.env.BASE_URL || "https://endform-playwright-tutorial.vercel.app"
+export const baseURL =
+	process.env.BASE_URL || "https://endform-playwright-tutorial.vercel.app";
 
 /**
  * See https://playwright.dev/docs/test-configuration.

tests/activity-section.spec.ts

@@ -1,4 +1,4 @@
-import { expect, test } from "@playwright/test";
+import { expect, test } from "./test";
 
 test.describe("Activity Section", () => {
 	test("should navigate to dashboard activity section and verify user activities", async ({

tests/change-email.spec.ts

@@ -1,4 +1,4 @@
-import { expect, test } from "@playwright/test";
+import { expect, test } from "./test";
 import { testWithNewUser } from "./test-with-new-user";
 
 test.describe("User Email Change Flow", () => {

tests/change-name.spec.ts

@@ -1,4 +1,4 @@
-import { expect, test } from "@playwright/test";
+import { expect, test } from "./test";
 import { testWithNewUser } from "./test-with-new-user";
 
 test.describe("User Name Change Flow", () => {

tests/change-password.spec.ts

@@ -1,4 +1,4 @@
-import { expect, test } from "@playwright/test";
+import { expect, test } from "./test";
 import { testWithNewUser } from "./test-with-new-user";
 
 test.describe("User Password Change Flow", () => {

tests/check-setup.spec.ts

@@ -12,4 +12,5 @@ test("is already logged in", async ({ page }) => {
 	await expect(
 		page.getByRole("heading", { name: "Team Settings" }),
 	).toBeVisible();
+	await expect(page.getByTestId("team-member").first()).toBeVisible();
 });

tests/plan-upgrade.spec.ts

@@ -1,4 +1,4 @@
-import { expect, test } from "@playwright/test";
+import { expect, test } from "./test";
 import { testWithNewUser } from "./test-with-new-user";
 
 test.describe("Plan Upgrade Flow", () => {

tests/support/faults.ts

@@ -0,0 +1,102 @@
+import type { Page, TestInfo } from "@playwright/test";
+
+export const implementedFaults = [
+	"api-team-500",
+	"script-404",
+	"unexpected-dashboard-redirect",
+] as const;
+
+export type FaultName = (typeof implementedFaults)[number];
+
+const faultTargets: Record<FaultName, string[]> = {
+	"api-team-500": [
+		"should change user name in general settings and verify it appears in team members list",
+	],
+	"script-404": [
+		"should successfully change password and sign in with new credentials",
+	],
+	"unexpected-dashboard-redirect": [
+		"should navigate to dashboard activity section and verify user activities",
+	],
+};
+
+export async function installFaultsForTest(page: Page, testInfo: TestInfo) {
+	const faults = process.env.FAULTS?.trim();
+
+	for (const faultName of implementedFaults) {
+		if (faults !== "all" && faults !== faultName) {
+			continue;
+		}
+
+		if (!faultTargets[faultName].includes(testInfo.title)) {
+			continue;
+		}
+
+		switch (faultName) {
+			case "api-team-500":
+				await installApiTeam500(page);
+				break;
+			case "script-404":
+				await installScript404(page);
+				break;
+			case "unexpected-dashboard-redirect":
+				await installUnexpectedDashboardRedirect(page);
+				break;
+		}
+	}
+}
+
+async function installApiTeam500(page: Page) {
+	const faultName = "api-team-500";
+
+	await page.route("**/api/team", async (route) => {
+		await route.fulfill({
+			status: 500,
+			contentType: "application/json",
+			headers: {
+				"x-fault-injected": faultName,
+			},
+			body: JSON.stringify({ error: `Fault injected: ${faultName}` }),
+		});
+	});
+}
+
+async function installScript404(page: Page) {
+	const faultName = "script-404";
+
+	await page.route("**/*", async (route) => {
+		if (route.request().resourceType() === "script") {
+			await route.fulfill({
+				status: 404,
+				contentType: "application/javascript",
+				headers: {
+					"x-fault-injected": faultName,
+				},
+				body: `throw new Error("Fault injected: ${faultName}");`,
+			});
+			return;
+		}
+
+		await route.continue();
+	});
+}
+
+async function installUnexpectedDashboardRedirect(page: Page) {
+	const faultName = "unexpected-dashboard-redirect";
+
+	await page.route("**/dashboard", async (route) => {
+		if (route.request().resourceType() === "document") {
+			await route.fulfill({
+				status: 302,
+				headers: {
+					location: "/sign-in",
+					"x-fault-injected": faultName,
+				},
+				body: "",
+			});
+			return;
+		}
+
+		await route.continue();
+	});
+}

tests/team-invitation.spec.ts

@@ -1,4 +1,4 @@
-import { expect, test } from "@playwright/test";
+import { expect, test } from "./test";
 import { testWithNewUser } from "./test-with-new-user";
 
 test.describe("Team Invitation Flow", () => {
@@ -55,7 +55,7 @@ test.describe("Team Invitation Flow", () => {
 			});
 
 			await test.step("Complete signup process with invitation", async () => {
-				await page.goto("/sign-up?inviteId=" + invitationId);
+				await page.goto(`/sign-up?inviteId=${invitationId}`);
 				await expect(
 					page.getByRole("heading", { name: "Create your account" }),
 				).toBeVisible();

tests/test-with-new-user.ts

@@ -1,10 +1,10 @@
-import { test } from "@playwright/test";
 import {
 	type ApiUser,
 	createUser,
 	deleteUser,
 	getCookieForSession,
 } from "../setup-utils";
+import { test } from "./test";
 
 // This is an _automatic_ fixture, that when used will provide the test with a unique new user
 // https://playwright.dev/docs/test-fixtures#automatic-fixtures
@@ -14,12 +14,16 @@ export const testWithNewUser = test.extend<{
 }>({
 	newUser: [
 		async ({ baseURL, page }, use) => {
-			const { email, password, session } = await createUser(baseURL!);
-			await page.context().addCookies([getCookieForSession(session, baseURL!)]);
+			if (!baseURL) {
+				throw new Error("baseURL is required to create a test user");
+			}
+
+			const { email, password, session } = await createUser(baseURL);
+			await page.context().addCookies([getCookieForSession(session, baseURL)]);
 
 			await use({ email, password, session });
 
-			await deleteUser(baseURL!, email);
+			await deleteUser(baseURL, email);
 		},
 		{ auto: true },
 	],