diff --git a/tests/govtool-frontend/playwright/tests/10-user-snap/userSnap.spec.ts b/tests/govtool-frontend/playwright/tests/10-user-snap/userSnap.spec.ts new file mode 100644 index 000000000..ab8e4c1be --- /dev/null +++ b/tests/govtool-frontend/playwright/tests/10-user-snap/userSnap.spec.ts @@ -0,0 +1,190 @@ +import { faker } from "@faker-js/faker"; +import { test } from "@fixtures/walletExtension"; +import { setAllureEpic } from "@helpers/allure"; +import { isMobile } from "@helpers/mobile"; +import { expect, Page } from "@playwright/test"; +import { randomUUID } from "crypto"; + +test.beforeEach(async ({ page }) => { + await setAllureEpic("10. User Snap"); + await page.goto("/"); + await page.waitForTimeout(2_000); // wait until page load properly + + await page.getByTestId("feedback-footer-button").click(); +}); + +test("10A. Should open feedback modal", async ({ page }) => { + await expect(page.getByLabel("Usersnap widget")).toBeVisible(); + await expect( + page.getByRole("button", { + name: "Report an issue Something", + }) + ).toBeVisible(); + await expect( + page.getByRole("button", { name: "Send an idea Let us know what" }) + ).toBeVisible(); +}); + +test("10B. Should verify a bug report form", async ({ page }) => { + await page + .getByRole("button", { + name: "Report an issue Something", + }) + .click(); + await expect( + page.getByRole("button", { name: "Close annotation" }) + ).toBeVisible(); + + if (isMobile(page)) { + await expect( + page.getByRole("button", { name: "Add screenshot" }) + ).toBeVisible(); + await page.getByRole("button", { name: "Close annotation" }).click(); + await expect(page.getByLabel("Take screenshot")).toBeVisible(); + } + + await expect( + page.getByRole("heading", { name: "Report a bug" }) + ).toBeVisible(); + await expect(page.getByPlaceholder("Add description")).toBeVisible(); + await expect(page.getByLabel("Record")).toBeVisible(); + await expect(page.getByRole("button", { name: "Submit" })).toBeVisible(); + + // check record action + await page.getByLabel("Record").click(); + await expect( + page.getByRole("button", { name: "Cancel recording" }) + ).toBeVisible(); +}); + +test("10C. Should verify feature form", async ({ page }) => { + await page + .getByRole("button", { name: "Send an idea Let us know what" }) + .click(); + + await expect( + page.getByRole("heading", { name: "Feature Request" }) + ).toBeVisible(); + await expect(page.getByPlaceholder("Feature description")).toBeVisible(); + await expect(page.getByPlaceholder("Please add some context")).toBeVisible(); + await expect(page.getByLabel("Take screenshot")).toBeVisible(); + await expect(page.getByLabel("Record")).toBeVisible(); + await expect( + page.getByRole("button", { name: "Request Feature" }) + ).toBeVisible(); + + // check screenshot action + await page.getByLabel("Take screenshot").click(); + await expect( + page.getByRole("button", { name: "Close annotation" }) + ).toBeVisible(); + await expect( + page.getByRole("button", { name: "Add screenshot" }) + ).toBeVisible(); + await page.getByRole("button", { name: "Close annotation" }).click(); + + // check record action + await page.getByLabel("Record").click(); + await expect( + page.getByRole("button", { name: "Cancel recording" }) + ).toBeVisible(); +}); + +test.describe("Submit Usersnap", () => { + const feedbackApiUrl = + "https://widget.usersnap.com/api/widget/xhrrpc?submit_feedback"; + const bucketUrl = "https://s3.eu-central-1.amazonaws.com/upload.usersnap.com"; + + const interceptBucket = async (page: Page) => { + await page.route(bucketUrl, async (route) => + route.fulfill({ + status: 204, + }) + ); + }; + + const interceptUsersnap = async (page: Page) => { + await page.route(feedbackApiUrl, async (route) => + route.fulfill({ + status: 200, + body: JSON.stringify({ + status: true, + data: { + feedback: { + feedback_id: randomUUID(), + assignee_id: randomUUID(), + labels: [], + }, + screen_recording_url: null, + attachment_urls: [ + { + url: bucketUrl, + fields: { + "Content-Type": "image/png", + key: randomUUID(), + }, + }, + ], + }, + }), + }) + ); + }; + + test("10D. Should report an issue", async ({ page }) => { + // Intercept Usersnap submit API + await interceptUsersnap(page); + await interceptBucket(page); + await page + .getByRole("button", { + name: "Report an issue Something", + }) + .click(); + + if (isMobile(page)) { + await page.getByRole("button", { name: "Add screenshot" }).click(); + } else { + // Draw rectangle + await page + .locator('[class^="jt-container-"] > svg') + .first() + .evaluate((element) => { + const rectangleSvg = ``; + element.innerHTML = rectangleSvg; + }); + } + + await page + .getByPlaceholder("Add description") + .fill(faker.lorem.paragraph(2)); + + await page.getByRole("button", { name: "Submit" }).click(); + + await expect(page.getByText("Thank you!")).toBeVisible(); + }); + + test("10E. Should submit an idea or new feature", async ({ page }) => { + // Intercept Usersnap submit API + await interceptUsersnap(page); + await interceptBucket(page); + + await page + .getByRole("button", { name: "Send an idea Let us know what" }) + .click(); + + await page + .getByPlaceholder("Feature description") + .fill(faker.lorem.words(4)); + await page + .getByPlaceholder("Please add some context") + .fill(faker.lorem.paragraph(2)); + + // add screenshot + await page.getByLabel("Take screenshot").click(); + await page.getByRole("button", { name: "Add screenshot" }).click(); + + await page.getByRole("button", { name: "Request Feature" }).click(); + + await expect(page.getByText("Thank you!")).toBeVisible(); + }); +}); diff --git a/tests/govtool-frontend/playwright/tests/6-miscellaneous/miscellaneous.spec.ts b/tests/govtool-frontend/playwright/tests/6-miscellaneous/miscellaneous.spec.ts index 3ca166579..ca88fb50b 100644 --- a/tests/govtool-frontend/playwright/tests/6-miscellaneous/miscellaneous.spec.ts +++ b/tests/govtool-frontend/playwright/tests/6-miscellaneous/miscellaneous.spec.ts @@ -9,12 +9,10 @@ import { REGISTER_DREP_DOC_URL, TERMS_AND_CONDITIONS, } from "@constants/docsUrl"; -import { faker } from "@faker-js/faker"; import { test } from "@fixtures/walletExtension"; import { setAllureEpic } from "@helpers/allure"; import { isMobile, openDrawer } from "@helpers/mobile"; import { expect, Page } from "@playwright/test"; -import { randomUUID } from "crypto"; import environments from "lib/constants/environments"; test.beforeEach(async () => { @@ -104,165 +102,7 @@ test("6M. Should navigate between footer links", async ({ page, context }) => { await expect(helpUrl).toHaveURL(HELP_DOC_URL); }); -test.describe("User Snap", () => { - test.beforeEach(async ({ page }) => { - await page.goto("/"); - await page.waitForTimeout(2_000); // wait until page load properly - - await page.getByTestId("feedback-footer-button").click(); - }); - - test("6N. Should open feedback modal", async ({ page }) => { - await expect(page.getByLabel("Usersnap widget")).toBeVisible(); - await expect( - page.getByRole("button", { - name: "Report an issue Something", - }) - ).toBeVisible(); - await expect( - page.getByRole("button", { - name: "Idea or new feature Let us", - }) - ).toBeVisible(); - }); - - test("6O. Should verify a bug report form", async ({ page }) => { - await page - .getByRole("button", { - name: "Report an issue Something", - }) - .click(); - - await expect( - page.getByRole("heading", { name: "Report a bug" }) - ).toBeVisible(); - await expect(page.getByPlaceholder("Your feedback")).toBeVisible(); - await expect(page.getByText("Drag & drop or Browse")).toBeVisible(); - await expect(page.getByLabel("Take screenshot")).toBeVisible(); - await expect(page.getByLabel("Record")).toBeVisible(); - await expect(page.getByRole("button", { name: "Submit" })).toBeVisible(); - }); - - test("6P. Should verify feature form", async ({ page }) => { - await page - .getByRole("button", { - name: "Idea or new feature Let us", - }) - .click(); - - await expect( - page.getByRole("heading", { name: "Idea or new feature" }) - ).toBeVisible(); - await expect( - page.getByPlaceholder("Example: New navigation") - ).toBeVisible(); - await expect( - page.getByPlaceholder("Example: New navigation") - ).toBeVisible(); - await expect(page.getByLabel("Any additional details")).toBeVisible(); - await expect(page.getByText("Drag & drop or Browse")).toBeVisible(); - await expect( - page.getByLabel("Please summarize your idea or") - ).toBeVisible(); - await expect(page.getByLabel("Take screenshot")).toBeVisible(); - await expect(page.getByLabel("Record")).toBeVisible(); - await expect(page.getByRole("button", { name: "Submit" })).toBeVisible(); - }); - - test.describe("Feedback Tests", () => { - const attachmentInputSelector = "input[type=file]"; - const feedbackApiUrl = - "https://widget.usersnap.com/api/widget/xhrrpc?submit_feedback"; - const bucketUrl = - "https://s3.eu-central-1.amazonaws.com/upload.usersnap.com"; - const mockAttachmentPath = "./lib/_mock/mockAttachment.png"; - - const interceptBucket = async (page: Page) => { - await page.route(bucketUrl, async (route) => - route.fulfill({ - status: 204, - }) - ); - }; - - const interceptUsersnap = async (page: Page) => { - await page.route(feedbackApiUrl, async (route) => - route.fulfill({ - status: 200, - body: JSON.stringify({ - status: true, - data: { - feedback: { - feedback_id: randomUUID(), - assignee_id: randomUUID(), - labels: [], - }, - screen_recording_url: null, - attachment_urls: [ - { - url: bucketUrl, - fields: { - "Content-Type": "image/png", - key: randomUUID(), - }, - }, - ], - }, - }), - }) - ); - }; - - test("6Q. Should report an issue", async ({ page }) => { - // Intercept Usersnap submit API - await interceptUsersnap(page); - await interceptBucket(page); - await page - .getByRole("button", { - name: "Report an issue Something", - }) - .click(); - - await page - .getByPlaceholder("Your feedback") - .fill(faker.lorem.paragraph(2)); - await page.setInputFiles(attachmentInputSelector, [mockAttachmentPath]); - - await page.getByRole("button", { name: "Submit" }).click(); - - await expect(page.getByText("Thank you!")).toBeVisible(); - }); - - test("6R. Should submit an idea or new feature", async ({ page }) => { - // Intercept Usersnap submit API - await interceptUsersnap(page); - await interceptBucket(page); - - await page - .getByRole("button", { - name: "Idea or new feature Let us", - }) - .click(); - - await page - .getByPlaceholder("Example: New navigation") - .fill(faker.lorem.words(4)); - await page - .getByLabel("Please summarize your idea or") - .fill(faker.lorem.paragraph(2)); - await page - .getByLabel("Any additional details") - .fill(faker.lorem.paragraph(2)); - await page.setInputFiles(attachmentInputSelector, [mockAttachmentPath]); - - await page.getByRole("button", { name: "Submit" }).click(); - - await expect(page.getByText("Thank you!")).toBeVisible(); - }); - }); -}); - -test("6S. Should Warn users that they are in bootstrapping phase via banner", async ({ +test("6N. Should Warn users that they are in bootstrapping phase via banner", async ({ page, context, }) => { @@ -296,7 +136,7 @@ test("6S. Should Warn users that they are in bootstrapping phase via banner", as await expect(bootstrap).toHaveURL(BOOTSTRAP_DOC_URL); }); -test("6T. Should display proper network name", async ({ page }) => { +test("6O. Should display proper network name", async ({ page }) => { await page.route("**/network/metrics", async (route) => { // Fetch the original response from the server const response = await route.fetch();