Add a test that could have caught bug #5142 (#5157)

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

apps/web/playwright/booking-pages.e2e.ts

@@ -3,6 +3,7 @@ import { expect } from "@playwright/test";
 import { test } from "./lib/fixtures";
 import {
   bookFirstEvent,
+  bookOptinEvent,
   bookTimeSlot,
   selectFirstAvailableTimeSlotNextMonth,
   selectSecondAvailableTimeSlotNextMonth,
@@ -119,4 +120,21 @@ test.describe("pro user", () => {
     await page.goto(`/${pro.username}`);
     await bookFirstEvent(page);
   });
+
+  test("can book an event that requires confirmation and then that booking can be accepted by organizer", async ({
+    page,
+    users,
+  }) => {
+    await bookOptinEvent(page);
+    const [pro] = users.get();
+    await pro.login();
+
+    await page.goto("/bookings/unconfirmed");
+    await Promise.all([
+      page.click('[data-testid="confirm"]'),
+      page.waitForResponse((response) => response.url().includes("/api/trpc/viewer.bookings.confirm")),
+    ]);
+    // This is the only booking in there that needed confirmation and now it should be empty screen
+    await expect(page.locator('[data-testid="empty-screen"]')).toBeVisible();
+  });
 });

apps/web/playwright/lib/testUtils.ts

@@ -105,11 +105,7 @@ export async function selectSecondAvailableTimeSlotNextMonth(page: Page) {
   await page.locator('[data-testid="time"]').nth(1).click();
 }
 
-export async function bookFirstEvent(page: Page) {
+async function bookEventOnThisPage(page: Page) {
-  // Click first event type
-
-  await page.click('[data-testid="event-type-link"]');
-
   await selectFirstAvailableTimeSlotNextMonth(page);
   await bookTimeSlot(page);
 
@@ -122,6 +118,17 @@ export async function bookFirstEvent(page: Page) {
   await expect(page.locator("[data-testid=success-page]")).toBeVisible();
 }
 
+export async function bookOptinEvent(page: Page) {
+  await page.locator('[data-testid="event-type-link"]:has-text("Opt in")').click();
+  await bookEventOnThisPage(page);
+}
+
+export async function bookFirstEvent(page: Page) {
+  // Click first event type
+  await page.click('[data-testid="event-type-link"]');
+  await bookEventOnThisPage(page);
+}
+
 export const bookTimeSlot = async (page: Page) => {
   // --- fill form
   await page.fill('[name="name"]', "Test Testson");