Add E2E test to new scrim functionalities

app/db/seed/index.ts

@@ -175,8 +175,8 @@ const basicSeeds = (variation?: SeedVariation | null) => [
 	groups,
 	friendCodes,
 	lfgPosts,
-	scrimPosts,
-	scrimPostRequests,
+	variation === "NO_SCRIMS" ? undefined : scrimPosts,
+	variation === "NO_SCRIMS" ? undefined : scrimPostRequests,
 	associations,
 	notifications,
 ];

app/features/api-private/constants.ts

@@ -4,4 +4,5 @@ export const SEED_VARIATIONS = [
 	"REG_OPEN",
 	"SMALL_SOS",
 	"NZAP_IN_TEAM",
+	"NO_SCRIMS",
 ] as const;

app/features/scrims/components/ScrimCard.tsx

@@ -203,7 +203,10 @@ function ScrimTournamentPopover({
 	return (
 		<SendouPopover
 			trigger={
-				<SendouButton variant="minimal">
+				<SendouButton
+					variant="minimal"
+					data-testid="tournament-popover-trigger"
+				>
 					<Avatar
 						size="xxxsm"
 						url={tournament.avatarUrl}

app/utils/playwright.ts

@@ -99,3 +99,70 @@ export const startBracket = async (page: Page, tournamentId = 2) => {
 	await page.getByTestId("finalize-bracket-button").click();
 	await page.getByTestId("confirm-finalize-bracket-button").click();
 };
+
+/** Sets a date using the `<SendouDatePicker />` component */
+export async function setDateTime({
+	page,
+	date,
+	label,
+}: {
+	page: Page;
+	date: Date;
+	label: string;
+}) {
+	const hours = date.getHours();
+
+	await selectSpinbuttonValue({
+		page,
+		name: `year, ${label}`,
+		value: date.getFullYear().toString(),
+	});
+
+	await selectSpinbuttonValue({
+		page,
+		name: `month, ${label}`,
+		value: (date.getMonth() + 1).toString(),
+	});
+
+	await selectSpinbuttonValue({
+		page,
+		name: `day, ${label}`,
+		value: date.getDate().toString(),
+	});
+
+	await selectSpinbuttonValue({
+		page,
+		name: `hour, ${label}`,
+		value: String(hours % 12 || 12),
+	});
+
+	await selectSpinbuttonValue({
+		page,
+		name: `minute, ${label}`,
+		value: date.getMinutes().toString().padStart(2, "0"),
+	});
+
+	await selectSpinbuttonValue({
+		page,
+		name: `AM/PM, ${label}`,
+		value: hours >= 12 ? "PM" : "AM",
+	});
+}
+
+async function selectSpinbuttonValue({
+	page,
+	name,
+	value,
+}: {
+	page: Page;
+	name: string;
+	value: string;
+}) {
+	const locator = page.getByRole("spinbutton", {
+		name,
+		exact: true,
+	});
+	await locator.click();
+	await locator.clear();
+	await locator.fill(value);
+}

e2e/scrims.spec.ts

@@ -1,13 +1,16 @@
 import test, { expect } from "@playwright/test";
+import { add } from "date-fns";
+import { NZAP_TEST_ID } from "~/db/seed/constants";
 import { ADMIN_ID } from "~/features/admin/admin-constants";
 import {
 	impersonate,
 	navigate,
 	seed,
 	selectUser,
+	setDateTime,
 	submit,
 } from "~/utils/playwright";
-import { scrimsPage } from "~/utils/urls";
+import { newScrimPostPage, scrimsPage } from "~/utils/urls";
 
 test.describe("Scrims", () => {
 	test("creates a new scrim & deletes it", async ({ page }) => {
@@ -142,4 +145,99 @@ test.describe("Scrims", () => {
 		});
 		await expect(page.getByText("Canceled")).toBeVisible();
 	});
+
+	test("creates scrim with start time and tournament maps, accepts with time and message", async ({
+		page,
+	}) => {
+		await seed(page, "NO_SCRIMS");
+		await impersonate(page);
+		await navigate({
+			page,
+			url: newScrimPostPage(),
+		});
+
+		const tomorrowDate = new Date();
+		tomorrowDate.setDate(tomorrowDate.getDate() + 1);
+		tomorrowDate.setHours(18, 0, 0, 0);
+
+		await setDateTime({ page, date: tomorrowDate, label: "Start" });
+
+		await setDateTime({
+			page,
+			date: add(tomorrowDate, { hours: 2 }),
+			label: "Start time range end",
+		});
+
+		await page.getByLabel("Maps").selectOption("TOURNAMENT");
+
+		const tournamentButton = page.getByLabel("Tournament");
+		const tournamentSearchInput = page.getByTestId("tournament-search-input");
+		const tournamentSearchItem = page.getByTestId("tournament-search-item");
+
+		await tournamentButton.click();
+		await tournamentSearchInput.fill("Swim or Sink");
+		await expect(tournamentSearchItem.first()).toBeVisible();
+		await page.keyboard.press("Enter");
+
+		await submit(page);
+
+		// Log in as NZAP user and request the scrim
+		await impersonate(page, NZAP_TEST_ID);
+		await navigate({
+			page,
+			url: scrimsPage(),
+		});
+
+		await page.getByTestId("available-scrims-tab").click();
+
+		// Find and click the request button for the scrim we just created
+		await page.getByTestId("request-scrim-button").first().click();
+
+		await selectUser({
+			labelName: "User 2",
+			page,
+			userName: "a",
+		});
+		await selectUser({
+			labelName: "User 3",
+			page,
+			userName: "b",
+		});
+		await selectUser({
+			labelName: "User 4",
+			page,
+			userName: "c",
+		});
+
+		await page.getByLabel("Start time").selectOption("1761582600000");
+
+		await page.getByLabel("Message").fill("Ready to scrim! Let's do this.");
+
+		await submit(page);
+
+		// Log back in as the author (admin) and verify the scrim and request details
+		await impersonate(page, ADMIN_ID);
+		await navigate({
+			page,
+			url: scrimsPage(),
+		});
+
+		await expect(page.getByText("+2h")).toBeVisible();
+		await expect(page.getByTestId("tournament-popover-trigger")).toBeVisible();
+
+		await expect(
+			page.getByText("Ready to scrim! Let's do this."),
+		).toBeVisible();
+
+		await page.getByText("Confirm for 6:30 PM").click();
+		await page.getByTestId("confirm-button").click();
+
+		await page.getByTestId("booked-scrims-tab").click();
+		await page.getByRole("link", { name: "Contact" }).click();
+
+		await page.getByAltText("Generate maplist").click();
+
+		// on /maps page
+		await expect(page.getByText("Create map list")).toBeVisible();
+	});
 });