From 48eb4fe705b86e3079fc8e484c7704599e1249a7 Mon Sep 17 00:00:00 2001 From: pandeymangg Date: Wed, 26 Nov 2025 21:57:32 +0530 Subject: [PATCH] fix: e2e tests --- apps/web/app/lib/templates.ts | 5 +- .../components/element-form-input/index.tsx | 14 +- .../survey/editor/components/block-card.tsx | 6 +- apps/web/modules/survey/editor/lib/blocks.ts | 3 + apps/web/playwright/survey.spec.ts | 251 ++++++++++---- apps/web/playwright/utils/helper.ts | 311 ++++++++++++------ 6 files changed, 428 insertions(+), 162 deletions(-) diff --git a/apps/web/app/lib/templates.ts b/apps/web/app/lib/templates.ts index 684d4f73f4..5e06f1bde2 100644 --- a/apps/web/app/lib/templates.ts +++ b/apps/web/app/lib/templates.ts @@ -4797,7 +4797,6 @@ export const customSurveyTemplate = (t: TFunction): TTemplate => { type: TSurveyElementTypeEnum.OpenText, headline: createI18nString(t("templates.custom_survey_question_1_headline"), []), placeholder: createI18nString(t("templates.custom_survey_question_1_placeholder"), []), - buttonLabel: createI18nString(t("templates.next"), []), required: true, inputType: "text", charLimit: { @@ -4805,6 +4804,8 @@ export const customSurveyTemplate = (t: TFunction): TTemplate => { }, } as TSurveyOpenTextElement, ], + // Button labels at block level with default key for i18n support + buttonLabel: createI18nString(t("templates.next"), []), }, ], }, @@ -4870,6 +4871,8 @@ export const previewSurvey = (projectName: string, t: TFunction): TSurvey => { isDraft: true, }, ], + buttonLabel: createI18nString(t("templates.next"), []), + backButtonLabel: createI18nString(t("templates.preview_survey_question_2_back_button_label"), []), }, ], endings: [ diff --git a/apps/web/modules/survey/components/element-form-input/index.tsx b/apps/web/modules/survey/components/element-form-input/index.tsx index dde4db5828..046139d540 100644 --- a/apps/web/modules/survey/components/element-form-input/index.tsx +++ b/apps/web/modules/survey/components/element-form-input/index.tsx @@ -3,7 +3,7 @@ import { useAutoAnimate } from "@formkit/auto-animate/react"; import { debounce } from "lodash"; import { ImagePlusIcon, TrashIcon } from "lucide-react"; -import { useCallback, useMemo, useRef, useState } from "react"; +import { useCallback, useEffect, useMemo, useRef, useState } from "react"; import { useTranslation } from "react-i18next"; import { type TI18nString } from "@formbricks/types/i18n"; import { @@ -143,6 +143,12 @@ export const ElementFormInput = ({ return getMatrixLabel(currentElement, index, surveyLanguageCodes, isMatrixLabelRow ? "row" : "column"); } + // For block-level properties (buttonLabel, backButtonLabel) or when value is explicitly provided, + // use the value prop directly instead of looking up on currentElement + if (value && typeof value === "object" && "default" in value) { + return value; + } + return ( (currentElement && (id.includes(".") @@ -165,6 +171,7 @@ export const ElementFormInput = ({ elementIdx, elements, surveyLanguageCodes, + value, ]); const [text, setText] = useState(elementText); @@ -172,6 +179,11 @@ export const ElementFormInput = ({ determineImageUploaderVisibility(elementIdx, elements) ); + // Sync text state when elementText changes (e.g., on page reload or when value prop changes) + useEffect(() => { + setText(elementText); + }, [elementText]); + const highlightContainerRef = useRef(null); const inputRef = useRef(null); diff --git a/apps/web/modules/survey/editor/components/block-card.tsx b/apps/web/modules/survey/editor/components/block-card.tsx index d4a941be4c..2381e316ad 100644 --- a/apps/web/modules/survey/editor/components/block-card.tsx +++ b/apps/web/modules/survey/editor/components/block-card.tsx @@ -131,16 +131,16 @@ export const BlockCard = ({ // Check if button labels have incomplete translations for any enabled language // A button label is invalid if it exists but doesn't have valid text for all enabled languages + const surveyLanguages = localSurvey.languages ?? []; const hasInvalidButtonLabel = - block.buttonLabel !== undefined && - !isLabelValidForAllLanguages(block.buttonLabel, localSurvey.languages ?? []); + block.buttonLabel !== undefined && !isLabelValidForAllLanguages(block.buttonLabel, surveyLanguages); // Check if back button label is invalid // Back button label should exist for all blocks except the first one const hasInvalidBackButtonLabel = blockIdx > 0 && block.backButtonLabel !== undefined && - !isLabelValidForAllLanguages(block.backButtonLabel, localSurvey.languages ?? []); + !isLabelValidForAllLanguages(block.backButtonLabel, surveyLanguages); // Block should be highlighted if it has invalid elements OR invalid button labels const isBlockInvalid = hasInvalidElement || hasInvalidButtonLabel || hasInvalidBackButtonLabel; diff --git a/apps/web/modules/survey/editor/lib/blocks.ts b/apps/web/modules/survey/editor/lib/blocks.ts index 53562924a4..fabf24b4ac 100644 --- a/apps/web/modules/survey/editor/lib/blocks.ts +++ b/apps/web/modules/survey/editor/lib/blocks.ts @@ -4,6 +4,7 @@ import { Result, err, ok } from "@formbricks/types/error-handlers"; import { TSurveyBlock } from "@formbricks/types/surveys/blocks"; import { TSurveyElement } from "@formbricks/types/surveys/elements"; import { TSurvey } from "@formbricks/types/surveys/types"; +import { createI18nString } from "@/lib/i18n/utils"; // ============================================ // UTILITY FUNCTIONS @@ -72,6 +73,8 @@ export const addBlock = ( id: createId(), name: block.name || t("environments.surveys.edit.untitled_block"), elements: block.elements || [], + buttonLabel: createI18nString(block.buttonLabel || t("templates.next"), []), + backButtonLabel: createI18nString(block.backButtonLabel || t("templates.back"), []), }; if (index === undefined) { diff --git a/apps/web/playwright/survey.spec.ts b/apps/web/playwright/survey.spec.ts index 52b328dcdd..a0c93c875c 100644 --- a/apps/web/playwright/survey.spec.ts +++ b/apps/web/playwright/survey.spec.ts @@ -117,6 +117,7 @@ test.describe("Survey Create & Submit Response without logic", async () => { await expect(page.locator("#questionCard-3").getByRole("button", { name: "Next" })).toBeVisible(); await expect(page.locator("#questionCard-3").getByRole("button", { name: "Back" })).toBeVisible(); await page.locator("path").nth(3).click(); + await page.locator("#questionCard-3").getByRole("button", { name: "Next" }).click(); // NPS Question await expect(page.getByText(surveys.createAndSubmit.npsQuestion.question)).toBeVisible(); @@ -133,13 +134,14 @@ test.describe("Survey Create & Submit Response without logic", async () => { await expect(page.locator("#questionCard-4").getByText(`${i}`, { exact: true })).toBeVisible(); } await page.locator("#questionCard-4").getByText("8", { exact: true }).click(); + await page.locator("#questionCard-4").getByRole("button", { name: "Next" }).click(); // CTA Question await expect(page.getByText(surveys.createAndSubmit.ctaQuestion.question)).toBeVisible(); await expect( page.getByRole("button", { name: surveys.createAndSubmit.ctaQuestion.buttonLabel }) ).toBeVisible(); - await page.getByRole("button", { name: surveys.createAndSubmit.ctaQuestion.buttonLabel }).click(); + await page.locator("#questionCard-5").getByRole("button", { name: "Next" }).click(); // Consent Question await expect(page.getByText(surveys.createAndSubmit.consentQuestion.question)).toBeVisible(); @@ -230,7 +232,7 @@ test.describe("Survey Create & Submit Response without logic", async () => { for (let i = 0; i < surveys.createAndSubmit.ranking.choices.length; i++) { await page.getByText(surveys.createAndSubmit.ranking.choices[i]).click(); } - await page.locator("#questionCard-12").getByRole("button", { name: "Next" }).click(); + await page.locator("#questionCard-12").getByRole("button", { name: "Finish" }).click(); // loading spinner -> wait for it to disappear await page.getByTestId("loading-spinner").waitFor({ state: "hidden" }); }); @@ -278,7 +280,7 @@ test.describe("Multi Language Survey Create", async () => { await page.getByText("Welcome CardShownOn").click(); // Add questions in default language - await page.getByText("Add question").click(); + await page.getByText("Add Block").click(); await page.getByRole("button", { name: "Single-Select" }).click(); await helper.fillRichTextEditor(page, "Question*", surveys.createAndSubmit.singleSelectQuestion.question); await page.getByPlaceholder("Option 1").fill(surveys.createAndSubmit.singleSelectQuestion.options[0]); @@ -286,7 +288,7 @@ test.describe("Multi Language Survey Create", async () => { await page .locator("div") - .filter({ hasText: /^Add questionAdd a new question to your survey$/ }) + .filter({ hasText: /^Add BlockChoose the first question on your Block$/ }) .nth(1) .click(); await page.getByRole("button", { name: "Multi-Select Ask respondents" }).click(); @@ -296,7 +298,7 @@ test.describe("Multi Language Survey Create", async () => { await page.getByPlaceholder("Option 3").fill(surveys.createAndSubmit.multiSelectQuestion.options[2]); await page .locator("div") - .filter({ hasText: /^Add questionAdd a new question to your survey$/ }) + .filter({ hasText: /^Add BlockChoose the first question on your Block$/ }) .nth(1) .click(); await page.getByRole("button", { name: "Picture Selection" }).click(); @@ -311,7 +313,7 @@ test.describe("Multi Language Survey Create", async () => { await page .locator("div") - .filter({ hasText: /^Add questionAdd a new question to your survey$/ }) + .filter({ hasText: /^Add BlockChoose the first question on your Block$/ }) .nth(1) .click(); await page.getByRole("button", { name: "Rating" }).click(); @@ -321,7 +323,7 @@ test.describe("Multi Language Survey Create", async () => { await page .locator("div") - .filter({ hasText: /^Add questionAdd a new question to your survey$/ }) + .filter({ hasText: /^Add BlockChoose the first question on your Block$/ }) .nth(1) .click(); await page.getByRole("button", { name: "Net Promoter Score (NPS)" }).click(); @@ -331,7 +333,7 @@ test.describe("Multi Language Survey Create", async () => { await page .locator("div") - .filter({ hasText: /^Add questionAdd a new question to your survey$/ }) + .filter({ hasText: /^Add BlockChoose the first question on your Block$/ }) .nth(1) .click(); await page.getByRole("button", { name: "Date" }).click(); @@ -339,7 +341,7 @@ test.describe("Multi Language Survey Create", async () => { await page .locator("div") - .filter({ hasText: /^Add questionAdd a new question to your survey$/ }) + .filter({ hasText: /^Add BlockChoose the first question on your Block$/ }) .nth(1) .click(); await page.getByRole("button", { name: "File Upload" }).click(); @@ -347,7 +349,7 @@ test.describe("Multi Language Survey Create", async () => { await page .locator("div") - .filter({ hasText: /^Add questionAdd a new question to your survey$/ }) + .filter({ hasText: /^Add BlockChoose the first question on your Block$/ }) .nth(1) .click(); @@ -374,7 +376,7 @@ test.describe("Multi Language Survey Create", async () => { await page .locator("div") - .filter({ hasText: /^Add questionAdd a new question to your survey$/ }) + .filter({ hasText: /^Add BlockChoose the first question on your Block$/ }) .nth(1) .click(); await page.getByRole("button", { name: "Address" }).click(); @@ -387,7 +389,7 @@ test.describe("Multi Language Survey Create", async () => { await page .locator("div") - .filter({ hasText: /^Add questionAdd a new question to your survey$/ }) + .filter({ hasText: /^Add BlockChoose the first question on your Block$/ }) .nth(1) .click(); await page.getByRole("button", { name: "Ranking" }).click(); @@ -422,9 +424,17 @@ test.describe("Multi Language Survey Create", async () => { await helper.fillRichTextEditor(page, "Question*", surveys.germanCreate.openTextQuestion.question); await page.getByLabel("Placeholder").click(); await page.getByLabel("Placeholder").fill(surveys.germanCreate.openTextQuestion.placeholder); - await page.getByText("Show Advanced settings").first().click(); - await page.getByPlaceholder("Next").click(); - await page.getByPlaceholder("Next").fill(surveys.germanCreate.next); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("textbox", { name: "Button Label", exact: true }).first().click(); + await page + .getByRole("textbox", { name: "Button Label", exact: true }) + .first() + .fill(surveys.germanCreate.next); + await page + .locator("div") + .filter({ hasText: /^Block 11 question$/ }) + .first() + .click(); // Fill Single select question in german await page.getByRole("main").getByText("Single-Select").click(); @@ -433,11 +443,22 @@ test.describe("Multi Language Survey Create", async () => { await page.getByPlaceholder("Option 1").fill(surveys.germanCreate.singleSelectQuestion.options[0]); await page.getByPlaceholder("Option 2").click(); await page.getByPlaceholder("Option 2").fill(surveys.germanCreate.singleSelectQuestion.options[1]); - await page.getByText("Show Advanced settings").first().click(); - await page.getByPlaceholder("Next").click(); - await page.getByPlaceholder("Next").fill(surveys.germanCreate.next); - await page.getByPlaceholder("Back").click(); - await page.getByPlaceholder("Back").fill(surveys.germanCreate.back); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("textbox", { name: "Button Label", exact: true }).first().click(); + await page + .getByRole("textbox", { name: "Button Label", exact: true }) + .first() + .fill(surveys.germanCreate.next); + await page.getByRole("textbox", { name: '"Back" Button Label', exact: true }).first().click(); + await page + .getByRole("textbox", { name: '"Back" Button Label', exact: true }) + .first() + .fill(surveys.germanCreate.back); + await page + .locator("div") + .filter({ hasText: /^Block 21 question$/ }) + .first() + .click(); // Fill Multi select question in german await page.getByRole("main").getByRole("heading", { name: "Multi-Select" }).click(); @@ -449,20 +470,42 @@ test.describe("Multi Language Survey Create", async () => { await page.getByPlaceholder("Option 2").fill(surveys.germanCreate.multiSelectQuestion.options[1]); await page.getByPlaceholder("Option 3").click(); await page.getByPlaceholder("Option 3").fill(surveys.germanCreate.multiSelectQuestion.options[2]); - await page.getByText("Show Advanced settings").first().click(); - await page.getByPlaceholder("Next").click(); - await page.getByPlaceholder("Next").fill(surveys.germanCreate.next); - await page.getByPlaceholder("Back").click(); - await page.getByPlaceholder("Back").fill(surveys.germanCreate.back); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("textbox", { name: "Button Label", exact: true }).first().click(); + await page + .getByRole("textbox", { name: "Button Label", exact: true }) + .first() + .fill(surveys.germanCreate.next); + await page.getByRole("textbox", { name: '"Back" Button Label', exact: true }).first().click(); + await page + .getByRole("textbox", { name: '"Back" Button Label', exact: true }) + .first() + .fill(surveys.germanCreate.back); + await page + .locator("div") + .filter({ hasText: /^Block 31 question$/ }) + .first() + .click(); // Fill Picture select question in german await page.getByRole("main").getByText("Picture Selection").click(); await helper.fillRichTextEditor(page, "Question*", surveys.germanCreate.pictureSelectQuestion.question); - await page.getByText("Show Advanced settings").first().click(); - await page.getByPlaceholder("Next").click(); - await page.getByPlaceholder("Next").fill(surveys.germanCreate.next); - await page.getByPlaceholder("Back").click(); - await page.getByPlaceholder("Back").fill(surveys.germanCreate.back); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("textbox", { name: "Button Label", exact: true }).first().click(); + await page + .getByRole("textbox", { name: "Button Label", exact: true }) + .first() + .fill(surveys.germanCreate.next); + await page.getByRole("textbox", { name: '"Back" Button Label', exact: true }).first().click(); + await page + .getByRole("textbox", { name: '"Back" Button Label', exact: true }) + .first() + .fill(surveys.germanCreate.back); + await page + .locator("div") + .filter({ hasText: /^Block 41 question$/ }) + .first() + .click(); // Fill Rating question in german await page.getByRole("main").getByText("Rating").click(); @@ -471,9 +514,22 @@ test.describe("Multi Language Survey Create", async () => { await page.getByPlaceholder("Not good").fill(surveys.germanCreate.ratingQuestion.lowLabel); await page.getByPlaceholder("Very satisfied").click(); await page.getByPlaceholder("Very satisfied").fill(surveys.germanCreate.ratingQuestion.highLabel); - await page.getByText("Show Advanced settings").first().click(); - await page.getByPlaceholder("Back").click(); - await page.getByPlaceholder("Back").fill(surveys.germanCreate.back); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("textbox", { name: "Button Label", exact: true }).first().click(); + await page + .getByRole("textbox", { name: "Button Label", exact: true }) + .first() + .fill(surveys.germanCreate.next); + await page.getByRole("textbox", { name: '"Back" Button Label', exact: true }).first().click(); + await page + .getByRole("textbox", { name: '"Back" Button Label', exact: true }) + .first() + .fill(surveys.germanCreate.back); + await page + .locator("div") + .filter({ hasText: /^Block 51 question$/ }) + .first() + .click(); // Fill NPS question in german await page.getByRole("main").getByText("Net Promoter Score (NPS)").click(); @@ -482,27 +538,62 @@ test.describe("Multi Language Survey Create", async () => { await page.getByLabel("Lower Label").fill(surveys.germanCreate.npsQuestion.lowLabel); await page.getByLabel("Upper Label").click(); await page.getByLabel("Upper Label").fill(surveys.germanCreate.npsQuestion.highLabel); - await page.getByText("Show Advanced settings").first().click(); - await page.getByPlaceholder("Back").click(); - await page.getByPlaceholder("Back").fill(surveys.germanCreate.back); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("textbox", { name: "Button Label", exact: true }).first().click(); + await page + .getByRole("textbox", { name: "Button Label", exact: true }) + .first() + .fill(surveys.germanCreate.next); + await page.getByRole("textbox", { name: '"Back" Button Label', exact: true }).first().click(); + await page + .getByRole("textbox", { name: '"Back" Button Label', exact: true }) + .first() + .fill(surveys.germanCreate.back); + await page + .locator("div") + .filter({ hasText: /^Block 61 question$/ }) + .first() + .click(); // Fill Date question in german await page.getByRole("main").getByText("Date").click(); await helper.fillRichTextEditor(page, "Question*", surveys.germanCreate.dateQuestion.question); - await page.getByText("Show Advanced settings").first().click(); - await page.getByPlaceholder("Next").click(); - await page.getByPlaceholder("Next").fill(surveys.germanCreate.next); - await page.getByPlaceholder("Back").click(); - await page.getByPlaceholder("Back").fill(surveys.germanCreate.back); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("textbox", { name: "Button Label", exact: true }).first().click(); + await page + .getByRole("textbox", { name: "Button Label", exact: true }) + .first() + .fill(surveys.germanCreate.next); + await page.getByRole("textbox", { name: '"Back" Button Label', exact: true }).first().click(); + await page + .getByRole("textbox", { name: '"Back" Button Label', exact: true }) + .first() + .fill(surveys.germanCreate.back); + await page + .locator("div") + .filter({ hasText: /^Block 71 question$/ }) + .first() + .click(); // Fill File upload question in german await page.getByRole("main").getByText("File Upload").click(); await helper.fillRichTextEditor(page, "Question*", surveys.germanCreate.fileUploadQuestion.question); - await page.getByText("Show Advanced settings").first().click(); - await page.getByPlaceholder("Next").click(); - await page.getByPlaceholder("Next").fill(surveys.germanCreate.next); - await page.getByPlaceholder("Back").click(); - await page.getByPlaceholder("Back").fill(surveys.germanCreate.back); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("textbox", { name: "Button Label", exact: true }).first().click(); + await page + .getByRole("textbox", { name: "Button Label", exact: true }) + .first() + .fill(surveys.germanCreate.next); + await page.getByRole("textbox", { name: '"Back" Button Label', exact: true }).first().click(); + await page + .getByRole("textbox", { name: '"Back" Button Label', exact: true }) + .first() + .fill(surveys.germanCreate.back); + await page + .locator("div") + .filter({ hasText: /^Block 81 question$/ }) + .first() + .click(); // Fill Matrix question in german await page.getByRole("main").getByText("Matrix").click(); @@ -521,11 +612,22 @@ test.describe("Multi Language Survey Create", async () => { await page.locator("#column-2").fill(surveys.germanCreate.matrix.columns[2]); await page.locator("#column-3").click(); await page.locator("#column-3").fill(surveys.germanCreate.matrix.columns[3]); - await page.getByText("Show Advanced settings").first().click(); - await page.getByPlaceholder("Next").click(); - await page.getByPlaceholder("Next").fill(surveys.germanCreate.next); - await page.getByPlaceholder("Back").click(); - await page.getByPlaceholder("Back").fill(surveys.germanCreate.back); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("textbox", { name: "Button Label", exact: true }).first().click(); + await page + .getByRole("textbox", { name: "Button Label", exact: true }) + .first() + .fill(surveys.germanCreate.next); + await page.getByRole("textbox", { name: '"Back" Button Label', exact: true }).first().click(); + await page + .getByRole("textbox", { name: '"Back" Button Label', exact: true }) + .first() + .fill(surveys.germanCreate.back); + await page + .locator("div") + .filter({ hasText: /^Block 91 question$/ }) + .first() + .click(); // Fill Address question in german await page.getByRole("main").getByText("Address").click(); @@ -552,11 +654,22 @@ test.describe("Multi Language Survey Create", async () => { await page .locator('[id="country\\.placeholder"]') .fill(surveys.germanCreate.addressQuestion.placeholder.country); - await page.getByText("Show Advanced settings").first().click(); - await page.getByPlaceholder("Next").click(); - await page.getByPlaceholder("Next").fill(surveys.germanCreate.next); - await page.getByPlaceholder("Back").click(); - await page.getByPlaceholder("Back").fill(surveys.germanCreate.back); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("textbox", { name: "Button Label", exact: true }).first().click(); + await page + .getByRole("textbox", { name: "Button Label", exact: true }) + .first() + .fill(surveys.germanCreate.next); + await page.getByRole("textbox", { name: '"Back" Button Label', exact: true }).first().click(); + await page + .getByRole("textbox", { name: '"Back" Button Label', exact: true }) + .first() + .fill(surveys.germanCreate.back); + await page + .locator("div") + .filter({ hasText: /^Block 101 question$/ }) + .first() + .click(); // Fill Ranking question in german await page.getByRole("main").getByText("Ranking").click(); @@ -571,11 +684,22 @@ test.describe("Multi Language Survey Create", async () => { await page.getByPlaceholder("Option 4").fill(surveys.germanCreate.ranking.choices[3]); await page.getByPlaceholder("Option 5").click(); await page.getByPlaceholder("Option 5").fill(surveys.germanCreate.ranking.choices[4]); - await page.getByText("Show Advanced settings").first().click(); - await page.getByPlaceholder("Finish").click(); - await page.getByPlaceholder("Finish").fill(surveys.germanCreate.next); - await page.getByPlaceholder("Back").click(); - await page.getByPlaceholder("Back").fill(surveys.germanCreate.back); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("textbox", { name: "Button Label", exact: true }).first().click(); + await page + .getByRole("textbox", { name: "Button Label", exact: true }) + .first() + .fill(surveys.germanCreate.next); + await page.getByRole("textbox", { name: '"Back" Button Label', exact: true }).first().click(); + await page + .getByRole("textbox", { name: '"Back" Button Label', exact: true }) + .first() + .fill(surveys.germanCreate.back); + await page + .locator("div") + .filter({ hasText: /^Block 111 question$/ }) + .first() + .click(); // Fill Thank you card in german await page.getByText("Ending card").first().click(); @@ -738,6 +862,7 @@ test.describe("Testing Survey with advanced logic", async () => { await expect(page.locator("#questionCard-4").getByRole("button", { name: "Next" })).toBeVisible(); await expect(page.locator("#questionCard-4").getByRole("button", { name: "Back" })).toBeVisible(); await page.getByRole("group", { name: "Choices" }).locator("path").nth(3).click(); + await page.locator("#questionCard-4").getByRole("button", { name: "Next" }).click(); // NPS Question await expect(page.getByText(surveys.createWithLogicAndSubmit.npsQuestion.question)).toBeVisible(); @@ -754,6 +879,7 @@ test.describe("Testing Survey with advanced logic", async () => { await expect(page.locator("#questionCard-5").getByText(`${i}`, { exact: true })).toBeVisible(); } await page.locator("#questionCard-5").getByText("5", { exact: true }).click(); + await page.locator("#questionCard-5").getByRole("button", { name: "Next" }).click(); // Ranking Question await expect(page.getByText(surveys.createWithLogicAndSubmit.ranking.question)).toBeVisible(); @@ -798,6 +924,7 @@ test.describe("Testing Survey with advanced logic", async () => { await page .getByRole("button", { name: surveys.createWithLogicAndSubmit.ctaQuestion.buttonLabel }) .click(); + await page.locator("#questionCard-8").getByRole("button", { name: "Next" }).click(); // Consent Question await expect(page.getByText(surveys.createWithLogicAndSubmit.consentQuestion.question)).toBeVisible(); @@ -852,7 +979,7 @@ test.describe("Testing Survey with advanced logic", async () => { .fill("This is my city"); await expect(page.getByLabel(surveys.createWithLogicAndSubmit.address.placeholder.zip)).toBeVisible(); await page.getByLabel(surveys.createWithLogicAndSubmit.address.placeholder.zip).fill("12345"); - await page.locator("#questionCard-13").getByRole("button", { name: "Next" }).click(); + await page.locator("#questionCard-13").getByRole("button", { name: "Finish" }).click(); // loading spinner -> wait for it to disappear await page.getByTestId("loading-spinner").waitFor({ state: "hidden" }); diff --git a/apps/web/playwright/utils/helper.ts b/apps/web/playwright/utils/helper.ts index 0ce89dea3e..5e6549d562 100644 --- a/apps/web/playwright/utils/helper.ts +++ b/apps/web/playwright/utils/helper.ts @@ -180,7 +180,7 @@ export const fillRichTextEditor = async (page: Page, labelText: string, content: }; export const createSurvey = async (page: Page, params: CreateSurveyParams) => { - const addQuestion = "Add questionAdd a new question to your survey"; + const addBlock = "Add BlockChoose the first question on your Block"; await page.getByText("Start from scratch").click(); await page.getByRole("button", { name: "Create survey", exact: true }).click(); @@ -211,7 +211,7 @@ export const createSurvey = async (page: Page, params: CreateSurveyParams) => { // Single Select Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Single-Select" }).click(); @@ -225,7 +225,7 @@ export const createSurvey = async (page: Page, params: CreateSurveyParams) => { // Multi Select Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Multi-Select Ask respondents" }).click(); @@ -239,7 +239,7 @@ export const createSurvey = async (page: Page, params: CreateSurveyParams) => { // Rating Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Rating" }).click(); @@ -252,7 +252,7 @@ export const createSurvey = async (page: Page, params: CreateSurveyParams) => { // NPS Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Net Promoter Score (NPS)" }).click(); @@ -263,17 +263,21 @@ export const createSurvey = async (page: Page, params: CreateSurveyParams) => { // CTA Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Statement (Call to Action)" }).click(); await fillRichTextEditor(page, "Question*", params.ctaQuestion.question); + + // Enable external button and fill URL + await page.locator("#buttonExternal").check(); + await page.getByRole("textbox", { name: "https://website.com" }).fill("https://example.com"); await page.getByPlaceholder("Finish").fill(params.ctaQuestion.buttonLabel); // Consent Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Consent" }).click(); @@ -283,7 +287,7 @@ export const createSurvey = async (page: Page, params: CreateSurveyParams) => { // Picture Select Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Picture Selection" }).click(); @@ -297,7 +301,7 @@ export const createSurvey = async (page: Page, params: CreateSurveyParams) => { // File Upload Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "File Upload" }).click(); @@ -306,7 +310,7 @@ export const createSurvey = async (page: Page, params: CreateSurveyParams) => { // Matrix Upload Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Matrix" }).click(); @@ -334,7 +338,7 @@ export const createSurvey = async (page: Page, params: CreateSurveyParams) => { // Fill Address Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Address" }).click(); @@ -348,7 +352,7 @@ export const createSurvey = async (page: Page, params: CreateSurveyParams) => { // Fill Contact Info Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Contact Info" }).click(); @@ -361,7 +365,7 @@ export const createSurvey = async (page: Page, params: CreateSurveyParams) => { // Fill Ranking question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Ranking" }).click(); @@ -382,7 +386,7 @@ export const createSurvey = async (page: Page, params: CreateSurveyParams) => { }; export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWithLogicParams) => { - const addQuestion = "Add questionAdd a new question to your survey"; + const addBlock = "Add BlockChoose the first question on your Block"; await page.getByText("Start from scratch").click(); await page.getByRole("button", { name: "Create survey", exact: true }).click(); @@ -427,7 +431,7 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith // Single Select Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Single-Select" }).click(); @@ -441,7 +445,7 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith // Multi Select Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Multi-Select Ask respondents" }).click(); @@ -455,7 +459,7 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith // Picture Select Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Picture Selection" }).click(); @@ -484,7 +488,7 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith // Rating Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Rating" }).click(); @@ -497,7 +501,7 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith // NPS Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Net Promoter Score (NPS)" }).click(); @@ -508,7 +512,7 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith // Fill Ranking question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Ranking" }).click(); @@ -530,7 +534,7 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith // Matrix Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Matrix" }).click(); @@ -558,17 +562,21 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith // CTA Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Statement (Call to Action)" }).click(); await fillRichTextEditor(page, "Question*", params.ctaQuestion.question); + + // Enable external button and fill URL + await page.locator("#buttonExternal").check(); + await page.getByRole("textbox", { name: "https://website.com" }).fill("https://example.com"); await page.getByPlaceholder("Finish").fill(params.ctaQuestion.buttonLabel); // Consent Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Consent" }).click(); @@ -578,7 +586,7 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith // File Upload Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "File Upload" }).click(); @@ -587,7 +595,7 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith // Date Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Date" }).click(); @@ -596,7 +604,7 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith // Cal Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Schedule a meeting" }).click(); @@ -605,7 +613,7 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith // Fill Address Question await page .locator("div") - .filter({ hasText: new RegExp(`^${addQuestion}$`) }) + .filter({ hasText: new RegExp(`^${addBlock}$`) }) .nth(1) .click(); await page.getByRole("button", { name: "Address" }).click(); @@ -616,22 +624,24 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("row", { name: "Zip" }).getByRole("cell").nth(2).click(); await page.getByRole("row", { name: "Country" }).getByRole("switch").nth(1).click(); - // Adding logic - // Open Text Question + // Adding logic to blocks + // Block 1 (Open Text Question) await page.getByRole("heading", { name: params.openTextQuestion.question }).click(); - await page.getByRole("button", { name: "Toggle advanced settings" }).click(); - await page.getByRole("button", { name: "Add logic" }).click(); - await page.locator("#condition-0-0-conditionOperator").click(); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("button", { name: "Add logic" }).first().click(); + await page.locator("#condition-0-0-conditionValue").first().click(); + await page.getByRole("option", { name: params.openTextQuestion.question }).click(); + await page.locator("#condition-0-0-conditionOperator").first().click(); await page.getByRole("option", { name: "is submitted" }).click(); - await page.locator("#action-0-objective").click(); + await page.locator("#action-0-objective").first().click(); await page.getByRole("option", { name: "Calculate" }).click(); - await page.locator("#action-0-variableId").click(); + await page.locator("#action-0-variableId").first().click(); await page.getByRole("option", { name: "score" }).click(); - await page.locator("#action-0-operator").click(); + await page.locator("#action-0-operator").first().click(); await page.getByRole("option", { name: "Assign =" }).click(); - await page.locator("#action-0-value-input").click(); - await page.locator("#action-0-value-input").fill("1"); - await page.locator("#actions-0-dropdown").click(); + await page.locator("#action-0-value-input").first().click(); + await page.locator("#action-0-value-input").first().fill("1"); + await page.locator("#actions-0-dropdown").first().click(); await page.getByRole("menuitem", { name: "Add action below" }).click(); await page.locator("#action-1-objective").click(); await page.getByRole("option", { name: "Require Answer" }).click(); @@ -647,19 +657,27 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("option", { name: "Assign =" }).click(); await page.locator("#action-2-value-input").click(); await page.locator("#action-2-value-input").fill("1"); + // Close Block 1 settings before moving to Block 2 + await page + .locator("div") + .filter({ hasText: /^Block 11 question$/ }) + .first() + .click(); - // Single Select Question + // Block 2 (Single Select Question) await page.getByRole("heading", { name: params.singleSelectQuestion.question }).click(); - await page.getByRole("button", { name: "Toggle advanced settings" }).click(); - await page.getByRole("button", { name: "Add logic" }).click(); - await page.locator("#condition-0-0-conditionOperator").click(); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("button", { name: "Add logic" }).first().click(); + await page.locator("#condition-0-0-conditionValue").first().click(); + await page.getByRole("option", { name: params.singleSelectQuestion.question }).click(); + await page.locator("#condition-0-0-conditionOperator").first().click(); await page.getByRole("option", { name: "Equals one of" }).click(); - await page.locator("#condition-0-0-conditionMatchValue").click(); + await page.locator("#condition-0-0-conditionMatchValue").first().click(); await page.getByRole("option", { name: params.singleSelectQuestion.options[0] }).click(); await page.getByRole("option", { name: params.singleSelectQuestion.options[1] }).click(); await page.locator("html").click(); await page.waitForSelector('[data-testid="dropdown-menu-content"]', { state: "hidden", timeout: 3000 }); - await page.locator("#action-0-objective").click(); + await page.locator("#action-0-objective").first().click(); await page.getByRole("option", { name: "Calculate" }).click(); await page.locator("#action-0-variableId").click(); await page.getByRole("option", { name: "score" }).click(); @@ -677,11 +695,19 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("option", { name: "Concat +" }).click(); await page.getByRole("textbox", { name: "Value" }).click(); await page.getByRole("textbox", { name: "Value" }).fill("is "); + // Close Block 2 settings + await page + .locator("div") + .filter({ hasText: /^Block 21 question$/ }) + .first() + .click(); - // Multi Select Question + // Block 3 (Multi Select Question) await page.getByRole("heading", { name: params.multiSelectQuestion.question }).click(); - await page.getByRole("button", { name: "Toggle advanced settings" }).click(); - await page.getByRole("button", { name: "Add logic" }).click(); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("button", { name: "Add logic" }).first().click(); + await page.locator("#condition-0-0-conditionValue").click(); + await page.getByRole("option", { name: params.multiSelectQuestion.question }).click(); await page.locator("#condition-0-0-conditionOperator").click(); await page.getByRole("option", { name: "Includes all of" }).click(); await page.locator("#condition-0-0-conditionMatchValue").click(); @@ -696,7 +722,7 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("option", { name: params.singleSelectQuestion.question }).click(); await page.locator("#condition-0-1-conditionOperator").click(); await page.getByRole("option", { name: "is submitted" }).click(); - await page.locator("#action-0-objective").click(); + await page.locator("#action-0-objective").first().click(); await page.getByRole("option", { name: "Calculate" }).click(); await page.locator("#action-0-variableId").click(); await page.getByRole("option", { name: "score" }).click(); @@ -720,14 +746,22 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("option", { name: "Concat +" }).click(); await page.getByRole("textbox", { name: "Value" }).click(); await page.getByRole("textbox", { name: "Value" }).fill("a "); + // Close Block 3 settings + await page + .locator("div") + .filter({ hasText: /^Block 31 question$/ }) + .first() + .click(); - // Picture Select Question + // Block 4 (Picture Select Question) await page.getByRole("heading", { name: params.pictureSelectQuestion.question }).click(); - await page.getByRole("button", { name: "Toggle advanced settings" }).click(); - await page.getByRole("button", { name: "Add logic" }).click(); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("button", { name: "Add logic" }).first().click(); + await page.locator("#condition-0-0-conditionValue").click(); + await page.getByRole("option", { name: params.pictureSelectQuestion.question }).click(); await page.locator("#condition-0-0-conditionOperator").click(); await page.getByRole("option", { name: "is submitted" }).click(); - await page.locator("#action-0-objective").click(); + await page.locator("#action-0-objective").first().click(); await page.getByRole("option", { name: "Calculate" }).click(); await page.locator("#action-0-variableId").click(); await page.getByRole("option", { name: "score" }).click(); @@ -745,16 +779,24 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("option", { name: "Concat +" }).click(); await page.getByRole("textbox", { name: "Value" }).click(); await page.getByRole("textbox", { name: "Value" }).fill("secret "); + // Close Block 4 settings + await page + .locator("div") + .filter({ hasText: /^Block 41 question$/ }) + .first() + .click(); - // Rating Question + // Block 5 (Rating Question) await page.getByRole("heading", { name: params.ratingQuestion.question }).click(); - await page.getByRole("button", { name: "Toggle advanced settings" }).click(); - await page.getByRole("button", { name: "Add logic" }).click(); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("button", { name: "Add logic" }).first().click(); + await page.locator("#condition-0-0-conditionValue").click(); + await page.getByRole("option", { name: params.ratingQuestion.question }).click(); await page.locator("#condition-0-0-conditionOperator").click(); await page.getByRole("option", { name: ">=" }).click(); await page.locator("#condition-0-0-conditionMatchValue").click(); await page.getByRole("option", { name: "3" }).click(); - await page.locator("#action-0-objective").click(); + await page.locator("#action-0-objective").first().click(); await page.getByRole("option", { name: "Calculate" }).click(); await page.locator("#action-0-variableId").click(); await page.getByRole("option", { name: "score" }).click(); @@ -772,17 +814,27 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("option", { name: "Concat +" }).click(); await page.getByRole("textbox", { name: "Value" }).click(); await page.getByRole("textbox", { name: "Value" }).fill("message "); + // Close Block 5 settings + await page + .locator("div") + .filter({ hasText: /^Block 51 question$/ }) + .first() + .click(); - // NPS Question + // Block 6 (NPS Question) await page.getByRole("heading", { name: params.npsQuestion.question }).click(); - await page.getByRole("button", { name: "Toggle advanced settings" }).click(); - await page.getByRole("button", { name: "Add logic" }).click(); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("button", { name: "Add logic" }).first().click(); + await page.locator("#condition-0-0-conditionValue").click(); + await page.getByRole("option", { name: params.npsQuestion.question }).click(); await page.locator("#condition-0-0-conditionOperator").click(); await page.getByRole("option", { name: ">", exact: true }).click(); await page.locator("#condition-0-0-conditionMatchValue").click(); await page.getByRole("option", { name: "2" }).click(); await page.locator("#condition-0-0-dropdown").click(); await page.getByRole("menuitem", { name: "Add condition below" }).click(); + await page.locator("#condition-0-1-conditionValue").click(); + await page.getByRole("option", { name: params.npsQuestion.question }).click(); await page.locator("#condition-0-1-conditionOperator").click(); await page.getByRole("option", { name: "<", exact: true }).click(); await page.locator("#condition-0-1-conditionMatchValue").click(); @@ -818,7 +870,7 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith .click(); await page.locator("#condition-1-1-conditionOperator").click(); await page.getByRole("option", { name: "is submitted" }).click(); - await page.locator("#action-0-objective").click(); + await page.locator("#action-0-objective").first().click(); await page.getByRole("option", { name: "Calculate" }).click(); await page.locator("#action-0-variableId").click(); await page.getByRole("option", { name: "score" }).click(); @@ -836,14 +888,22 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("option", { name: "Concat +" }).click(); await page.getByRole("textbox", { name: "Value" }).click(); await page.getByRole("textbox", { name: "Value" }).fill("for "); + // Close Block 6 settings + await page + .locator("div") + .filter({ hasText: /^Block 61 question$/ }) + .first() + .click(); - // Ranking Question + // Block 7 (Ranking Question) await page.getByRole("heading", { name: params.ranking.question }).click(); - await page.getByRole("button", { name: "Toggle advanced settings" }).click(); - await page.getByRole("button", { name: "Add logic" }).click(); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("button", { name: "Add logic" }).first().click(); + await page.locator("#condition-0-0-conditionValue").click(); + await page.getByRole("option", { name: params.ranking.question }).click(); await page.locator("#condition-0-0-conditionOperator").click(); await page.getByRole("option", { name: "is skipped" }).click(); - await page.locator("#action-0-objective").click(); + await page.locator("#action-0-objective").first().click(); await page.getByRole("option", { name: "Calculate" }).click(); await page.locator("#action-0-variableId").click(); await page.getByRole("option", { name: "score" }).click(); @@ -861,14 +921,25 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("option", { name: "Concat +" }).click(); await page.getByRole("textbox", { name: "Value" }).click(); await page.getByRole("textbox", { name: "Value" }).fill("e2e "); + // Close Block 7 settings + await page + .locator("div") + .filter({ hasText: /^Block 71 question$/ }) + .first() + .click(); - // Matrix Question + // Block 8 (Matrix Question) await page.getByRole("heading", { name: params.matrix.question }).click(); - await page.getByRole("button", { name: "Toggle advanced settings" }).click(); - await page.getByRole("button", { name: "Add logic" }).click(); - await page.locator("#condition-0-0-conditionOperator").click(); - await page.getByRole("option", { name: "is completely submitted" }).click(); - await page.locator("#action-0-objective").click(); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("button", { name: "Add logic" }).first().click(); + await page.locator("#condition-0-0-conditionValue").first().click(); + await page.getByTestId("dropdown-menu-content").getByText(params.matrix.question).click(); + await page.getByRole("menuitem", { name: "All fields" }).click(); + // Click the operator dropdown (currently shows "Is partially submitted") + await page.getByText("Is partially submitted").click(); + // Select "Is completely submitted" from the dropdown + await page.getByText("Is completely submitted").click(); + await page.locator("#action-0-objective").first().click(); await page.getByRole("option", { name: "Calculate" }).click(); await page.locator("#action-0-variableId").click(); await page.getByRole("option", { name: "score" }).click(); @@ -894,19 +965,29 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("option", { name: "Require Answer" }).click(); await page.locator("#action-2-target").click(); await page.getByRole("option", { name: params.ctaQuestion.question }).click(); + // Close Block 8 settings + await page + .locator("div") + .filter({ hasText: /^Block 81 question$/ }) + .first() + .click(); - // CTA Question + // Block 9 (CTA Question) await page.getByRole("heading", { name: params.ctaQuestion.question }).click(); - await page.getByRole("button", { name: "Toggle advanced settings" }).click(); - await page.getByRole("button", { name: "Add logic" }).click(); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("button", { name: "Add logic" }).first().click(); + await page.locator("#condition-0-0-conditionValue").click(); + await page.getByRole("option", { name: params.ctaQuestion.question }).click(); await page.locator("#condition-0-0-conditionOperator").click(); - await page.getByRole("option", { name: "is skipped" }).click(); + await page.getByRole("option", { name: "is not clicked" }).click(); await page.locator("#condition-0-0-dropdown").click(); await page.getByRole("menuitem", { name: "Add condition below" }).click(); await page.getByRole("combobox").filter({ hasText: "all are true" }).first().click(); await page.getByText("any is true").click(); await page.locator("#condition-0-1-dropdown").click(); await page.getByRole("menuitem", { name: "Create group" }).click(); + await page.locator("#condition-1-0-conditionValue").click(); + await page.getByRole("option", { name: params.ctaQuestion.question }).click(); await page.locator("#condition-1-0-dropdown").click(); await page.getByRole("menuitem", { name: "Add condition below" }).click(); await page.locator("#condition-1-1-conditionValue").click(); @@ -915,7 +996,7 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("option", { name: "contains" }).click(); await page.getByPlaceholder("Value").click(); await page.getByPlaceholder("Value").fill("test"); - await page.locator("#action-0-objective").click(); + await page.locator("#action-0-objective").first().click(); await page.getByRole("option", { name: "Calculate" }).click(); await page.locator("#action-0-variableId").click(); await page.getByRole("option", { name: "score" }).click(); @@ -923,12 +1004,18 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("option", { name: "Add +" }).click(); await page.locator("#action-0-value-input").click(); await page.locator("#action-0-value-input").fill("1"); + // Close Block 9 settings + await page + .locator("div") + .filter({ hasText: /^Block 91 question$/ }) + .first() + .click(); - // Consent Question + // Block 10 (Consent Question) await page.getByRole("heading", { name: params.consentQuestion.question }).click(); - await page.getByRole("button", { name: "Toggle advanced settings" }).click(); - await page.getByRole("button", { name: "Add logic" }).click(); - await page.locator("#action-0-objective").click(); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("button", { name: "Add logic" }).first().click(); + await page.locator("#action-0-objective").first().click(); await page.getByRole("option", { name: "Calculate" }).click(); await page.locator("#action-0-variableId").click(); await page.getByRole("option", { name: "score" }).click(); @@ -936,12 +1023,18 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("option", { name: "Add +" }).click(); await page.locator("#action-0-value-input").click(); await page.locator("#action-0-value-input").fill("2"); + // Close Block 10 settings + await page + .locator("div") + .filter({ hasText: /^Block 101 question$/ }) + .first() + .click(); - // File Upload Question + // Block 11 (File Upload Question) await page.getByRole("heading", { name: params.fileUploadQuestion.question }).click(); - await page.getByRole("button", { name: "Toggle advanced settings" }).click(); - await page.getByRole("button", { name: "Add logic" }).click(); - await page.locator("#action-0-objective").click(); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("button", { name: "Add logic" }).first().click(); + await page.locator("#action-0-objective").first().click(); await page.getByRole("option", { name: "Calculate" }).click(); await page.locator("#action-0-variableId").click(); await page.getByRole("option", { name: "score" }).click(); @@ -949,33 +1042,47 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("option", { name: "Add +" }).click(); await page.locator("#action-0-value-input").click(); await page.locator("#action-0-value-input").fill("1"); + // Close Block 11 settings + await page + .locator("div") + .filter({ hasText: /^Block 111 question$/ }) + .first() + .click(); - // Date Question + // Block 12 (Date Question) const today = new Date().toISOString().split("T")[0]; const yesterday = new Date(new Date().setDate(new Date().getDate() - 1)).toISOString().split("T")[0]; const tomorrow = new Date(new Date().setDate(new Date().getDate() + 1)).toISOString().split("T")[0]; await page.getByRole("main").getByText(params.date.question).click(); - await page.getByRole("button", { name: "Toggle advanced settings" }).click(); - await page.getByRole("button", { name: "Add logic" }).click(); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("button", { name: "Add logic" }).first().click(); + await page.locator("#condition-0-0-conditionValue").click(); + await page.getByRole("option", { name: params.date.question }).click(); await page.getByPlaceholder("Value").fill(today); await page.locator("#condition-0-0-dropdown").click(); await page.getByRole("menuitem", { name: "Add condition below" }).click(); + await page.locator("#condition-0-1-conditionValue").click(); + await page.getByRole("option", { name: params.date.question }).click(); await page.locator("#condition-0-1-conditionOperator").click(); await page.getByRole("option", { name: "does not equal" }).click(); await page.locator("#condition-0-1-conditionMatchValue-input").fill(yesterday); await page.locator("#condition-0-1-dropdown").click(); await page.getByRole("menuitem", { name: "Add condition below" }).click(); + await page.locator("#condition-0-2-conditionValue").click(); + await page.getByRole("option", { name: params.date.question }).click(); await page.locator("#condition-0-2-conditionOperator").click(); await page.getByRole("option", { name: "is before" }).click(); await page.locator("#condition-0-2-conditionMatchValue-input").fill(tomorrow); await page.locator("#condition-0-2-dropdown").click(); await page.getByRole("menuitem", { name: "Add condition below" }).click(); + await page.locator("#condition-0-3-conditionValue").click(); + await page.getByRole("option", { name: params.date.question }).click(); await page.locator("#condition-0-3-conditionOperator").click(); await page.getByRole("option", { name: "is after" }).click(); await page.locator("#condition-0-3-conditionMatchValue-input").fill(yesterday); - await page.locator("#action-0-objective").click(); + await page.locator("#action-0-objective").first().click(); await page.getByRole("option", { name: "Calculate" }).click(); await page.locator("#action-0-variableId").click(); await page.getByRole("option", { name: "score" }).click(); @@ -983,14 +1090,22 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("option", { name: "Add +" }).click(); await page.locator("#action-0-value-input").click(); await page.locator("#action-0-value-input").fill("1"); + // Close Block 12 settings + await page + .locator("div") + .filter({ hasText: /^Block 121 question$/ }) + .first() + .click(); - // Cal Question + // Block 13 (Cal Question) await page.getByRole("heading", { name: params.cal.question }).click(); - await page.getByRole("button", { name: "Toggle advanced settings" }).click(); - await page.getByRole("button", { name: "Add logic" }).click(); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("button", { name: "Add logic" }).first().click(); + await page.locator("#condition-0-0-conditionValue").click(); + await page.getByRole("option", { name: params.cal.question }).click(); await page.locator("#condition-0-0-conditionOperator").click(); await page.getByRole("option", { name: "is skipped" }).click(); - await page.locator("#action-0-objective").click(); + await page.locator("#action-0-objective").first().click(); await page.getByRole("option", { name: "Calculate" }).click(); await page.locator("#action-0-variableId").click(); await page.getByRole("option", { name: "score" }).click(); @@ -998,12 +1113,18 @@ export const createSurveyWithLogic = async (page: Page, params: CreateSurveyWith await page.getByRole("option", { name: "Add +" }).click(); await page.locator("#action-0-value-input").click(); await page.locator("#action-0-value-input").fill("1"); + // Close Block 13 settings + await page + .locator("div") + .filter({ hasText: /^Block 131 question$/ }) + .first() + .click(); - // Address Question + // Block 14 (Address Question) await page.getByRole("heading", { name: params.address.question }).click(); - await page.getByRole("button", { name: "Toggle advanced settings" }).click(); - await page.getByRole("button", { name: "Add logic" }).click(); - await page.locator("#action-0-objective").click(); + await page.getByText("Show Block settings").first().click(); + await page.getByRole("button", { name: "Add logic" }).first().click(); + await page.locator("#action-0-objective").first().click(); await page.getByRole("option", { name: "Calculate" }).click(); await page.locator("#action-0-variableId").click(); await page.getByRole("option", { name: "score" }).click();