fix: Refactored availability tests for less flakiness (#13518)

* fix: Refactored availability tests for less flakiness

* Fixed type error

* Removed redundant locator

* fix: Commit updated yarn.lock file

---------

Co-authored-by: Keith Williams <keithwillcode@gmail.com>
This commit is contained in:
Alex van Andel
2024-02-05 16:00:49 +00:00
committed by GitHub
co-authored by Keith Williams
parent 4fe75771b8
commit 8d7fb75f71
5 changed files with 4859 additions and 202 deletions
+10 -2
View File
@@ -295,7 +295,10 @@ export default function Availability() {
<div className="min-w-40 col-span-3 space-y-2 px-2 py-4 lg:col-span-1">
<div className="xl:max-w-80 w-full pr-4 sm:ml-0 sm:mr-36 sm:p-0">
<div>
<Skeleton as={Label} htmlFor="timeZone" className="mb-0 inline-block leading-none">
<Skeleton
as={Label}
htmlFor="timeZone-sm-viewport"
className="mb-0 inline-block leading-none">
{t("timezone")}
</Skeleton>
<Controller
@@ -304,6 +307,7 @@ export default function Availability() {
render={({ field: { onChange, value } }) =>
value ? (
<TimezoneSelect
inputId="timeZone-sm-viewport"
value={value}
className="focus:border-brand-default border-default mt-1 block w-72 rounded-md text-sm"
onChange={(timezone) => onChange(timezone.value)}
@@ -382,7 +386,10 @@ export default function Availability() {
<div className="min-w-40 col-span-3 hidden space-y-2 md:block lg:col-span-1">
<div className="xl:max-w-80 w-full pr-4 sm:ml-0 sm:mr-36 sm:p-0">
<div>
<Skeleton as={Label} htmlFor="timeZone" className="mb-0 inline-block leading-none">
<Skeleton
as={Label}
htmlFor="timeZone-lg-viewport"
className="mb-0 inline-block leading-none">
{t("timezone")}
</Skeleton>
<Controller
@@ -390,6 +397,7 @@ export default function Availability() {
render={({ field: { onChange, value } }) =>
value ? (
<TimezoneSelect
inputId="timeZone-lg-viewport"
value={value}
className="focus:border-brand-default border-default mt-1 block w-72 rounded-md text-sm"
onChange={(timezone) => onChange(timezone.value)}
+71 -11
View File
@@ -3,6 +3,7 @@ import { expect } from "@playwright/test";
import dayjs from "@calcom/dayjs";
import { test } from "./lib/fixtures";
import { localize } from "./lib/testUtils";
test.describe.configure({ mode: "parallel" });
@@ -21,14 +22,14 @@ test.describe("Availablity tests", () => {
test("Date Overrides", async ({ page }) => {
await test.step("Can add a date override", async () => {
await page.locator('[data-testid="schedules"] > li a').click();
await page.locator('[data-testid="add-override"]').click();
await page.getByTestId("schedules").first().click();
await page.getByTestId("add-override").click();
await page.locator('[id="modal-title"]').waitFor();
await page.locator('[data-testid="incrementMonth"]').click();
await page.locator('[data-testid="day"][data-disabled="false"]').nth(0).click();
await page.locator('[data-testid="date-override-mark-unavailable"]').click();
await page.locator('[data-testid="add-override-submit-btn"]').click();
await page.locator('[data-testid="dialog-rejection"]').click();
await page.getByTestId("incrementMonth").click();
await page.locator('[data-testid="day"][data-disabled="false"]').first().click();
await page.getByTestId("date-override-mark-unavailable").click();
await page.getByTestId("add-override-submit-btn").click();
await page.getByTestId("dialog-rejection").click();
await expect(page.locator('[data-testid="date-overrides-list"] > li')).toHaveCount(1);
await page.locator('[form="availability-form"][type="submit"]').click();
});
@@ -45,12 +46,12 @@ test.describe("Availablity tests", () => {
});
});
test("Availability pages", async ({ page }) => {
test("Schedule listing", async ({ page }) => {
await test.step("Can add a new schedule", async () => {
await page.locator('[data-testid="new-schedule"]').click();
await page.getByTestId("new-schedule").click();
await page.locator('[id="name"]').fill("More working hours");
page.locator('[type="submit"]').click();
await expect(page.locator("[data-testid=availablity-title]")).toHaveValue("More working hours");
await expect(page.getByTestId("availablity-title")).toHaveValue("More working hours");
});
await test.step("Can delete a schedule", async () => {
await page.getByRole("button", { name: /Go Back/i }).click();
@@ -61,7 +62,7 @@ test.describe("Availablity tests", () => {
await expect(page.locator('[data-testid="schedules"] > li').nth(1)).toHaveCount(0);
});
await test.step("Cannot delete a schedule if a single schedule is present", async () => {
await test.step("Cannot delete the last schedule", async () => {
await page.locator('[data-testid="schedules"] > li').nth(0).getByTestId("schedule-more").click();
await page.locator('[data-testid="delete-schedule"]').click();
const toast = await page.waitForSelector('[data-testid="toast-error"]');
@@ -70,4 +71,63 @@ test.describe("Availablity tests", () => {
await expect(page.locator('[data-testid="schedules"] > li').nth(0)).toHaveCount(1);
});
});
test("Can manage single schedule", async ({ page }) => {
await page.getByTestId("schedules").first().click();
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");
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.getByTestId(sunday).getByRole("switch").click();
await page.getByTestId(monday).first().click();
await page.getByTestId(wednesday).getByRole("switch").click();
await page.getByTestId(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("[id=timeZone-lg-viewport]").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();
});
});
@@ -9,7 +9,5 @@ test.describe("Check availability tab in a event-type", () => {
await eventTypePage.goToEventType("30 min");
await eventTypePage.goToTab("availability");
await eventTypePage.checkAvailabilityTab();
await eventTypePage.goToAvailabilityPage();
await eventTypePage.checkAvailabilityPage();
});
});
@@ -34,60 +34,5 @@ export function createEventTypeFixture(page: Page) {
.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");
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.getByTestId(sunday).getByRole("switch").click();
await page.getByTestId(monday).first().click();
await page.getByTestId(wednesday).getByRole("switch").click();
await page.getByTestId(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();
},
};
}
+4778 -132
View File
File diff suppressed because it is too large Load Diff