Requested changes

2023-12-02 19:24:22 +00:00 · 2023-12-02 19:24:22 +00:00 · d3519d4ecc
parent e63cb91586
commit d3519d4ecc
5 changed files with 108 additions and 91 deletions
--- a/apps/web/playwright/booking/availability.e2e.ts
+++ b/apps/web/playwright/booking/availability.e2e.ts
@ -2,14 +2,14 @@ import { loginUser } from "../fixtures/regularBookings";
 import { test } from "../lib/fixtures";

 test.describe("Check availability tab in a event-type", () => {
-  test("Check availability in event type", async ({ bookingPage, users, page }) => {
+  test("Check availability in event type", async ({ eventTypePage, users }) => {
    await loginUser(users);
-    await bookingPage.goToEventTypesPage();
+    await eventTypePage.goToEventTypesPage();

-    await bookingPage.goToEventType("30 min");
-    await bookingPage.goToTab("availability");
-    await bookingPage.checkAvailabilityTab();
-    await bookingPage.goToAvailabilityPage();
-    await bookingPage.checkAvailabilityPage();
+    await eventTypePage.goToEventType("30 min");
+    await eventTypePage.goToTab("availability");
+    await eventTypePage.checkAvailabilityTab();
+    await eventTypePage.goToAvailabilityPage();
+    await eventTypePage.checkAvailabilityPage();
  });
 });
--- a/apps/web/playwright/fixtures/eventTypes.ts
+++ b/apps/web/playwright/fixtures/eventTypes.ts
@ -0,0 +1,94 @@
+import { expect, type Page } from "@playwright/test";
+
+import { localize } from "../lib/testUtils";
+
+export function createEventTypeFixture(page: Page) {
+  return {
+    goToEventType: async (eventType: string) => {
+      await page.getByRole("link", { name: eventType }).click();
+    },
+    goToTab: async (tabName: string) => {
+      await page.getByTestId(`vertical-tab-${tabName}`).click();
+    },
+    goToEventTypesPage: async () => {
+      await page.goto("/event-types");
+    },
+    checkAvailabilityTab: async () => {
+      const editAvailability = (await localize("en"))("edit_availability");
+
+      // Verify if the icon is rendered
+      await expect(page.locator("span").filter({ hasText: "Europe/London" }).locator("svg")).toBeVisible();
+      await expect(page.getByText("Europe/London")).toBeVisible();
+      await page.getByRole("link", { name: editAvailability }).click();
+    },
+    goToAvailabilityPage: async () => {
+      const workingHours = (await localize("en"))("default_schedule_name");
+
+      await page.goto("/availability");
+      await page
+        .getByTestId("schedules")
+        .locator("div")
+        .filter({
+          hasText: workingHours,
+        })
+        .first()
+        .click();
+    },
+    checkAvailabilityPage: async () => {
+      const sunday = (await localize("en"))("sunday");
+      const monday = (await localize("en"))("monday");
+      const wednesday = (await localize("en"))("wednesday");
+      const saturday = (await localize("en"))("saturday");
+      const save = (await localize("en"))("save");
+      const copyTimesTo = (await localize("en"))("copy_times_to");
+      const availabilityUpdatedSuccessfully = (await localize("en"))("availability_updated_successfully");
+
+      await page.getByTestId("availablity-title").click();
+      // change availability name
+      await page.getByTestId("availablity-title").fill("Working Hours test");
+      await expect(page.getByTestId("subtitle")).toBeVisible();
+      await page.locator("label").filter({ hasText: sunday }).getByRole("switch").click();
+      await page.locator("div").filter({ hasText: monday }).first().click();
+      await page.locator("label").filter({ hasText: wednesday }).getByRole("switch").click();
+      await page.locator("label").filter({ hasText: saturday }).getByRole("switch").click();
+      await page
+        .locator("div")
+        .filter({ hasText: "Sunday9:00am - 5:00pm" })
+        .getByTestId("add-time-availability")
+        .first()
+        .click();
+      await expect(page.locator("div").filter({ hasText: "6:00pm" }).nth(1)).toBeVisible();
+      await page.getByRole("button", { name: save }).click();
+      await expect(page.getByText("Sun - Tue, Thu - Sat, 9:00 AM - 5:00 PM")).toBeVisible();
+      await expect(page.getByText("Sun, 5:00 PM - 6:00 PM")).toBeVisible();
+      await page
+        .locator("div")
+        .filter({ hasText: "Sunday9:00am - 5:00pm" })
+        .getByTestId("copy-button")
+        .first()
+        .click();
+      await expect(page.getByText(copyTimesTo)).toBeVisible();
+      await page.getByRole("checkbox", { name: monday }).check();
+      await page.getByRole("button", { name: "Apply" }).click();
+      await page.getByRole("button", { name: save }).click();
+      await page
+        .locator("#availability-form div")
+        .filter({ hasText: "TimezoneEurope/London" })
+        .locator("svg")
+        .click();
+      await page.locator("#react-select-3-input").fill("bras");
+      await page.getByTestId("select-option-America/Sao_Paulo").click();
+      await page.getByRole("button", { name: save }).click();
+      await expect(page.getByTestId("toast-success").last()).toBeVisible();
+      await page.getByTestId("add-override").click();
+      await page.getByTestId("incrementMonth").click();
+      await page.getByRole("button", { name: "20" }).click();
+      await page.getByTestId("date-override-mark-unavailable").click();
+      await page.getByTestId("add-override-submit-btn").click();
+      await page.getByTestId("dialog-rejection").click();
+      await page.getByTestId("date-overrides-list").getByRole("button").nth(1).click();
+      await page.getByRole("button", { name: save }).click();
+      await expect(page.getByTestId("toast-success").last()).toBeVisible();
+    },
+  };
+}
--- a/apps/web/playwright/fixtures/regularBookings.ts
+++ b/apps/web/playwright/fixtures/regularBookings.ts
@ -2,7 +2,6 @@ import { expect, type Page } from "@playwright/test";

 import dayjs from "@calcom/dayjs";

-import { localize } from "../lib/testUtils";
 import type { createUsersFixture } from "./users";

 const reschedulePlaceholderText = "Let others know why you need to reschedule";
@ -198,9 +197,6 @@ export function createBookingPageFixture(page: Page) {
    goToTab: async (tabName: string) => {
      await page.getByTestId(`vertical-tab-${tabName}`).click();
    },
-    goToEventTypesPage: async () => {
-      await page.goto("/event-types");
-    },
    addQuestion: async (
      questionType: string,
      identifier: string,
@ -361,84 +357,5 @@ export function createBookingPageFixture(page: Page) {
      await scheduleSuccessfullyPage.waitFor({ state: "visible" });
      await expect(scheduleSuccessfullyPage).toBeVisible();
    },
-    checkAvailabilityTab: async () => {
-      const editAvailability = (await localize("en"))("edit_availability");
-
-      // verify if the icon is rendered
-      await expect(page.locator("span").filter({ hasText: "Europe/London" }).locator("svg")).toBeVisible();
-      await expect(page.getByText("Europe/London")).toBeVisible();
-      await page.getByRole("link", { name: editAvailability }).click();
-    },
-    goToAvailabilityPage: async () => {
-      const workingHours = (await localize("en"))("default_schedule_name");
-
-      await page.goto("/availability");
-      await page
-        .getByTestId("schedules")
-        .locator("div")
-        .filter({
-          hasText: workingHours,
-        })
-        .first()
-        .click();
-    },
-    checkAvailabilityPage: async () => {
-      const sunday = (await localize("en"))("sunday");
-      const monday = (await localize("en"))("monday");
-      const wednesday = (await localize("en"))("wednesday");
-      const saturday = (await localize("en"))("saturday");
-      const save = (await localize("en"))("save");
-
-      await page.getByTestId("availablity-title").click();
-      // change availability name
-      await page.getByTestId("availablity-title").fill("Working Hours test");
-      await expect(page.getByText("Mon - Fri, 9:00 AM - 5:00 PM")).toBeVisible();
-      await page.locator("label").filter({ hasText: sunday }).getByRole("switch").click();
-      await page.locator("div").filter({ hasText: monday }).first().click();
-      await page.locator("label").filter({ hasText: wednesday }).getByRole("switch").click();
-      await page.locator("label").filter({ hasText: saturday }).getByRole("switch").click();
-      await page
-        .locator("div")
-        .filter({ hasText: "Sunday9:00am - 5:00pm" })
-        .getByTestId("add-time-availability")
-        .first()
-        .click();
-      await expect(page.locator("div").filter({ hasText: "6:00pm" }).nth(1)).toBeVisible();
-      await page.getByRole("button", { name: save }).click();
-      await expect(page.getByText("Sun - Tue, Thu - Sat, 9:00 AM - 5:00 PM")).toBeVisible();
-      await expect(page.getByText("Sun, 5:00 PM - 6:00 PM")).toBeVisible();
-      await page
-        .locator("div")
-        .filter({ hasText: "Sunday9:00am - 5:00pm" })
-        .getByTestId("copy-button")
-        .first()
-        .click();
-      await expect(
-        page.getByText("Copy times toSelect AllSundayMondayTuesdayWednesdayThursdayFridaySaturday")
-      ).toBeVisible();
-      await page.getByRole("checkbox", { name: monday }).check();
-      await page.getByRole("button", { name: "Apply" }).click();
-      await page.getByRole("button", { name: save }).click();
-      await page
-        .locator("#availability-form div")
-        .filter({ hasText: "TimezoneEurope/London" })
-        .locator("svg")
-        .click();
-      await page.locator("#react-select-3-input").fill("bras");
-      await page.getByTestId("select-option-America/Sao_Paulo").click();
-      await page.getByRole("button", { name: save }).click();
-      await expect(
-        page.getByRole("button", { name: "Working Hours test schedule updated successfully" }).nth(1)
-      ).toBeVisible();
-      await page.getByTestId("add-override").click();
-      await page.getByTestId("incrementMonth").click();
-      await page.getByRole("button", { name: "20" }).click();
-      await page.getByTestId("date-override-mark-unavailable").click();
-      await page.getByTestId("add-override-submit-btn").click();
-      await page.getByTestId("dialog-rejection").click();
-      await page.getByRole("heading", { name: "Wed, 20 December" }).click();
-      await page.getByTestId("date-overrides-list").getByRole("button").nth(1).click();
-      await page.getByRole("button", { name: save }).click();
-    },
  };
 }
--- a/apps/web/playwright/lib/fixtures.ts
+++ b/apps/web/playwright/lib/fixtures.ts
@ -10,6 +10,7 @@ import prisma from "@calcom/prisma";
 import type { ExpectedUrlDetails } from "../../../../playwright.config";
 import { createBookingsFixture } from "../fixtures/bookings";
 import { createEmbedsFixture } from "../fixtures/embeds";
+import { createEventTypeFixture } from "../fixtures/eventTypes";
 import { createFeatureFixture } from "../fixtures/features";
 import { createOrgsFixture } from "../fixtures/orgs";
 import { createPaymentsFixture } from "../fixtures/payments";
@ -31,6 +32,7 @@ export interface Fixtures {
  routingForms: ReturnType<typeof createRoutingFormsFixture>;
  bookingPage: ReturnType<typeof createBookingPageFixture>;
  features: ReturnType<typeof createFeatureFixture>;
+  eventTypePage: ReturnType<typeof createEventTypeFixture>;
 }

 declare global {
@ -102,4 +104,8 @@ export const test = base.extend<Fixtures>({
    await features.init();
    await use(features);
  },
+  eventTypePage: async ({ page }, use) => {
+    const eventTypePage = createEventTypeFixture(page);
+    await use(eventTypePage);
+  },
 });
--- a/packages/features/shell/Shell.tsx
+++ b/packages/features/shell/Shell.tsx
@ -972,7 +972,7 @@ export function ShellMain(props: LayoutProps) {
                  </h3>
                )}
                {props.subtitle && (
-                  <p className="text-default hidden text-sm md:block">
+                  <p className="text-default hidden text-sm md:block" data-testid="subtitle">
                    {!isLocaleReady ? <SkeletonText invisible /> : props.subtitle}
                  </p>
                )}