add changes

apps/web/playwright/booking/customLocations/all-locations-regular-booking.e2e.ts

@@ -0,0 +1,139 @@
+import { expect } from "@playwright/test";
+
+import { test } from "../../lib/fixtures";
+import { PHONE } from "../utils/bookingUtils";
+import {
+  addAnotherLocation,
+  clickEditAndLocationSelect,
+  editEventType,
+  getByExactText,
+  loginAndGoToSetupBookingPage,
+  verifyTextVisibility,
+} from "./customLocationsUtils";
+
+test.describe("Add Locations in a regular booking", () => {
+  test("Add a location and change to each available location on the event type settings", async ({
+    page,
+    users,
+  }) => {
+    // Logs in a test user and navigates to the event types page.
+    loginAndGoToSetupBookingPage(page, users);
+
+    // Edit event type
+    editEventType(page);
+
+    // Select Cal Video (Global) location and check if the correct text is displayed
+    await getByExactText(page, "Cal Video (Global)").click();
+    verifyTextVisibility(page, "Cal Video");
+    clickEditAndLocationSelect(page);
+
+    // Select In person location and check if the correct text is displayed
+    await getByExactText(page, "In Person (Attendee Address)").click();
+    verifyTextVisibility(page, "In Person (Attendee Address)");
+    await page.getByTestId("update-location").click();
+    clickEditAndLocationSelect(page);
+
+    // Fills the address field with a valid address and check if the address is displayed correctly
+    await getByExactText(page, "In Person (Organizer Address)").click();
+    await page.getByLabel("Provide an Address or Place").dblclick();
+    await page.getByLabel("Provide an Address or Place").fill("test location");
+    await page.getByTestId("display-location").check();
+    await page.getByTestId("update-location").click();
+    verifyTextVisibility(page, "test location");
+    clickEditAndLocationSelect(page);
+
+    // Fills the meeting link field with an invalid link and check if the invalid link alert is showing
+    await getByExactText(page, "Link meeting").click();
+    await page.getByLabel("Provide a Meeting Link").dblclick();
+    await page.getByLabel("Provide a Meeting Link").fill("test");
+    await expect(page.getByText("Invalid URL")).toBeVisible();
+
+    // Fills the meeting link field with a valid link and check if the link is displayed correctly
+    await page.getByLabel("Provide a Meeting Link").fill("https:testmeeting.com");
+    await page.getByTestId("display-location").check();
+    await page.getByTestId("update-location").click();
+    verifyTextVisibility(page, "https:testmeeting.com");
+    clickEditAndLocationSelect(page);
+
+    // Select Phone location and check if the correct text is displayed
+    await getByExactText(page, "Attendee Phone Number").click();
+    await expect(
+      page.getByText("Cal will ask your invitee to enter a phone number before scheduling.")
+    ).toBeVisible();
+    await page.getByTestId("update-location").click();
+    verifyTextVisibility(page, "Attendee Phone Number");
+    clickEditAndLocationSelect(page);
+
+    // Fills the phone number field and check if the phone number is displayed correctly
+    await getByExactText(page, "Organizer Phone Number").click();
+    await page.getByRole("textbox").dblclick();
+    await page.getByRole("textbox").clear();
+    await page.getByRole("textbox").fill(PHONE);
+    await page.getByTestId("display-location").check();
+    await page.getByTestId("update-location").click();
+    verifyTextVisibility(page, "+5532983289947");
+
+    // Remove location and check if the select location is clean
+    await page.getByRole("button", { name: "Remove" }).click();
+    await expect(page.getByText("Select...")).toBeVisible();
+  });
+
+  test("Add all available locations and try to schedule a meeting", async ({ page, users }) => {
+    // Logs in a test user and navigates to the event types page.
+    loginAndGoToSetupBookingPage(page, users);
+
+    // Edit event type
+    editEventType(page);
+
+    // Select Cal Video (Global) location and check if the correct text is displayed
+    await getByExactText(page, "Cal Video (Global)").click();
+    verifyTextVisibility(page, "Cal Video");
+    addAnotherLocation(page);
+
+    // Select In person location and check if the correct text is displayed
+    await getByExactText(page, "In Person (Attendee Address)").click();
+    verifyTextVisibility(page, "In Person (Attendee Address)");
+    await page.getByTestId("update-location").click();
+    addAnotherLocation(page);
+
+    // Fills the address field with a valid address and check if the address is displayed correctly
+    await getByExactText(page, "In Person (Organizer Address)").click();
+    await page.getByLabel("Provide an Address or Place").dblclick();
+    await page.getByLabel("Provide an Address or Place").fill("test location");
+    await page.getByTestId("display-location").check();
+    await page.getByTestId("update-location").click();
+    verifyTextVisibility(page, "test location");
+    addAnotherLocation(page);
+
+    // Fills the meeting link field with an invalid link and check if the invalid link alert is showing
+    await getByExactText(page, "Link meeting").click();
+    await page.getByLabel("Provide a Meeting Link").dblclick();
+    await page.getByLabel("Provide a Meeting Link").fill("test");
+    await expect(page.getByText("Invalid URL")).toBeVisible();
+
+    // Fills the meeting link field with a valid link and check if the link is displayed correctly
+    await page.getByLabel("Provide a Meeting Link").fill("https:testmeeting.com");
+    await page.getByTestId("display-location").check();
+    await page.getByTestId("update-location").click();
+    verifyTextVisibility(page, "https:testmeeting.com");
+    addAnotherLocation(page);
+
+    // Select Phone location and check if the correct text is displayed
+    await getByExactText(page, "Attendee Phone Number").click();
+    await expect(
+      page.getByText("Cal will ask your invitee to enter a phone number before scheduling.")
+    ).toBeVisible();
+    await page.getByTestId("update-location").click();
+    verifyTextVisibility(page, "Attendee Phone Number");
+    addAnotherLocation(page);
+
+    // Fills the phone number field and check if the phone number is displayed correctly
+    await getByExactText(page, "Organizer Phone Number").click();
+    await page.getByRole("textbox").dblclick();
+    await page.getByRole("textbox").clear();
+    await page.getByRole("textbox").fill(PHONE);
+    await page.getByTestId("display-location").check();
+    await page.getByTestId("update-location").click();
+    verifyTextVisibility(page, "+5532983289947");
+  });
+});

apps/web/playwright/booking/customLocations/attendee-phone-number.e2e.ts

@@ -0,0 +1,69 @@
+import { expect } from "@playwright/test";
+
+import { login } from "../../fixtures/users";
+import { test } from "../../lib/fixtures";
+import { getByExactText, verifyTextVisibility } from "./customLocationsUtils";
+
+test.describe("Custom Cases For Attendee Phone Number Location", () => {
+  test("Attendee Phone Number", async ({ page }) => {
+    await login({ username: "pro", email: "pro@example.com", password: "pro" }, page);
+    await page.goto("/event-types");
+
+    // eslint-disable-next-line playwright/no-conditional-in-test
+    if (await page.getByRole("button", { name: "Update timezone" }).isVisible()) {
+      page.getByRole("button", { name: "Update timezone" }).click();
+    }
+
+    // Create a new event type
+    await page.getByTestId("new-event-type").click();
+    await page.getByPlaceholder("Quick Chat").click();
+    await page.getByPlaceholder("Quick Chat").fill("15 min test Attendee Phone Number location");
+    await page.getByRole("button", { name: "Continue" }).click();
+
+    // Select Attendee Phone Number location and check if the correct text is displayed
+    await page.locator("#location-select").click();
+    await getByExactText(page, "Attendee Phone Number").click();
+    verifyTextVisibility(page, "Attendee Phone Number");
+    await page.getByTestId("update-eventtype").click();
+    const page3Promise = page.waitForEvent("popup");
+    await page.getByTestId("preview-button").click();
+    const page3 = await page3Promise;
+
+    // Check if the correct text is displayed in the preview page
+    await expect(page3.getByText("Attendee Phone Number").last()).toBeVisible();
+    await page3.getByTestId("time").first().click();
+    await page3.getByPlaceholder("Enter phone number").click();
+    await page3.getByPlaceholder("Enter phone number").clear();
+    await page3.getByPlaceholder("Enter phone number").fill("+55 (32) 9748672848");
+    await expect(page3.getByRole("paragraph").filter({ hasText: "Attendee Phone Number" })).toBeVisible();
+
+    await page3.getByTestId("confirm-book-button").click();
+    await page3.goto("/event-types");
+
+    await page3
+      .getByRole("link", {
+        name: "15 min test Attendee Phone Number",
+      })
+      .first()
+      .click();
+    await page3
+      .locator("header")
+      .filter({ hasText: "15 min test Attendee Phone Number locationSave" })
+      .getByRole("button")
+      .nth(2)
+      .click();
+    await page3.getByRole("button", { name: "Yes, delete" }).click();
+
+    // Cancel the meeting in upcoming bookings page
+    await page3.getByRole("link", { name: "Bookings" }).click();
+    await page3
+      .getByRole("row", {
+        name: "15 min test Attendee Phone Number location between Pro Example and Pro Example You and Pro Example Cancel Edit",
+      })
+      .first()
+      .getByTestId("cancel")
+      .click();
+    await page3.getByTestId("confirm_cancel").click();
+    await expect(page3.getByTestId("cancelled-headline")).toBeVisible();
+  });
+});

apps/web/playwright/booking/customLocations/cal-video-location.e2e.ts

@@ -0,0 +1,66 @@
+import { expect } from "@playwright/test";
+
+import { login } from "../../fixtures/users";
+import { test } from "../../lib/fixtures";
+import { getByExactText, verifyTextVisibility } from "./customLocationsUtils";
+
+test.describe("Custom Cases For Cal Video Location", () => {
+  test("Cal Video", async ({ page }) => {
+    await login({ username: "pro", email: "pro@example.com", password: "pro" }, page);
+    await page.goto("/event-types");
+
+    // eslint-disable-next-line playwright/no-conditional-in-test
+    if (await page.getByRole("button", { name: "Update timezone" }).isVisible()) {
+      page.getByRole("button", { name: "Update timezone" }).click();
+    }
+
+    // Create a new event type
+    await page.getByTestId("new-event-type").click();
+    await page.getByPlaceholder("Quick Chat").click();
+    await page.getByPlaceholder("Quick Chat").fill("15 min test Cal Video (Global) location");
+    await page.getByRole("button", { name: "Continue" }).click();
+
+    // Select Cal Video (Global) location and check if the correct text is displayed
+    await page.locator("#location-select").click();
+    await getByExactText(page, "Cal Video (Global)").click();
+    verifyTextVisibility(page, "Cal Video");
+    await page.getByTestId("update-eventtype").click();
+    const page3Promise = page.waitForEvent("popup");
+    await page.getByTestId("preview-button").click();
+    const page3 = await page3Promise;
+
+    // Check if the correct text is displayed in the preview page
+    await expect(page3.getByText("Cal Video").last()).toBeVisible();
+    await page3.getByTestId("time").first().click();
+    await expect(page3.getByRole("paragraph").filter({ hasText: "Cal Video" })).toBeVisible();
+
+    await page3.getByTestId("confirm-book-button").click();
+    await page3.goto("/event-types");
+
+    await page3
+      .getByRole("link", {
+        name: "15 min test Cal Video (Global)",
+      })
+      .first()
+      .click();
+    await page3
+      .locator("header")
+      .filter({ hasText: "15 min test Cal Video (Global) locationSave" })
+      .getByRole("button")
+      .nth(2)
+      .click();
+    await page3.getByRole("button", { name: "Yes, delete" }).click();
+
+    // Cancel the meeting in upcoming bookings page
+    await page3.getByRole("link", { name: "Bookings" }).click();
+    await page3
+      .getByRole("row", {
+        name: "15 min test Cal Video (Global) location between Pro Example and Pro Example You and Pro Example Cancel Edit",
+      })
+      .first()
+      .getByTestId("cancel")
+      .click();
+    await page3.getByTestId("confirm_cancel").click();
+    await expect(page3.getByTestId("cancelled-headline")).toBeVisible();
+  });
+});

apps/web/playwright/booking/customLocations/customLocationsUtils.ts

@@ -0,0 +1,52 @@
+import { expect, type Page } from "@playwright/test";
+import type { Fixtures } from "playwright/lib/fixtures";
+
+import { loginUser } from "../utils/bookingUtils";
+
+export const editEventType = async (page: Page) => {
+  // Edit title
+  await page.getByLabel("Title").click();
+  await page.getByLabel("Title").fill("30 min test");
+
+  // Edit description
+  await page.locator("#event-type-form").getByRole("paragraph").click();
+  await page.locator("#event-type-form").getByRole("paragraph").fill("test");
+
+  // Click on markdown buttons
+  await page.locator("#event-type-form").getByRole("button").first().click();
+  await page.locator("#event-type-form").getByRole("button").nth(1).click();
+  await page.locator("#event-type-form").getByRole("button").nth(2).click();
+
+  // Edit url
+  await page.getByLabel("URL").click();
+  await page.getByLabel("URL").fill("30-min test");
+  await page.locator("#location-select").click();
+};
+
+export const loginAndGoToSetupBookingPage = async (page: Page, users: Fixtures["users"]) => {
+  loginUser(page, users);
+  await page.getByRole("link", { name: "30 min" }).click();
+
+  // Go to event type
+  await page.getByTestId("vertical-tab-event_setup_tab_title").click();
+};
+
+export const verifyTextVisibility = async (page: Page, text: string) => {
+  await expect(page.locator("div").filter({ hasText: text }).first()).toBeVisible();
+};
+
+// Helper function to get text with exact match
+export const getByExactText = (page: Page, text: string) => {
+  return page.getByText(text, { exact: true });
+};
+
+// Helper function to click Edit and then the location selector
+export const clickEditAndLocationSelect = async (page: Page) => {
+  await page.getByRole("button", { name: "Edit" }).click();
+  await page.locator("#location-select").click();
+};
+
+export const addAnotherLocation = async (page: Page) => {
+  await page.getByTestId("add-location").click();
+  await page.locator("#location-select").click();
+};

apps/web/playwright/booking/customLocations/in-address-attendee-address-location.e2e.ts

@@ -0,0 +1,69 @@
+import { expect } from "@playwright/test";
+
+import { login } from "../../fixtures/users";
+import { test } from "../../lib/fixtures";
+import { getByExactText, verifyTextVisibility } from "./customLocationsUtils";
+
+test.describe("Custom Cases For In Address (Attendee Address) Location", () => {
+  test("In Address (Attendee Address)", async ({ page }) => {
+    await login({ username: "pro", email: "pro@example.com", password: "pro" }, page);
+    await page.goto("/event-types");
+
+    // eslint-disable-next-line playwright/no-conditional-in-test
+    if (await page.getByRole("button", { name: "Update timezone" }).isVisible()) {
+      page.getByRole("button", { name: "Update timezone" }).click();
+    }
+
+    // Create a new event type
+    await page.getByTestId("new-event-type").click();
+    await page.getByPlaceholder("Quick Chat").click();
+    await page.getByPlaceholder("Quick Chat").fill("15 min test In Person (Attendee Address) location");
+    await page.getByRole("button", { name: "Continue" }).click();
+
+    // Select In Person (Attendee Address) location and check if the correct text is displayed
+    await page.locator("#location-select").click();
+    await getByExactText(page, "In Person (Attendee Address)").click();
+    verifyTextVisibility(page, "In Person (Attendee Address)");
+    await page.getByTestId("update-eventtype").click();
+    const page3Promise = page.waitForEvent("popup");
+    await page.getByTestId("preview-button").click();
+    const page3 = await page3Promise;
+
+    // Check if the correct text is displayed in the preview page
+    await expect(page3.getByText("In Person (Attendee Address)").last()).toBeVisible();
+    await page3.getByTestId("time").first().click();
+    await expect(
+      page3.getByRole("paragraph").filter({ hasText: "In Person (Attendee Address)" })
+    ).toBeVisible();
+    await page3.getByPlaceholder("Enter address").click();
+    await page3.getByPlaceholder("Enter address").fill("Test In Person Address");
+    await page3.getByTestId("confirm-book-button").click();
+    await page3.goto("/event-types");
+
+    await page3
+      .getByRole("link", {
+        name: "15 min test In Person (Attendee Address)",
+      })
+      .first()
+      .click();
+    await page3
+      .locator("header")
+      .filter({ hasText: "15 min test In Person (Attendee Address) locationSave" })
+      .getByRole("button")
+      .nth(2)
+      .click();
+    await page3.getByRole("button", { name: "Yes, delete" }).click();
+
+    // Cancel the meeting in upcoming bookings page
+    await page3.getByRole("link", { name: "Bookings" }).click();
+    await page3
+      .getByRole("row", {
+        name: "15 min test In Person (Attendee Address) location between Pro Example and Pro Example You and Pro Example Cancel Edit",
+      })
+      .first()
+      .getByTestId("cancel")
+      .click();
+    await page3.getByTestId("confirm_cancel").click();
+    await expect(page3.getByTestId("cancelled-headline")).toBeVisible();
+  });
+});

apps/web/playwright/booking/customLocations/in-address-organizer-address-location.e2e.ts

@@ -0,0 +1,138 @@
+import { expect } from "@playwright/test";
+
+import { login } from "../../fixtures/users";
+import { test } from "../../lib/fixtures";
+import { getByExactText, verifyTextVisibility } from "./customLocationsUtils";
+
+test.describe("Custom Cases For In Address (Organizer Address) Location", () => {
+  test("In Address (Organizer Address) - Display on booking page = true", async ({ page }) => {
+    await login({ username: "pro", email: "pro@example.com", password: "pro" }, page);
+    await page.goto("/event-types");
+
+    // eslint-disable-next-line playwright/no-conditional-in-test
+    if (await page.getByRole("button", { name: "Update timezone" }).isVisible()) {
+      page.getByRole("button", { name: "Update timezone" }).click();
+    }
+
+    // Create a new event type
+    await page.getByTestId("new-event-type").click();
+    await page.getByPlaceholder("Quick Chat").click();
+    await page.getByPlaceholder("Quick Chat").fill("15 min test In Person (Organizer Address) location");
+    await page.getByRole("button", { name: "Continue" }).click();
+
+    // Select In Address (Organizer Address) location and check if the correct text is displayed
+    await page.locator("#location-select").click();
+    await getByExactText(page, "In Person (Organizer Address)").click();
+    await page.getByLabel("Provide an Address or Place").dblclick();
+    await page.getByLabel("Provide an Address or Place").fill("Test In Person (Organizer address)");
+
+    // Select the display location checkbox to check if the correct text for this case is displayed
+    await page.getByTestId("display-location").check();
+    await page.getByTestId("update-location").click();
+    verifyTextVisibility(page, "In Person (Organizer Address)");
+    await page.getByTestId("update-eventtype").click();
+    const page3Promise = page.waitForEvent("popup");
+    await page.getByTestId("preview-button").click();
+    const page3 = await page3Promise;
+
+    // Check if the correct text is displayed in the preview page
+    await expect(page3.getByText("In Person (Organizer Address)").last()).toBeVisible();
+    await page3.getByTestId("time").first().click();
+    await expect(
+      page3.getByRole("paragraph").filter({ hasText: "In Person (Organizer Address)" })
+    ).toBeVisible();
+
+    await page3.getByTestId("confirm-book-button").click();
+    await page3.goto("/event-types");
+
+    await page3
+      .getByRole("link", {
+        name: "15 min test In Person (Organizer Address)",
+      })
+      .first()
+      .click();
+    await page3
+      .locator("header")
+      .filter({ hasText: "15 min test In Person (Organizer Address) locationSave" })
+      .getByRole("button")
+      .nth(2)
+      .click();
+    await page3.getByRole("button", { name: "Yes, delete" }).click();
+
+    // Cancel the meeting in upcoming bookings page
+    await page3.getByRole("link", { name: "Bookings" }).click();
+    await page3
+      .getByRole("row", {
+        name: "15 min test In Person (Organizer Address) location between Pro Example and Pro Example You and Pro Example Cancel Edit",
+      })
+      .first()
+      .getByTestId("cancel")
+      .click();
+    await page3.getByTestId("confirm_cancel").click();
+    await expect(page3.getByTestId("cancelled-headline")).toBeVisible();
+  });
+
+  test("In Address (Organizer Address) -  Display on booking page = false", async ({ page }) => {
+    await login({ username: "pro", email: "pro@example.com", password: "pro" }, page);
+    await page.goto("/event-types");
+
+    // eslint-disable-next-line playwright/no-conditional-in-test
+    if (await page.getByRole("button", { name: "Update timezone" }).isVisible()) {
+      page.getByRole("button", { name: "Update timezone" }).click();
+    }
+
+    // Create a new event type
+    await page.getByTestId("new-event-type").click();
+    await page.getByPlaceholder("Quick Chat").click();
+    await page.getByPlaceholder("Quick Chat").fill("15 min test In Person (Organizer Address) location");
+    await page.getByRole("button", { name: "Continue" }).click();
+
+    // Select In Person (Organizer Address) location and check if the correct text is displayed
+    await page.locator("#location-select").click();
+    await getByExactText(page, "In Person (Organizer Address)").click();
+    await page.getByLabel("Provide an Address or Place").dblclick();
+    await page.getByLabel("Provide an Address or Place").fill("Test In Person (Organizer address)");
+    await page.getByTestId("update-location").click();
+    verifyTextVisibility(page, "In Person (Organizer Address)");
+    await page.getByTestId("update-eventtype").click();
+    const page3Promise = page.waitForEvent("popup");
+    await page.getByTestId("preview-button").click();
+    const page3 = await page3Promise;
+
+    // Check if the correct text is displayed in the preview page
+    await expect(page3.getByText("In Person (Organizer Address)").last()).toBeVisible();
+    await page3.getByTestId("time").first().click();
+    await expect(
+      page3.getByRole("paragraph").filter({ hasText: "In Person (Organizer Address)" })
+    ).toBeVisible();
+
+    await page3.getByTestId("confirm-book-button").click();
+    await page3.goto("/event-types");
+
+    await page3
+      .getByRole("link", {
+        name: "15 min test In Person (Organizer Address)",
+      })
+      .first()
+      .click();
+    await page3
+      .locator("header")
+      .filter({ hasText: "15 min test In Person (Organizer Address) locationSave" })
+      .getByRole("button")
+      .nth(2)
+      .click();
+    await page3.getByRole("button", { name: "Yes, delete" }).click();
+
+    // Cancel the meeting in upcoming bookings page
+    await page3.getByRole("link", { name: "Bookings" }).click();
+    await page3
+      .getByRole("row", {
+        name: "15 min test In Person (Organizer Address) location between Pro Example and Pro Example You and Pro Example Cancel Edit",
+      })
+      .first()
+      .getByTestId("cancel")
+      .click();
+    await page3.getByTestId("confirm_cancel").click();
+    await expect(page3.getByTestId("cancelled-headline")).toBeVisible();
+  });
+});

apps/web/playwright/booking/customLocations/link-meeting-location.e2e.ts

@@ -0,0 +1,144 @@
+import { expect } from "@playwright/test";
+
+import { login } from "../../fixtures/users";
+import { test } from "../../lib/fixtures";
+import { getByExactText, verifyTextVisibility } from "./customLocationsUtils";
+
+test.describe("Custom Cases For Link Meeting Location", () => {
+  test("Link Meeting - Display on booking page = true", async ({ page }) => {
+    await login({ username: "pro", email: "pro@example.com", password: "pro" }, page);
+    await page.goto("/event-types");
+
+    // eslint-disable-next-line playwright/no-conditional-in-test
+    if (await page.getByRole("button", { name: "Update timezone" }).isVisible()) {
+      page.getByRole("button", { name: "Update timezone" }).click();
+    }
+
+    // Create a new event type
+    await page.getByTestId("new-event-type").click();
+    await page.getByPlaceholder("Quick Chat").click();
+    await page.getByPlaceholder("Quick Chat").fill("15 min test Link Meeting location");
+    await page.getByRole("button", { name: "Continue" }).click();
+
+    // Select Meeting Link location and check if the correct text is displayed
+    await page.locator("#location-select").click();
+    await getByExactText(page, "Link meeting").click();
+    await page.getByLabel("Provide a Meeting Link").dblclick();
+    await page.getByLabel("Provide a Meeting Link").fill("Test Link Meeting");
+    await page.getByTestId("update-location").click();
+
+    // Check if the Invalid URL warning is showing correctly
+    await expect(page.getByText("Invalid URL")).toBeVisible();
+    await page.getByLabel("Provide a Meeting Link").fill("https:test.com");
+
+    // Select the display location checkbox to check if the correct text for this case is displayed
+    await page.getByTestId("display-location").check();
+    await page.getByTestId("update-location").click();
+    verifyTextVisibility(page, "Link Meeting");
+    await page.getByTestId("update-eventtype").click();
+    const page3Promise = page.waitForEvent("popup");
+    await page.getByTestId("preview-button").click();
+    const page3 = await page3Promise;
+
+    // Check if the correct text is displayed in the preview page
+    await expect(page3.getByText("Link Meeting").last()).toBeVisible();
+    await page3.getByTestId("time").first().click();
+    await expect(page3.getByRole("paragraph").filter({ hasText: "https:test.com" })).toBeVisible();
+
+    await page3.getByTestId("confirm-book-button").click();
+    await page3.goto("/event-types");
+
+    await page3
+      .getByRole("link", {
+        name: "15 min test Link Meeting",
+      })
+      .first()
+      .click();
+    await page3
+      .locator("header")
+      .filter({ hasText: "15 min test Link Meeting locationSave" })
+      .getByRole("button")
+      .nth(2)
+      .click();
+    await page3.getByRole("button", { name: "Yes, delete" }).click();
+
+    // Cancel the meeting in upcoming bookings page
+    await page3.getByRole("link", { name: "Bookings" }).click();
+    await page3
+      .getByRole("row", {
+        name: "15 min test Link Meeting location between Pro Example and Pro Example You and Pro Example Cancel Edit",
+      })
+      .first()
+      .getByTestId("cancel")
+      .click();
+    await page3.getByTestId("confirm_cancel").click();
+    await expect(page3.getByTestId("cancelled-headline")).toBeVisible();
+  });
+
+  test("Link Meeting - Display on booking page = false", async ({ page }) => {
+    await login({ username: "pro", email: "pro@example.com", password: "pro" }, page);
+    await page.goto("/event-types");
+
+    // eslint-disable-next-line playwright/no-conditional-in-test
+    if (await page.getByRole("button", { name: "Update timezone" }).isVisible()) {
+      page.getByRole("button", { name: "Update timezone" }).click();
+    }
+
+    // Create a new event type
+    await page.getByTestId("new-event-type").click();
+    await page.getByPlaceholder("Quick Chat").click();
+    await page.getByPlaceholder("Quick Chat").fill("15 min test Link Meeting location");
+    await page.getByRole("button", { name: "Continue" }).click();
+
+    // Select Meeting Link location and check if the correct text is displayed
+    await page.locator("#location-select").click();
+    await getByExactText(page, "Link meeting").click();
+    await page.getByLabel("Provide a Meeting Link").dblclick();
+    await page.getByLabel("Provide a Meeting Link").fill("Test Link Meeting");
+    await page.getByTestId("update-location").click();
+
+    // Check if the Invalid URL warning is showing correctly
+    await expect(page.getByText("Invalid URL")).toBeVisible();
+    await page.getByLabel("Provide a Meeting Link").fill("https:test.con");
+    await page.getByTestId("update-location").click();
+    verifyTextVisibility(page, "Link Meeting");
+    await page.getByTestId("update-eventtype").click();
+    const page3Promise = page.waitForEvent("popup");
+    await page.getByTestId("preview-button").click();
+    const page3 = await page3Promise;
+
+    // Check if the correct text is displayed in the preview page
+    await expect(page3.getByText("Link Meeting").last()).toBeVisible();
+    await page3.getByTestId("time").first().click();
+    await expect(page3.getByRole("paragraph").filter({ hasText: "Link Meeting" })).toBeVisible();
+
+    await page3.getByTestId("confirm-book-button").click();
+    await page3.goto("/event-types");
+
+    await page3
+      .getByRole("link", {
+        name: "15 min test Link Meeting",
+      })
+      .first()
+      .click();
+    await page3
+      .locator("header")
+      .filter({ hasText: "15 min test Link Meeting locationSave" })
+      .getByRole("button")
+      .nth(2)
+      .click();
+    await page3.getByRole("button", { name: "Yes, delete" }).click();
+
+    // Cancel the meeting in upcoming bookings page
+    await page3.getByRole("link", { name: "Bookings" }).click();
+    await page3
+      .getByRole("row", {
+        name: "15 min test Link Meeting location between Pro Example and Pro Example You and Pro Example Cancel Edit",
+      })
+      .first()
+      .getByTestId("cancel")
+      .click();
+    await page3.getByTestId("confirm_cancel").click();
+    await expect(page3.getByTestId("cancelled-headline")).toBeVisible();
+  });
+});

apps/web/playwright/booking/customLocations/organizer-phone-number.e2e.ts

@@ -0,0 +1,127 @@
+import { expect } from "@playwright/test";
+
+import { login } from "../../fixtures/users";
+import { test } from "../../lib/fixtures";
+import { getByExactText, verifyTextVisibility } from "./customLocationsUtils";
+
+test.describe("Custom Cases For Organizer Phone Number", () => {
+  test("Organizer Phone Number - Display on booking page = true", async ({ page }) => {
+    await login({ username: "pro", email: "pro@example.com", password: "pro" }, page);
+    await page.goto("/event-types");
+
+    // eslint-disable-next-line playwright/no-conditional-in-test
+    if (await page.getByRole("button", { name: "Update timezone" }).isVisible()) {
+      page.getByRole("button", { name: "Update timezone" }).click();
+    }
+
+    // Create a new event type
+    await page.getByTestId("new-event-type").click();
+    await page.getByPlaceholder("Quick Chat").click();
+    await page.getByPlaceholder("Quick Chat").fill("15 min test Organizer Phone Number location");
+    await page.getByRole("button", { name: "Continue" }).click();
+
+    // Select Organizer Phone Number location and check if the correct text is displayed
+    await page.locator("#location-select").click();
+    await getByExactText(page, "Organizer Phone Number").click();
+    await page.getByTestId("display-location").check();
+    await page.getByTestId("update-location").click();
+    verifyTextVisibility(page, "Organizer Phone Number");
+    await page.getByTestId("update-eventtype").click();
+    const page3Promise = page.waitForEvent("popup");
+    await page.getByTestId("preview-button").click();
+    const page3 = await page3Promise;
+
+    // Check if the correct text is displayed in the preview page
+    await expect(page3.getByText("Organizer Phone Number").last()).toBeVisible();
+    await page3.getByTestId("time").first().click();
+    await expect(page3.getByRole("paragraph").filter({ hasText: "Organizer Phone Number" })).toBeVisible();
+
+    await page3.getByTestId("confirm-book-button").click();
+    await page3.goto("/event-types");
+
+    await page3
+      .getByRole("link", {
+        name: "15 min test Organizer Phone Number",
+      })
+      .first()
+      .click();
+    await page3
+      .locator("header")
+      .filter({ hasText: "15 min test Organizer Phone Number locationSave" })
+      .getByRole("button")
+      .nth(2)
+      .click();
+    await page3.getByRole("button", { name: "Yes, delete" }).click();
+
+    // Cancel the meeting in upcoming bookings page
+    await page3.getByRole("link", { name: "Bookings" }).click();
+    await page3
+      .getByRole("row", {
+        name: "15 min test Organizer Phone Number location between Pro Example and Pro Example You and Pro Example Cancel Edit",
+      })
+      .first()
+      .getByTestId("cancel")
+      .click();
+    await page3.getByTestId("confirm_cancel").click();
+    await expect(page3.getByTestId("cancelled-headline")).toBeVisible();
+  });
+  test("Organizer Phone Number - Display on booking page = false", async ({ page }) => {
+    await login({ username: "pro", email: "pro@example.com", password: "pro" }, page);
+    await page.goto("/event-types");
+
+    // eslint-disable-next-line playwright/no-conditional-in-test
+    if (await page.getByRole("button", { name: "Update timezone" }).isVisible()) {
+      page.getByRole("button", { name: "Update timezone" }).click();
+    }
+
+    // Create a new event type
+    await page.getByTestId("new-event-type").click();
+    await page.getByPlaceholder("Quick Chat").click();
+    await page.getByPlaceholder("Quick Chat").fill("15 min test Organizer Phone Number location");
+    await page.getByRole("button", { name: "Continue" }).click();
+
+    // Select Organizer Phone Number location and check if the correct text is displayed
+    await page.locator("#location-select").click();
+    await getByExactText(page, "Organizer Phone Number").click();
+    await page.getByTestId("update-location").click();
+    verifyTextVisibility(page, "Organizer Phone Number");
+    await page.getByTestId("update-eventtype").click();
+    const page3Promise = page.waitForEvent("popup");
+    await page.getByTestId("preview-button").click();
+    const page3 = await page3Promise;
+
+    // Check if the correct text is displayed in the preview page
+    await expect(page3.getByText("Organizer Phone Number").last()).toBeVisible();
+    await page3.getByTestId("time").first().click();
+    await expect(page3.getByRole("paragraph").filter({ hasText: "Organizer Phone Number" })).toBeVisible();
+
+    await page3.getByTestId("confirm-book-button").click();
+    await page3.goto("/event-types");
+
+    await page3
+      .getByRole("link", {
+        name: "15 min test Organizer Phone Number",
+      })
+      .first()
+      .click();
+    await page3
+      .locator("header")
+      .filter({ hasText: "15 min test Organizer Phone Number locationSave" })
+      .getByRole("button")
+      .nth(2)
+      .click();
+    await page3.getByRole("button", { name: "Yes, delete" }).click();
+
+    // Cancel the meeting in upcoming bookings page
+    await page3.getByRole("link", { name: "Bookings" }).click();
+    await page3
+      .getByRole("row", {
+        name: "15 min test Organizer Phone Number location between Pro Example and Pro Example You and Pro Example Cancel Edit",
+      })
+      .first()
+      .getByTestId("cancel")
+      .click();
+    await page3.getByTestId("confirm_cancel").click();
+    await expect(page3.getByTestId("cancelled-headline")).toBeVisible();
+  });
+});

apps/web/playwright/booking/utils/bookingUtils.ts

@@ -0,0 +1,244 @@
+import { expect, type Page } from "@playwright/test";
+
+import type { Fixtures } from "@calcom/web/playwright/lib/fixtures";
+
+export const EMAIL = "test@test.com";
+export const EMAIL2 = "test2@test.com";
+export const PHONE = "+55 (32) 983289947";
+export const scheduleSuccessfullyText = "This meeting is scheduled";
+export const reschedulePlaceholderText = "Let others know why you need to reschedule";
+
+interface QuestionActions {
+  [key: string]: () => Promise<void>;
+}
+
+type BookingOptions = {
+  hasPlaceholder?: boolean;
+  isReschedule?: boolean;
+  isRequired?: boolean;
+};
+
+type customLocators = {
+  shouldChangeSelectLocator: boolean;
+  shouldUseLastRadioGroupLocator: boolean;
+  shouldUseFirstRadioGroupLocator: boolean;
+  shouldChangeMultiSelectLocator: boolean;
+};
+
+export const loginUser = async (page: Page, users: Fixtures["users"]) => {
+  const pro = await users.create({ name: "testuser" });
+  await pro.apiLogin();
+  await page.goto("/event-types");
+};
+
+const fillQuestion = async (eventTypePage: Page, questionType: string, customLocators: customLocators) => {
+  const questionActions: QuestionActions = {
+    phone: async () => {
+      await eventTypePage.locator('input[name="phone-test"]').clear();
+      await eventTypePage.locator('input[name="phone-test"]').fill(PHONE);
+    },
+    multiemail: async () => {
+      await eventTypePage.getByRole("button", { name: `${questionType} test` }).click();
+      await eventTypePage.getByPlaceholder(`${questionType} test`).fill(EMAIL);
+      await eventTypePage.getByTestId("add-another-guest").last().click();
+      await eventTypePage.getByPlaceholder(`${questionType} test`).last().fill(EMAIL2);
+    },
+    checkbox: async () => {
+      if (customLocators.shouldUseLastRadioGroupLocator || customLocators.shouldChangeMultiSelectLocator) {
+        await eventTypePage.getByLabel("Option 1").last().click();
+        await eventTypePage.getByLabel("Option 2").last().click();
+      } else if (customLocators.shouldUseFirstRadioGroupLocator) {
+        await eventTypePage.getByLabel("Option 1").first().click();
+        await eventTypePage.getByLabel("Option 2").first().click();
+      } else {
+        await eventTypePage.getByLabel("Option 1").click();
+        await eventTypePage.getByLabel("Option 2").click();
+      }
+    },
+    multiselect: async () => {
+      if (customLocators.shouldChangeMultiSelectLocator) {
+        await eventTypePage.locator("form svg").nth(1).click();
+        await eventTypePage.getByTestId("select-option-Option 1").click();
+      } else {
+        await eventTypePage.locator("form svg").last().click();
+        await eventTypePage.getByTestId("select-option-Option 1").click();
+      }
+    },
+    boolean: async () => {
+      await eventTypePage.getByLabel(`${questionType} test`).check();
+    },
+    radio: async () => {
+      await eventTypePage.locator('[id="radio-test\\.option\\.0\\.radio"]').click();
+    },
+    select: async () => {
+      if (customLocators.shouldChangeSelectLocator) {
+        await eventTypePage.locator("form svg").nth(1).click();
+        await eventTypePage.getByTestId("select-option-Option 1").click();
+      } else {
+        await eventTypePage.locator("form svg").last().click();
+        await eventTypePage.getByTestId("select-option-Option 1").click();
+      }
+    },
+    number: async () => {
+      await eventTypePage.getByPlaceholder(`${questionType} test`).click();
+      await eventTypePage.getByPlaceholder(`${questionType} test`).fill("123");
+    },
+    address: async () => {
+      await eventTypePage.getByPlaceholder(`${questionType} test`).click();
+      await eventTypePage.getByPlaceholder(`${questionType} test`).fill("address test");
+    },
+    textarea: async () => {
+      await eventTypePage.getByPlaceholder(`${questionType} test`).click();
+      await eventTypePage.getByPlaceholder(`${questionType} test`).fill("textarea test");
+    },
+    text: async () => {
+      await eventTypePage.getByPlaceholder(`${questionType} test`).click();
+      await eventTypePage.getByPlaceholder(`${questionType} test`).fill("text test");
+    },
+  };
+
+  if (questionActions[questionType]) {
+    await questionActions[questionType]();
+  }
+};
+
+export const fillAndConfirmBooking = async (
+  eventTypePage: Page,
+  placeholderText: string,
+  question: string,
+  fillText: string,
+  secondQuestion: string,
+  options: BookingOptions
+) => {
+  const confirmButton = options.isReschedule ? "confirm-reschedule-button" : "confirm-book-button";
+
+  await expect(eventTypePage.getByText(`${secondQuestion} test`).first()).toBeVisible();
+  await eventTypePage.getByPlaceholder(placeholderText).fill(fillText);
+
+  // Change the selector for specifics cases related to select question
+  const shouldChangeSelectLocator = (question: string, secondQuestion: string): boolean =>
+    question === "select" && ["multiemail", "multiselect"].includes(secondQuestion);
+
+  const shouldUseLastRadioGroupLocator = (question: string, secondQuestion: string): boolean =>
+    question === "radio" && secondQuestion === "checkbox";
+
+  const shouldUseFirstRadioGroupLocator = (question: string, secondQuestion: string): boolean =>
+    question === "checkbox" && secondQuestion === "radio";
+
+  const shouldChangeMultiSelectLocator = (question: string, secondQuestion: string): boolean =>
+    question === "multiselect" && ["address", "checkbox", "multiemail", "select"].includes(secondQuestion);
+
+  const customLocators = {
+    shouldChangeSelectLocator: shouldChangeSelectLocator(question, secondQuestion),
+    shouldUseLastRadioGroupLocator: shouldUseLastRadioGroupLocator(question, secondQuestion),
+    shouldUseFirstRadioGroupLocator: shouldUseFirstRadioGroupLocator(question, secondQuestion),
+    shouldChangeMultiSelectLocator: shouldChangeMultiSelectLocator(question, secondQuestion),
+  };
+
+  // Fill the first question
+  await fillQuestion(eventTypePage, question, customLocators);
+
+  // Fill the second question if is required
+  options.isRequired && (await fillQuestion(eventTypePage, secondQuestion, customLocators));
+
+  await eventTypePage.getByTestId(confirmButton).click();
+  const scheduleSuccessfullyPage = eventTypePage.getByText(scheduleSuccessfullyText);
+  await scheduleSuccessfullyPage.waitFor({ state: "visible" });
+  await expect(scheduleSuccessfullyPage).toBeVisible();
+};
+
+export const initialCommonSteps = async (
+  bookingPage: Page,
+  question: string,
+  users: Fixtures["users"],
+  secondQuestion: string,
+  message: string,
+  options: BookingOptions
+) => {
+  const firstQuestionHasPlaceholder = [
+    "address",
+    "textarea",
+    "multiemail",
+    "number",
+    "text",
+    "phone",
+  ].includes(question);
+
+  //Logs in a test user and navigates to the event types page.
+  loginUser(bookingPage, users);
+
+  // Go to event type settings
+  await bookingPage.getByRole("link", { name: "30 min" }).click();
+
+  // Go to advanced tab
+  await bookingPage.getByTestId("vertical-tab-event_advanced_tab_title").click();
+
+  // Add first and second question and fill both
+  await bookingPage.getByTestId("add-field").click();
+  await bookingPage.locator("#test-field-type > .bg-default > div > div:nth-child(2)").first().click();
+  await bookingPage.getByTestId(`select-option-${question}`).click();
+  await bookingPage.getByLabel("Identifier").dblclick();
+  await bookingPage.getByLabel("Identifier").fill(`${question}-test`);
+  await bookingPage.getByLabel("Label").click();
+  await bookingPage.getByLabel("Label").fill(`${question} test`);
+
+  // Fill the placeholder if the question has one
+  if (firstQuestionHasPlaceholder) {
+    await bookingPage.getByLabel("Placeholder").click();
+    await bookingPage.getByLabel("Placeholder").fill(`${question} test`);
+  }
+  await bookingPage.getByTestId("field-add-save").click();
+  await bookingPage.getByTestId("add-field").click();
+  await bookingPage.locator("#test-field-type > .bg-default > div > div:nth-child(2)").first().click();
+  await bookingPage.getByTestId(`select-option-${secondQuestion}`).click();
+  await bookingPage.getByLabel("Identifier").dblclick();
+  await bookingPage.getByLabel("Identifier").fill(`${secondQuestion}-test`);
+  await bookingPage.getByLabel("Label").click();
+  await bookingPage.getByLabel("Label").fill(`${secondQuestion} test`);
+  if (options.hasPlaceholder) {
+    await bookingPage.getByLabel("Placeholder").dblclick();
+    await bookingPage.getByLabel("Placeholder").fill(`${secondQuestion} test`);
+  }
+  if (!options.isRequired) {
+    await bookingPage.getByRole("radio", { name: "No" }).click();
+  }
+  await bookingPage.getByTestId("field-add-save").click();
+  await expect(bookingPage.getByTestId(`field-${question}-test`)).toBeVisible();
+  await expect(bookingPage.getByTestId(`field-${secondQuestion}-test`)).toBeVisible();
+  await bookingPage.getByTestId("update-eventtype").click();
+
+  // Go to booking page
+  const eventtypePromise = bookingPage.waitForEvent("popup");
+  await bookingPage.getByTestId("preview-button").click();
+  const eventTypePage = await eventtypePromise;
+
+  // Select the first available time
+  await eventTypePage.getByTestId("time").first().click();
+  fillAndConfirmBooking(
+    eventTypePage,
+    "Please share anything that will help prepare for our meeting.",
+    question,
+    message,
+    secondQuestion,
+    options
+  );
+
+  // Go to final steps
+  await rescheduleAndCancel(eventTypePage);
+};
+export const rescheduleAndCancel = async (eventTypePage: Page) => {
+  await eventTypePage.getByText("Reschedule").click();
+  await eventTypePage.getByTestId("time").first().click();
+  await eventTypePage.getByPlaceholder(reschedulePlaceholderText).click();
+  await eventTypePage.getByPlaceholder(reschedulePlaceholderText).fill("Test reschedule");
+  await eventTypePage.getByTestId("confirm-reschedule-button").click();
+
+  // Check if the rescheduled page is visible
+  await expect(eventTypePage.getByText(scheduleSuccessfullyText)).toBeVisible();
+  await eventTypePage.getByTestId("cancel").click();
+  await eventTypePage.getByTestId("cancel_reason").fill("Test cancel");
+  await eventTypePage.getByTestId("confirm_cancel").click();
+
+  // Check if the cancelled page is visible
+  await expect(eventTypePage.getByTestId("cancelled-headline")).toBeVisible();
+};