-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
test[e2e]: refactor, and add to public-facing editor flow test (#3683)
- Loading branch information
Showing
14 changed files
with
526 additions
and
211 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,4 +1,4 @@ | ||
| #!/usr/bin/env sh | ||
| . "$(dirname -- "$0")/_/husky.sh" | ||
| cd api.planx.uk | ||
| pnpm dlx lint-staged | ||
| pnpm dlx lint-staged |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,35 +1,26 @@ | ||
| import { Browser, expect, test } from "@playwright/test"; | ||
| import { | ||
| createAddressInput, | ||
| createChecklist, | ||
| createContactInput, | ||
| createDateInput, | ||
| createDrawBoundary, | ||
| createFileUpload, | ||
| createFindProperty, | ||
| createNextSteps, | ||
| createNotice, | ||
| createNumberInput, | ||
| createPlanningConstraints, | ||
| createQuestionWithOptions, | ||
| createReview, | ||
| createTaskList, | ||
| createTextInput, | ||
| } from "../helpers/addComponent"; | ||
| import type { Context } from "../helpers/context"; | ||
| import { | ||
| contextDefaults, | ||
| setUpTestContext, | ||
| tearDownTestContext, | ||
| } from "../helpers/context"; | ||
| import { getTeamPage } from "../helpers/getPage"; | ||
| import { createAuthenticatedSession } from "../helpers/globalHelpers"; | ||
| import { | ||
| createAuthenticatedSession, | ||
| isGetUserRequest, | ||
| } from "../helpers/globalHelpers"; | ||
| import { answerQuestion, clickContinue } from "../helpers/userActions"; | ||
|
|
||
| test.describe("Navigation", () => { | ||
| answerAddressInput, | ||
| answerChecklist, | ||
| answerContactInput, | ||
| answerDateInput, | ||
| answerFindProperty, | ||
| answerNumberInput, | ||
| answerQuestion, | ||
| answerTextInput, | ||
| clickContinue, | ||
| } from "../helpers/userActions"; | ||
| import { PlaywrightEditor } from "../pages/Editor"; | ||
|
|
||
| test.describe("Flow creation, publish and preview", () => { | ||
| let context: Context = { | ||
| ...contextDefaults, | ||
| }; | ||
|
|
@@ -52,166 +43,55 @@ test.describe("Navigation", () => { | |
| await tearDownTestContext(context); | ||
| }); | ||
|
|
||
| test("user data persists on page refresh @regression", async ({ | ||
| browser, | ||
| }) => { | ||
| const page = await createAuthenticatedSession({ | ||
| browser, | ||
| userId: context.user!.id!, | ||
| }); | ||
|
|
||
| const initialRequest = page.waitForRequest(isGetUserRequest); | ||
|
|
||
| Promise.all([await page.goto("/"), await initialRequest]); | ||
|
|
||
| const team = page.locator("h3", { hasText: context.team.name }); | ||
|
|
||
| let isRepeatedRequestMade = false; | ||
| page.on( | ||
| "request", | ||
| (req) => (isRepeatedRequestMade = isGetUserRequest(req)), | ||
| ); | ||
|
|
||
| Promise.all([ | ||
| await team.click(), | ||
| expect(isRepeatedRequestMade).toBe(false), | ||
| ]); | ||
|
|
||
| const reloadRequest = page.waitForRequest(isGetUserRequest); | ||
|
|
||
| Promise.all([await page.reload(), await reloadRequest]); | ||
| }); | ||
|
|
||
| test("team data persists on page refresh @regression", async ({ | ||
| browser, | ||
| }) => { | ||
| const page = await createAuthenticatedSession({ | ||
| browser, | ||
| userId: context.user!.id!, | ||
| }); | ||
|
|
||
| await page.goto("/"); | ||
| const team = page.locator("h3", { hasText: context.team.name }); | ||
| await team.click(); | ||
|
|
||
| const teamSlugInHeader = page.getByRole("link", { | ||
| name: context.team.slug, | ||
| }); | ||
| await expect(teamSlugInHeader).toBeVisible(); | ||
|
|
||
| await page.reload(); | ||
| await expect(teamSlugInHeader).toBeVisible(); | ||
|
|
||
| await page.goBack(); | ||
| await expect(teamSlugInHeader).toBeHidden(); | ||
| }); | ||
|
|
||
| test("Create a flow", async ({ browser }) => { | ||
| const page = await getTeamPage({ | ||
| browser, | ||
| userId: context.user!.id!, | ||
| teamName: context.team.name, | ||
| }); | ||
|
|
||
| const editor = new PlaywrightEditor(page); | ||
|
|
||
| page.on("dialog", (dialog) => dialog.accept(serviceProps.name)); | ||
| await page.locator("button", { hasText: "Add a new service" }).click(); | ||
| await editor.addNewService(); | ||
|
|
||
| // update context to allow flow to be torn down | ||
| context.flow = { ...serviceProps }; | ||
|
|
||
| const firstNode = page.locator("li.hanger > a").first(); | ||
|
|
||
| const questionText = "Is this a test?"; | ||
| await createQuestionWithOptions(page, firstNode, questionText, [ | ||
| "Yes", | ||
| "No", | ||
| ]); | ||
| await expect( | ||
| page.locator("a").filter({ hasText: questionText }), | ||
| ).toBeVisible(); | ||
|
|
||
| // Add a notice to the "Yes" path | ||
| const yesBranch = page.locator("#flow .card .options .option").nth(0); | ||
|
|
||
| const yesBranchNoticeText = "Yes! this is a test"; | ||
| await createNotice( | ||
| page, | ||
| yesBranch.locator(".hanger > a"), | ||
| yesBranchNoticeText, | ||
| ); | ||
|
|
||
| // Add a notice to the "No" path | ||
| const noBranch = page.locator("#flow .card .options .option").nth(1); | ||
| const noBranchNoticeText = "Sorry, this is a test"; | ||
| await createNotice( | ||
| page, | ||
| noBranch.locator(".hanger > a"), | ||
| noBranchNoticeText, | ||
| ); | ||
|
|
||
| const getNextNode = () => page.locator(".hanger > a").last(); | ||
|
|
||
| await createChecklist(page, getNextNode(), "A checklist title", [ | ||
| await editor.createQuestion(); | ||
| await editor.createNoticeOnEachBranch(); | ||
| await editor.createChecklist(); | ||
| await editor.createTextInput(); | ||
| await editor.createNumberInput(); | ||
| await editor.createDateInput(); | ||
| await editor.createAddressInput(); | ||
| await editor.createContactInput(); | ||
| await editor.createTaskList(); | ||
| await editor.createFindProperty(); | ||
| await editor.createDrawBoundary(); | ||
| await editor.createPlanningConstraints(); | ||
| await editor.createFileUpload(); | ||
| await editor.createNextSteps(); | ||
| await editor.createReview(); | ||
|
|
||
| await expect(editor.nodeList).toContainText([ | ||
| "Is this a test?", | ||
| "Yes! this is a test", | ||
| "Sorry, this is a test", | ||
| "Checklist item 1", | ||
| "Second checklist item", | ||
| "The third checklist item", | ||
| ]); | ||
|
|
||
| await createTextInput(page, getNextNode(), "Tell us about your trees."); | ||
| await createNumberInput(page, getNextNode(), "How old are you?", "years"); | ||
| await createDateInput(page, getNextNode(), "When is your birthday?"); | ||
|
|
||
| await createAddressInput( | ||
| page, | ||
| getNextNode(), | ||
| "Tell us about your trees.", | ||
| "How old are you?", | ||
| "When is your birthday?", | ||
| "What is your address?", | ||
| "some data field", | ||
| ); | ||
|
|
||
| await createContactInput( | ||
| page, | ||
| getNextNode(), | ||
| "What is your contact info?", | ||
| "some data field", | ||
| ); | ||
|
|
||
| await createTaskList(page, getNextNode(), "What you should do next", [ | ||
| "Have a cup of tea", | ||
| "Continue through this flow", | ||
| ]); | ||
|
|
||
| await createFindProperty(page, getNextNode()); | ||
| await createDrawBoundary(page, getNextNode()); | ||
| await createPlanningConstraints(page, getNextNode()); | ||
| await createFileUpload(page, getNextNode(), "some data field"); | ||
|
|
||
| await createNextSteps(page, getNextNode(), [ | ||
| "A possible next step", | ||
| "Another option", | ||
| "What you should do next", | ||
| "Find property", | ||
| "Confirm your location plan", | ||
| "Planning constraints", | ||
| "File upload", | ||
| "Next steps", | ||
| "Check your answers before sending your application", | ||
| ]); | ||
|
|
||
| await createReview(page, getNextNode()); | ||
|
|
||
| const nodes = page.locator(".card"); | ||
| await expect(nodes.getByText(questionText)).toBeVisible(); | ||
| await expect(nodes.getByText(yesBranchNoticeText)).toBeVisible(); | ||
| await expect(nodes.getByText(noBranchNoticeText)).toBeVisible(); | ||
| await expect(nodes.getByText("Checklist item 1")).toBeVisible(); | ||
| await expect(nodes.getByText("Tell us about your trees.")).toBeVisible(); | ||
| await expect(nodes.getByText("How old are you?")).toBeVisible(); | ||
| await expect(nodes.getByText("When is your birthday?")).toBeVisible(); | ||
| await expect(nodes.getByText("What is your address?")).toBeVisible(); | ||
| await expect(nodes.getByText("What is your contact info?")).toBeVisible(); | ||
| await expect(nodes.getByText("What you should do next")).toBeVisible(); | ||
| await expect(nodes.getByText("Find property")).toBeVisible(); | ||
| await expect(nodes.getByText("Confirm your location plan")).toBeVisible(); | ||
| await expect(nodes.getByText("Planning constraints")).toBeVisible(); | ||
| await expect(nodes.getByText("File upload")).toBeVisible(); | ||
|
|
||
| await expect(nodes.getByText("Next steps")).toBeVisible(); | ||
| await expect( | ||
| nodes.getByText("Check your answers before sending your application"), | ||
| ).toBeVisible(); | ||
| }); | ||
|
|
||
| test("Cannot preview an unpublished flow", async ({ | ||
|
|
@@ -321,5 +201,66 @@ test.describe("Navigation", () => { | |
| await expect( | ||
| page.locator("h1", { hasText: "Sorry, this is a test" }), | ||
| ).toBeVisible(); | ||
| await clickContinue({ page }); | ||
|
|
||
| await answerChecklist({ | ||
| page, | ||
| title: "A checklist title", | ||
| answers: ["Checklist item 1", "Second checklist item"], | ||
| }); | ||
| await clickContinue({ page }); | ||
|
|
||
| await answerTextInput(page, { | ||
| expectedQuestion: "Tell us about your trees.", | ||
| answer: "My trees are lovely", | ||
| continueToNext: true, | ||
| }); | ||
|
|
||
| await answerNumberInput(page, { | ||
| expectedQuestion: "How old are you?", | ||
| answer: 30, | ||
| continueToNext: true, | ||
| }); | ||
|
|
||
| await answerDateInput(page, { | ||
| expectedQuestion: "When is your birthday?", | ||
| day: 30, | ||
| month: 12, | ||
| year: 1980, | ||
| continueToNext: true, | ||
| }); | ||
|
|
||
| await answerAddressInput(page, { | ||
| expectedQuestion: "What is your address?", | ||
| addressLineOne: "1 Silver Street", | ||
| town: "Bamburgh", | ||
| postcode: "BG1 2SS", | ||
| continueToNext: true, | ||
| }); | ||
|
|
||
| await expect( | ||
| page.locator("h1", { hasText: "What is your contact info?" }), | ||
| ).toBeVisible(); | ||
| await answerContactInput(page, { | ||
| firstName: "Freddie", | ||
| lastName: "Mercury", | ||
| phoneNumber: "01234 555555", | ||
| email: "[email protected]", | ||
| }); | ||
| await clickContinue({ page }); | ||
|
|
||
| await expect( | ||
| page.locator("h1", { hasText: "What you should do next" }), | ||
| ).toBeVisible(); | ||
| await expect( | ||
| page.locator("h2", { hasText: "Have a cup of tea" }), | ||
| ).toBeVisible(); | ||
| await expect( | ||
| page.locator("h2", { hasText: "Continue through this flow" }), | ||
| ).toBeVisible(); | ||
| await clickContinue({ page }); | ||
|
|
||
| await answerFindProperty(page); | ||
| await clickContinue({ page }); | ||
| }); | ||
| }); | ||
Oops, something went wrong.