From 398e00afed16674250f29ce0a2d26c6a9dc6a0f5 Mon Sep 17 00:00:00 2001 From: gitstart-calcom Date: Fri, 20 Oct 2023 19:15:06 +0000 Subject: [PATCH] update branch --- .../playwright/booking/allQuestions.e2e.ts | 107 +++++++++ .../bookingWithAllQuestions.e2e.ts | 45 ---- .../playwright/booking/utils/bookingUtils.ts | 212 ------------------ .../booking/utils/scheduleAllBookings.ts | 138 ------------ 4 files changed, 107 insertions(+), 395 deletions(-) create mode 100644 apps/web/playwright/booking/allQuestions.e2e.ts delete mode 100644 apps/web/playwright/booking/allQuestionse2e/bookingWithAllQuestions.e2e.ts delete mode 100644 apps/web/playwright/booking/utils/bookingUtils.ts delete mode 100644 apps/web/playwright/booking/utils/scheduleAllBookings.ts diff --git a/apps/web/playwright/booking/allQuestions.e2e.ts b/apps/web/playwright/booking/allQuestions.e2e.ts new file mode 100644 index 0000000000..490ed14e8c --- /dev/null +++ b/apps/web/playwright/booking/allQuestions.e2e.ts @@ -0,0 +1,107 @@ +/* eslint-disable playwright/no-conditional-in-test */ +import { loginUser } from "../fixtures/regularBookings"; +import { test } from "../lib/fixtures"; + +test.describe("Booking With All Questions", () => { + test.beforeEach(async ({ page, users, bookingPage }) => { + await loginUser(users); + await page.goto("/event-types"); + await bookingPage.goToEventType("30 min"); + await bookingPage.goToTab("event_advanced_tab_title"); + }); + + const bookingOptions = { isAllRequired: true }; + + test("Selecting and filling all questions as required", async ({ bookingPage }) => { + const allQuestions = [ + "phone", + "address", + "checkbox", + "boolean", + "textarea", + "multiemail", + "multiselect", + "number", + "radio", + "select", + "text", + ]; + for (const question of allQuestions) { + // Check if all questions have isRequired set to true + if (bookingOptions.isAllRequired) { + if ( + question !== "number" && + question !== "multiemail" && + question !== "select" && + question !== "checkbox" && + question !== "boolean" && + question !== "multiselect" && + question !== "radio" + ) { + await bookingPage.addQuestion( + question, + `${question}-test`, + `${question} test`, + true, + `${question} test` + ); + } else { + await bookingPage.addQuestion(question, `${question}-test`, `${question} test`, false); + } + await bookingPage.checkField(question); + } + } + + await bookingPage.updateEventType(); + const eventTypePage = await bookingPage.previewEventType(); + await bookingPage.selectTimeSlot(eventTypePage); + await bookingPage.fillAllQuestions(eventTypePage, allQuestions, bookingOptions); + await bookingPage.cancelAndRescheduleBooking(eventTypePage); + }); + + test("Selecting and filling all questions as optional", async ({ bookingPage }) => { + const allQuestions = [ + "phone", + "address", + "checkbox", + "boolean", + "textarea", + "multiemail", + "multiselect", + "number", + "radio", + "select", + "text", + ]; + for (const question of allQuestions) { + if (bookingOptions.isAllRequired) { + if ( + question !== "number" && + question !== "multiemail" && + question !== "select" && + question !== "checkbox" && + question !== "boolean" && + question !== "multiselect" && + question !== "radio" + ) { + await bookingPage.addQuestion( + question, + `${question}-test`, + `${question} test`, + true, + `${question} test` + ); + } else { + await bookingPage.addQuestion(question, `${question}-test`, `${question} test`, false); + } + await bookingPage.checkField(question); + } + } + + await bookingPage.updateEventType(); + const eventTypePage = await bookingPage.previewEventType(); + await bookingPage.selectTimeSlot(eventTypePage); + await bookingPage.fillRequiredQuestions(eventTypePage); + await bookingPage.cancelAndRescheduleBooking(eventTypePage); + }); +}); diff --git a/apps/web/playwright/booking/allQuestionse2e/bookingWithAllQuestions.e2e.ts b/apps/web/playwright/booking/allQuestionse2e/bookingWithAllQuestions.e2e.ts deleted file mode 100644 index 2eb78e3a72..0000000000 --- a/apps/web/playwright/booking/allQuestionse2e/bookingWithAllQuestions.e2e.ts +++ /dev/null @@ -1,45 +0,0 @@ -import { loginUser } from "../../fixtures/regularBookings"; -import { test } from "../../lib/fixtures"; -import { scheduleAllQuestionsBooking } from "../utils/scheduleAllBookings"; - -test.describe("Booking With All Questions", () => { - test.beforeEach(async ({ page, users }) => { - await loginUser(users); - await page.goto("/event-types"); - }); - - const bookingOptions = { isAllRequired: true }; - - test("Selecting and filling all questions as required", async ({ page }) => { - const allQuestions = [ - "phone", - "address", - "checkbox", - "boolean", - "textarea", - "multiemail", - "multiselect", - "number", - "radio", - "select", - "text", - ]; - await scheduleAllQuestionsBooking(page, allQuestions, bookingOptions); - }); - test("Selecting and filling all questions as optional", async ({ page }) => { - const allQuestions = [ - "phone", - "address", - "checkbox", - "boolean", - "textarea", - "multiemail", - "multiselect", - "number", - "radio", - "select", - "text", - ]; - await scheduleAllQuestionsBooking(page, allQuestions, { ...bookingOptions, isAllRequired: false }); - }); -}); diff --git a/apps/web/playwright/booking/utils/bookingUtils.ts b/apps/web/playwright/booking/utils/bookingUtils.ts deleted file mode 100644 index 889175ebd1..0000000000 --- a/apps/web/playwright/booking/utils/bookingUtils.ts +++ /dev/null @@ -1,212 +0,0 @@ -import { expect, type Page } from "@playwright/test"; - -import { - addQuestion, - goToEventType, - goToTab, - previewEventType, - selectTimeSlot, - updateEventType, - scheduleSuccessfullyText, - rescheduleAndCancel, -} from "../../fixtures/regularBookings"; - -const EMAIL = "test@test.com"; -const EMAIL2 = "test2@test.com"; -const PHONE = "+55 (32) 983289947"; - -interface QuestionActions { - [key: string]: () => Promise; -} - -type BookingOptions = { - hasPlaceholder?: boolean; - isReschedule?: boolean; - isRequired?: boolean; -}; - -type customLocators = { - shouldChangeSelectLocator: boolean; - shouldUseLastRadioGroupLocator: boolean; - shouldUseFirstRadioGroupLocator: boolean; - shouldChangeMultiSelectLocator: boolean; -}; - -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 setupEventTypeAndExecuteBooking = async ( - bookingPage: Page, - question: string, - secondQuestion: string, - message: string, - options: BookingOptions -) => { - const firstQuestionHasPlaceholder = [ - "address", - "textarea", - "multiemail", - "number", - "text", - "phone", - ].includes(question); - - // Go to event type settings - await goToEventType(bookingPage, "30 min"); - - // Go to advanced tab - await goToTab(bookingPage, "event_advanced_tab_title"); - - // Add first and second question and fill both - await addQuestion( - bookingPage, - question, - `${question}-test`, - `${question} test`, - firstQuestionHasPlaceholder ? `${question} test` : undefined, - options.isRequired - ); - await addQuestion( - bookingPage, - secondQuestion, - `${secondQuestion}-test`, - `${secondQuestion} test`, - options.hasPlaceholder ? `${secondQuestion} test` : undefined, - options.isRequired - ); - - await expect(bookingPage.getByTestId(`field-${question}-test`)).toBeVisible(); - await expect(bookingPage.getByTestId(`field-${secondQuestion}-test`)).toBeVisible(); - - // Update the event type - await updateEventType(bookingPage); - - // Go to booking page - const eventTypePage = await previewEventType(bookingPage); - - await selectTimeSlot(eventTypePage); - - await fillAndConfirmBooking( - eventTypePage, - "Please share anything that will help prepare for our meeting.", - question, - message, - secondQuestion, - options - ); - - await rescheduleAndCancel(eventTypePage); -}; diff --git a/apps/web/playwright/booking/utils/scheduleAllBookings.ts b/apps/web/playwright/booking/utils/scheduleAllBookings.ts deleted file mode 100644 index e4e37e029f..0000000000 --- a/apps/web/playwright/booking/utils/scheduleAllBookings.ts +++ /dev/null @@ -1,138 +0,0 @@ -import { expect, type Page } from "@playwright/test"; - -import { - goToEventType, - goToTab, - addQuestion, - updateEventType, - previewEventType, - selectFirstAvailableTime, - rescheduleAndCancel, -} from "../../fixtures/regularBookings"; - -const EMAIL = "test@test.com"; -const PHONE = "+55 (32) 9832847"; -const scheduleSuccessfullyText = "This meeting is scheduled"; - -type BookingOptions = { - isReschedule?: boolean; - isAllRequired?: boolean; -}; - -// Fill a form field based on the question type -const fillFormField = async (eventTypePage: Page, question: string) => { - switch (question) { - case "email": - await eventTypePage.getByPlaceholder("Email").click(); - await eventTypePage.getByPlaceholder("Email").fill(EMAIL); - break; - case "phone": - await eventTypePage.getByPlaceholder("Phone test").click(); - await eventTypePage.getByPlaceholder("Phone test").fill(PHONE); - break; - case "address": - await eventTypePage.getByPlaceholder("Address test").click(); - await eventTypePage.getByPlaceholder("Address test").fill("123 Main St, City, Country"); - break; - case "textarea": - await eventTypePage.getByPlaceholder("Textarea test").click(); - await eventTypePage.getByPlaceholder("Textarea test").fill("This is a sample text for textarea."); - break; - case "select": - await eventTypePage.locator("form svg").last().click(); - await eventTypePage.getByTestId("select-option-Option 1").click(); - break; - case "multiselect": - await eventTypePage.locator("form svg").nth(4).click(); - await eventTypePage.getByTestId("select-option-Option 1").click(); - break; - case "number": - await eventTypePage.getByLabel("number test").click(); - await eventTypePage.getByLabel("number test").fill("123"); - break; - case "radio": - await eventTypePage.getByRole("radiogroup").getByText("Option 1").check(); - break; - case "text": - await eventTypePage.getByPlaceholder("Text test").click(); - await eventTypePage.getByPlaceholder("Text test").fill("Sample text"); - break; - case "checkbox": - await eventTypePage.getByLabel("Option 1").first().check(); - await eventTypePage.getByLabel("Option 2").first().check(); - break; - case "boolean": - await eventTypePage.getByLabel(`${question} test`).check(); - break; - case "multiemail": - await eventTypePage.getByRole("button", { name: "multiemail test" }).click(); - await eventTypePage.getByPlaceholder("multiemail test").fill(EMAIL); - break; - } -}; - -// Fill all required questions in the booking page -export const fillAllQuestionsBooking = async ( - eventTypePage: Page, - questions: string[], - options: BookingOptions -) => { - const confirmButton = options.isReschedule ? "confirm-reschedule-button" : "confirm-book-button"; - - if (options.isAllRequired) { - for (const question of questions) { - await fillFormField(eventTypePage, question); - } - } - - await eventTypePage.getByTestId(confirmButton).click(); - const scheduleSuccessfullyPage = eventTypePage.getByText(scheduleSuccessfullyText); - await scheduleSuccessfullyPage.waitFor({ state: "visible" }); - await expect(scheduleSuccessfullyPage).toBeVisible(); -}; - -export const scheduleAllQuestionsBooking = async ( - bookingPage: Page, - questions: string[], - options: BookingOptions -) => { - // Go to event type settings - await goToEventType(bookingPage, "30 min"); - - // Go to advanced tab - await goToTab(bookingPage, "event_advanced_tab_title"); - - // Add multiple fields based on the questions array - for (const question of questions) { - // Check if all questions have isRequired set to true - if (options.isAllRequired) { - if ( - question !== "number" && - question !== "multiemails" && - question !== "select" && - question !== "checkbox" && - question !== "boolean" && - question !== "multiselect" && - question !== "radio" - ) { - await addQuestion(bookingPage, question, `${question}-test`, `${question} test`, `${question} test`); - } else { - await addQuestion(bookingPage, question, `${question}-test`, `${question} test`); - } - await expect(bookingPage.getByTestId(`field-${question}-test`)).toBeVisible(); - } - } - - await updateEventType(bookingPage); - - // Go to booking page - const eventTypePage = await previewEventType(bookingPage); - - // Select the first available time - await selectFirstAvailableTime(eventTypePage); - - fillAllQuestionsBooking(eventTypePage, questions, options); - - // Go to final steps - await rescheduleAndCancel(eventTypePage); -};