diff --git a/frontend-react/e2e/helpers/utils.ts b/frontend-react/e2e/helpers/utils.ts index 25ab43778d4..00324bebd68 100644 --- a/frontend-react/e2e/helpers/utils.ts +++ b/frontend-react/e2e/helpers/utils.ts @@ -85,8 +85,8 @@ export async function tableColumnDateTimeInRange( columnNumber: number, fromDate: string, toDate: string, - startTime: string, - endTime: string, + startTime?: string, + endTime?: string, ) { let datesInRange = true; const rowCount = await tableRows(page).count(); @@ -106,7 +106,7 @@ export async function tableColumnDateTimeInRange( return datesInRange; } -export function fromDateWithTime(date: string, time: string) { +export function fromDateWithTime(date: string, time?: string) { const fromDateTime = new Date(date); if (time) { @@ -123,7 +123,7 @@ export function fromDateWithTime(date: string, time: string) { return fromDateTime; } -export function toDateWithTime(date: string, time: string) { +export function toDateWithTime(date: string, time?: string) { const toDateTime = new Date(date); if (time) { diff --git a/frontend-react/e2e/pages/authenticated/submission-history.ts b/frontend-react/e2e/pages/authenticated/submission-history.ts index f09dad1bf5a..ac18da76c26 100644 --- a/frontend-react/e2e/pages/authenticated/submission-history.ts +++ b/frontend-react/e2e/pages/authenticated/submission-history.ts @@ -1,31 +1,86 @@ import { expect, Page } from "@playwright/test"; +import { TEST_ORG_IGNORE } from "../../helpers/utils"; import { MOCK_GET_SUBMISSION_HISTORY } from "../../mocks/submissionHistory"; import { MOCK_GET_SUBMISSIONS } from "../../mocks/submissions"; +import { BasePage, BasePageTestArgs, type RouteHandlerFulfillEntry } from "../BasePage"; export const URL_SUBMISSION_HISTORY = "/submissions"; export const API_GET_REPORT_HISTORY = `**/api/waters/report/**`; +export const id = "73e3cbc8-9920-4ab7-871f-843a1db4c074"; -export async function goto(page: Page) { - await page.goto(URL_SUBMISSION_HISTORY, { - waitUntil: "domcontentloaded", - }); -} +export class SubmissionHistoryPage extends BasePage { + static readonly URL_SUBMISSION_HISTORY = "/submissions"; -export async function gotoDetails(page: Page, id: string) { - await page.goto(`${URL_SUBMISSION_HISTORY}/${id}`, { - waitUntil: "domcontentloaded", - }); -} + constructor(testArgs: BasePageTestArgs) { + super( + { + url: SubmissionHistoryPage.URL_SUBMISSION_HISTORY, + title: "ReportStream - CDC's free, interoperable data transfer platform", + heading: testArgs.page.getByRole("heading", { + name: "Submission history", + }), + }, + testArgs, + ); + + this.addMockRouteHandlers([ + // Ignore Org + this.createMockSubmissionsForOrgHandler(TEST_ORG_IGNORE, MOCK_GET_SUBMISSIONS), + this.createMockSubmissionHistoryHandler(), + ]); + } + + createMockSubmissionsForOrgHandler( + organization: string, + mockFileName: any, + responseStatus = 200, + ): RouteHandlerFulfillEntry { + return [ + `**/api/waters/org/${organization}/submissions?*`, + () => { + return { + json: mockFileName, + status: responseStatus, + }; + }, + ]; + } -export function getOrgSubmissionsAPI(org: string) { - return `**/api/waters/org/${org}/submissions?*`; + createMockSubmissionHistoryHandler(responseStatus = 200): RouteHandlerFulfillEntry { + return [ + API_GET_REPORT_HISTORY, + () => { + return { + json: MOCK_GET_SUBMISSION_HISTORY, + status: responseStatus, + }; + }, + ]; + } + + get filterButton() { + return this.page.getByRole("button", { + name: "Filter", + }); + } + + get clearButton() { + return this.page.getByRole("button", { + name: "Clear", + }); + } + + /** + * Error expected additionally if user context isn't admin + */ + get isPageLoadExpected() { + return super.isPageLoadExpected && this.testArgs.storageState === this.testArgs.adminLogin.path; + } } -export async function mockGetSubmissionsResponse(page: Page, org: string, responseStatus = 200) { - const submissionsApi = getOrgSubmissionsAPI(org); - await page.route(submissionsApi, async (route) => { - const json = MOCK_GET_SUBMISSIONS; - await route.fulfill({ json, status: responseStatus }); +export async function goto(page: Page) { + await page.goto(URL_SUBMISSION_HISTORY, { + waitUntil: "domcontentloaded", }); } @@ -41,10 +96,6 @@ export async function openReportIdDetailPage(page: Page, id: string) { await expect(page.getByText(`Details: ${id}`)).toBeVisible(); } -export async function title(page: Page) { - await expect(page).toHaveTitle(/ReportStream - CDC's free, interoperable data transfer platform/); -} - export async function tableHeaders(page: Page) { await expect(page.locator(".usa-table th").nth(0)).toHaveText(/Report ID/); await expect(page.locator(".usa-table th").nth(1)).toHaveText("Date/time submitted"); diff --git a/frontend-react/e2e/pages/authenticated/submissions-details.ts b/frontend-react/e2e/pages/authenticated/submissions-details.ts new file mode 100644 index 00000000000..35af206373a --- /dev/null +++ b/frontend-react/e2e/pages/authenticated/submissions-details.ts @@ -0,0 +1,40 @@ +import { API_WATERS_REPORT } from "./report-details"; +import { URL_SUBMISSION_HISTORY } from "./submission-history"; +import { MOCK_GET_SUBMISSION_HISTORY } from "../../mocks/submissionHistory"; +import { BasePage, BasePageTestArgs, type RouteHandlerFulfillEntry } from "../BasePage"; + +export const id = "73e3cbc8-9920-4ab7-871f-843a1db4c074"; +export class SubmissionsDetailsPage extends BasePage { + static readonly URL_SUBMISSIONS_DETAILS = `${URL_SUBMISSION_HISTORY}/${id}`; + + constructor(testArgs: BasePageTestArgs) { + super( + { + url: SubmissionsDetailsPage.URL_SUBMISSIONS_DETAILS, + title: "ReportStream - CDC's free, interoperable data transfer platform", + }, + testArgs, + ); + + this.addMockRouteHandlers([this.createMockSubmissionHistoryHandler(MOCK_GET_SUBMISSION_HISTORY)]); + } + + createMockSubmissionHistoryHandler(mockFileName: any, responseStatus = 200): RouteHandlerFulfillEntry { + return [ + `${API_WATERS_REPORT}/${id}/history`, + () => { + return { + json: mockFileName, + status: responseStatus, + }; + }, + ]; + } + + /** + * Error expected additionally if user context isn't admin + */ + get isPageLoadExpected() { + return super.isPageLoadExpected && this.testArgs.storageState === this.testArgs.adminLogin.path; + } +} diff --git a/frontend-react/e2e/spec/all/daily-data-page-user-flow.spec.ts b/frontend-react/e2e/spec/all/authenticated/daily-data-page-user-flow.spec.ts similarity index 99% rename from frontend-react/e2e/spec/all/daily-data-page-user-flow.spec.ts rename to frontend-react/e2e/spec/all/authenticated/daily-data-page-user-flow.spec.ts index 71aaa857b75..891a2d47340 100644 --- a/frontend-react/e2e/spec/all/daily-data-page-user-flow.spec.ts +++ b/frontend-react/e2e/spec/all/authenticated/daily-data-page-user-flow.spec.ts @@ -11,7 +11,7 @@ import { TEST_ORG_ELIMS_RECEIVER_ELIMS, TEST_ORG_IGNORE, TEST_ORG_UP_RECEIVER_UP, -} from "../../helpers/utils"; +} from "../../../helpers/utils"; import { applyButton, DailyDataPage, @@ -28,9 +28,9 @@ import { setTime, startDate, startTime, -} from "../../pages/authenticated/daily-data.js"; -import { URL_REPORT_DETAILS } from "../../pages/authenticated/report-details.js"; -import { test as baseTest } from "../../test"; +} from "../../../pages/authenticated/daily-data.js"; +import { URL_REPORT_DETAILS } from "../../../pages/authenticated/report-details.js"; +import { test as baseTest } from "../../../test"; const defaultStartTime = "9:00am"; const defaultEndTime = "11:00pm"; diff --git a/frontend-react/e2e/spec/all/authenticated/submission-history-page-user-flow.spec.ts b/frontend-react/e2e/spec/all/authenticated/submission-history-page-user-flow.spec.ts new file mode 100644 index 00000000000..613836d3560 --- /dev/null +++ b/frontend-react/e2e/spec/all/authenticated/submission-history-page-user-flow.spec.ts @@ -0,0 +1,157 @@ +import { expect } from "@playwright/test"; + +import { + FALLBACK_FROM_DATE_STRING, + FALLBACK_TO_DATE_STRING, +} from "../../../../src/hooks/filters/UseDateRange/UseDateRange"; +import { tableColumnDateTimeInRange, tableDataCellValue, TEST_ORG_IGNORE } from "../../../helpers/utils"; +import { endDate, setDate, startDate } from "../../../pages/authenticated/daily-data"; +import * as submissionHistory from "../../../pages/authenticated/submission-history"; +import { openReportIdDetailPage, SubmissionHistoryPage } from "../../../pages/authenticated/submission-history"; +import { test as baseTest } from "../../../test"; + +export interface SubmissionHistoryPageFixtures { + submissionHistoryPage: SubmissionHistoryPage; +} + +const test = baseTest.extend({ + submissionHistoryPage: async ( + { + page: _page, + isMockDisabled, + adminLogin, + senderLogin, + receiverLogin, + storageState, + frontendWarningsLogPath, + isFrontendWarningsLog, + }, + use, + ) => { + const page = new SubmissionHistoryPage({ + page: _page, + isMockDisabled, + adminLogin, + senderLogin, + receiverLogin, + storageState, + frontendWarningsLogPath, + isFrontendWarningsLog, + isTestOrg: true, + }); + await page.goto(); + await use(page); + }, +}); + +test.describe( + "Submission history page - user flow smoke tests", + { + tag: "@smoke", + }, + () => { + test.describe("admin user", () => { + test.use({ storageState: "e2e/.auth/admin.json" }); + + test.beforeAll(({ browserName }) => { + test.skip(browserName !== "chromium"); + }); + + test.describe(`${TEST_ORG_IGNORE} org`, () => { + test("nav contains the 'Submission History' option", async ({ submissionHistoryPage }) => { + const navItems = submissionHistoryPage.page.locator(".usa-nav li"); + await expect(navItems).toContainText(["Submission History"]); + }); + + test("has correct title", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.page).toHaveTitle(submissionHistoryPage.title); + await expect(submissionHistoryPage.heading).toBeVisible(); + }); + + test("has filter", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.page.getByTestId("filter-container")).toBeAttached(); + }); + + test("has footer", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.footer).toBeAttached(); + }); + + test.describe("table", () => { + test.beforeEach(async ({ submissionHistoryPage }) => { + await submissionHistoryPage.page.locator(".usa-table tbody").waitFor({ state: "visible" }); + }); + + test("table has correct headers", async ({ submissionHistoryPage }) => { + await submissionHistory.tableHeaders(submissionHistoryPage.page); + }); + + test("table column 'ReportId' will open the report details", async ({ submissionHistoryPage }) => { + const reportId = await tableDataCellValue(submissionHistoryPage.page, 0, 0); + + await submissionHistoryPage.page.getByRole("link", { name: reportId }).click(); + const responsePromise = await submissionHistoryPage.page.waitForResponse( + (res) => res.status() === 200 && res.url().includes("/history"), + ); + + if (responsePromise) { + await openReportIdDetailPage(submissionHistoryPage.page, reportId); + } else { + console.error("Request not received within the timeout period"); + } + }); + + test("table has pagination", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.page.getByTestId("Submissions pagination")).toBeAttached(); + }); + }); + + test.describe("filter", () => { + test.describe("on 'onLoad'", () => { + test("'From' date has a default value", async ({ submissionHistoryPage }) => { + await expect(startDate(submissionHistoryPage.page)).toBeAttached(); + await expect(startDate(submissionHistoryPage.page)).toHaveValue(FALLBACK_FROM_DATE_STRING); + }); + + test("'To' date has a default value", async ({ submissionHistoryPage }) => { + await expect(endDate(submissionHistoryPage.page)).toBeAttached(); + await expect(endDate(submissionHistoryPage.page)).toHaveValue(FALLBACK_TO_DATE_STRING); + }); + }); + + test.describe("on 'Filter'", () => { + test("with 'From' date, 'To' date", async ({ submissionHistoryPage }) => { + const fromDate = await setDate(submissionHistoryPage.page, "#start-date", 180); + const toDate = await setDate(submissionHistoryPage.page, "#end-date", 0); + + // Apply button is enabled + await submissionHistoryPage.filterButton.click(); + await submissionHistoryPage.page.locator(".usa-table tbody").waitFor({ state: "visible" }); + + // Check that table data contains the dates/times that were selected + const areDatesInRange = await tableColumnDateTimeInRange( + submissionHistoryPage.page, + 1, + fromDate, + toDate, + ); + expect(areDatesInRange).toBe(true); + }); + + test("on 'clear' resets the dates", async ({ submissionHistoryPage }) => { + await expect(startDate(submissionHistoryPage.page)).toHaveValue(FALLBACK_FROM_DATE_STRING); + await expect(endDate(submissionHistoryPage.page)).toHaveValue(FALLBACK_TO_DATE_STRING); + + await setDate(submissionHistoryPage.page, "#start-date", 14); + await setDate(submissionHistoryPage.page, "#end-date", 14); + + await submissionHistoryPage.clearButton.click(); + + await expect(startDate(submissionHistoryPage.page)).toHaveValue(FALLBACK_FROM_DATE_STRING); + await expect(endDate(submissionHistoryPage.page)).toHaveValue(FALLBACK_TO_DATE_STRING); + }); + }); + }); + }); + }); + }, +); diff --git a/frontend-react/e2e/spec/all/authenticated/submission-history-page.spec.ts b/frontend-react/e2e/spec/all/authenticated/submission-history-page.spec.ts index 98f6a4f684c..eeb9a260ffd 100644 --- a/frontend-react/e2e/spec/all/authenticated/submission-history-page.spec.ts +++ b/frontend-react/e2e/spec/all/authenticated/submission-history-page.spec.ts @@ -1,15 +1,48 @@ -import { expect, test } from "@playwright/test"; +import { expect } from "@playwright/test"; -import { noData, selectTestOrg, tableDataCellValue, tableRows, TEST_ORG_IGNORE } from "../../../helpers/utils"; +import { noData, tableDataCellValue, tableRows } from "../../../helpers/utils"; import * as submissionHistory from "../../../pages/authenticated/submission-history"; -import { openReportIdDetailPage } from "../../../pages/authenticated/submission-history"; +import { id, openReportIdDetailPage, SubmissionHistoryPage } from "../../../pages/authenticated/submission-history"; +import { test as baseTest, logins } from "../../../test"; + +export interface SubmissionHistoryPageFixtures { + submissionHistoryPage: SubmissionHistoryPage; +} + +const test = baseTest.extend({ + submissionHistoryPage: async ( + { + page: _page, + isMockDisabled, + adminLogin, + senderLogin, + receiverLogin, + storageState, + frontendWarningsLogPath, + isFrontendWarningsLog, + }, + use, + ) => { + const page = new SubmissionHistoryPage({ + page: _page, + isMockDisabled, + adminLogin, + senderLogin, + receiverLogin, + storageState, + frontendWarningsLogPath, + isFrontendWarningsLog, + isTestOrg: true, + }); + await page.goto(); + await use(page); + }, +}); -const id = "73e3cbc8-9920-4ab7-871f-843a1db4c074"; test.describe("Submission history page", () => { test.describe("not authenticated", () => { - test("redirects to login", async ({ page }) => { - await submissionHistory.goto(page); - await expect(page).toHaveURL("/login"); + test("redirects to login", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.page).toHaveURL("/login"); }); }); @@ -25,156 +58,137 @@ test.describe("Submission history page", () => { await expect(page.getByText("Cannot fetch Organization data as admin")).toBeVisible(); }); - test("has footer", async ({ page }) => { - await expect(page.locator("footer")).toBeAttached(); + test("has footer", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.footer).toBeAttached(); }); }); test.describe("with org selected", () => { - test.beforeEach(async ({ page }) => { - await selectTestOrg(page); - await submissionHistory.mockGetSubmissionsResponse(page, TEST_ORG_IGNORE); - await submissionHistory.mockGetReportHistoryResponse(page); - // abort all app insight calls - await page.route("**/v2/track", (route) => route.abort()); - await submissionHistory.goto(page); - }); - - test("nav contains the 'Submission History' option", async ({ page }) => { - const navItems = page.locator(".usa-nav li"); + test("nav contains the 'Submission History' option", async ({ submissionHistoryPage }) => { + const navItems = submissionHistoryPage.page.locator(".usa-nav li"); await expect(navItems).toContainText(["Submission History"]); }); - test("has correct title", async ({ page }) => { - await expect(page).toHaveTitle(/Submission history/); + test("has correct title", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.page).toHaveTitle(/Submission history/); }); - test("has filter", async ({ page }) => { - await expect(page.getByTestId("filter-container")).toBeAttached(); + test("has filter", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.page.getByTestId("filter-container")).toBeAttached(); }); test.describe("table", () => { - test("table has correct headers", async ({ page }) => { - await submissionHistory.tableHeaders(page); + test("table has correct headers", async ({ submissionHistoryPage }) => { + await submissionHistory.tableHeaders(submissionHistoryPage.page); }); - test("table column 'ReportId' will open the report details", async ({ page }) => { - const reportId = tableRows(page).nth(0).locator("td").nth(0); + test("table column 'ReportId' will open the report details", async ({ submissionHistoryPage }) => { + const reportId = tableRows(submissionHistoryPage.page).nth(0).locator("td").nth(0); await expect(reportId).toContainText(id); await reportId.getByRole("link", { name: id }).click(); - await openReportIdDetailPage(page, id); + await openReportIdDetailPage(submissionHistoryPage.page, id); }); - test("table column 'Date/time submitted' has expected data", async ({ page }) => { - expect(await tableDataCellValue(page, 0, 1)).toEqual("3/7/2024, 6:00:22 PM"); + test("table column 'Date/time submitted' has expected data", async ({ submissionHistoryPage }) => { + expect(await tableDataCellValue(submissionHistoryPage.page, 0, 1)).toEqual("3/7/2024, 6:00:22 PM"); }); - test("table column 'File' has expected data", async ({ page }) => { - expect(await tableDataCellValue(page, 0, 2)).toEqual("myfile.hl7"); - expect(await tableDataCellValue(page, 1, 2)).toEqual( + test("table column 'File' has expected data", async ({ submissionHistoryPage }) => { + expect(await tableDataCellValue(submissionHistoryPage.page, 0, 2)).toEqual("myfile.hl7"); + expect(await tableDataCellValue(submissionHistoryPage.page, 1, 2)).toEqual( "None-03c3b7ab-7c65-4174-bea7-9195cbb7ed01-20240314174050.hl7", ); }); - test("table column 'Records' has expected data", async ({ page }) => { - expect(await tableDataCellValue(page, 0, 3)).toEqual("1"); + test("table column 'Records' has expected data", async ({ submissionHistoryPage }) => { + expect(await tableDataCellValue(submissionHistoryPage.page, 0, 3)).toEqual("1"); }); - test("table column 'Status' has expected data", async ({ page }) => { - expect(await tableDataCellValue(page, 0, 4)).toEqual("Success"); + test("table column 'Status' has expected data", async ({ submissionHistoryPage }) => { + expect(await tableDataCellValue(submissionHistoryPage.page, 0, 4)).toEqual("Success"); }); - test("table has pagination", async ({ page }) => { - await expect(page.getByTestId("Submissions pagination")).toBeAttached(); + test("table has pagination", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.page.getByTestId("Submissions pagination")).toBeAttached(); }); }); - test("has footer", async ({ page }) => { - await expect(page.locator("footer")).toBeAttached(); + test("has footer", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.footer).toBeAttached(); }); }); }); test.describe("receiver user", () => { - test.use({ storageState: "e2e/.auth/receiver.json" }); - - test.beforeEach(async ({ page }) => { - await submissionHistory.goto(page); - }); + test.use({ storageState: logins.receiver.path }); - test("nav does not contain the Submissions option", async ({ page }) => { - const navItems = page.locator(".usa-nav li"); + test("nav does not contain the Submissions option", async ({ submissionHistoryPage }) => { + const navItems = submissionHistoryPage.page.locator(".usa-nav li"); await expect(navItems).not.toContainText(["Submissions"]); }); - test("displays no data message", async ({ page }) => { - await expect(noData(page)).toBeAttached(); + test("displays no data message", async ({ submissionHistoryPage }) => { + await expect(noData(submissionHistoryPage.page)).toBeAttached(); }); - test("has correct title", async ({ page }) => { - await expect(page).toHaveTitle(/Submission history/); + test("has correct title", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.page).toHaveTitle(/Submission history/); }); - test("has footer", async ({ page }) => { - await expect(page.locator("footer")).toBeAttached(); + test("has footer", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.footer).toBeAttached(); }); }); test.describe("sender user", () => { - test.use({ storageState: "e2e/.auth/sender.json" }); - - test.beforeEach(async ({ page }) => { - await submissionHistory.mockGetSubmissionsResponse(page, TEST_ORG_IGNORE); - await submissionHistory.mockGetReportHistoryResponse(page); - await submissionHistory.goto(page); - }); + test.use({ storageState: logins.sender.path }); - test("nav contains the Submission History option", async ({ page }) => { - const navItems = page.locator(".usa-nav li"); + test("nav contains the Submission History option", async ({ submissionHistoryPage }) => { + const navItems = submissionHistoryPage.page.locator(".usa-nav li"); await expect(navItems).toContainText(["Submission History"]); }); - test("has correct title", async ({ page }) => { - await expect(page).toHaveTitle(/Submission history/); + test("has correct title", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.page).toHaveTitle(/Submission history/); }); - test("has filter", async ({ page }) => { - await expect(page.getByTestId("filter-container")).toBeAttached(); + test("has filter", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.page.getByTestId("filter-container")).toBeAttached(); }); test.describe("table", () => { - test("table has correct headers", async ({ page }) => { - await submissionHistory.tableHeaders(page); + test("table has correct headers", async ({ submissionHistoryPage }) => { + await submissionHistory.tableHeaders(submissionHistoryPage.page); }); - test("table column 'ReportId' will open the report details", async ({ page }) => { - const reportId = tableRows(page).nth(0).locator("td").nth(0); + test("table column 'ReportId' will open the report details", async ({ submissionHistoryPage }) => { + const reportId = tableRows(submissionHistoryPage.page).nth(0).locator("td").nth(0); await expect(reportId).toContainText(id); await reportId.getByRole("link", { name: id }).click(); - await openReportIdDetailPage(page, id); + await openReportIdDetailPage(submissionHistoryPage.page, id); }); - test("table column 'Date/time submitted' has expected data", async ({ page }) => { - expect(await tableDataCellValue(page, 0, 1)).toEqual("3/7/2024, 6:00:22 PM"); + test("table column 'Date/time submitted' has expected data", async ({ submissionHistoryPage }) => { + expect(await tableDataCellValue(submissionHistoryPage.page, 0, 1)).toEqual("3/7/2024, 6:00:22 PM"); }); - test("table column 'Records' has expected data", async ({ page }) => { - expect(await tableDataCellValue(page, 0, 3)).toEqual("1"); + test("table column 'Records' has expected data", async ({ submissionHistoryPage }) => { + expect(await tableDataCellValue(submissionHistoryPage.page, 0, 3)).toEqual("1"); }); - test("table column 'Status' has expected data", async ({ page }) => { - expect(await tableDataCellValue(page, 0, 4)).toEqual("Success"); + test("table column 'Status' has expected data", async ({ submissionHistoryPage }) => { + expect(await tableDataCellValue(submissionHistoryPage.page, 0, 4)).toEqual("Success"); }); - test("table has pagination", async ({ page }) => { - await expect(page.getByTestId("Submissions pagination")).toBeAttached(); + test("table has pagination", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.page.getByTestId("Submissions pagination")).toBeAttached(); }); }); - test("has footer", async ({ page }) => { - await expect(page.locator("footer")).toBeAttached(); + test("has footer", async ({ submissionHistoryPage }) => { + await expect(submissionHistoryPage.footer).toBeAttached(); }); }); }); diff --git a/frontend-react/e2e/spec/all/authenticated/submissions-details-page.spec.ts b/frontend-react/e2e/spec/all/authenticated/submissions-details-page.spec.ts index a25780ae0b8..1a543f2f238 100644 --- a/frontend-react/e2e/spec/all/authenticated/submissions-details-page.spec.ts +++ b/frontend-react/e2e/spec/all/authenticated/submissions-details-page.spec.ts @@ -1,133 +1,143 @@ -import { expect, test } from "@playwright/test"; -import { selectTestOrg } from "../../../helpers/utils"; -import * as reportDetails from "../../../pages/authenticated/report-details"; +import { expect } from "@playwright/test"; import * as submissionDetails from "../../../pages/authenticated/submission-history"; import { URL_SUBMISSION_HISTORY } from "../../../pages/authenticated/submission-history"; +import { id, SubmissionsDetailsPage } from "../../../pages/authenticated/submissions-details"; +import { test as baseTest, logins } from "../../../test"; + +export interface SubmissionsDetailsPageFixtures { + submissionsDetailsPage: SubmissionsDetailsPage; +} + +const test = baseTest.extend({ + submissionsDetailsPage: async ( + { + page: _page, + isMockDisabled, + adminLogin, + senderLogin, + receiverLogin, + storageState, + frontendWarningsLogPath, + isFrontendWarningsLog, + }, + use, + ) => { + const page = new SubmissionsDetailsPage({ + page: _page, + isMockDisabled, + adminLogin, + senderLogin, + receiverLogin, + storageState, + frontendWarningsLogPath, + isFrontendWarningsLog, + isTestOrg: true, + }); + await page.goto(); + await use(page); + }, +}); -const id = "73e3cbc8-9920-4ab7-871f-843a1db4c074"; test.describe("Submissions Details page", () => { test.describe("not authenticated", () => { - test("redirects to login", async ({ page }) => { - await submissionDetails.gotoDetails(page, id); - await expect(page).toHaveURL("/login"); + test("redirects to login", async ({ submissionsDetailsPage }) => { + await expect(submissionsDetailsPage.page).toHaveURL("/login"); }); }); test.describe("admin user - happy path", () => { - test.use({ storageState: "e2e/.auth/admin.json" }); + test.use({ storageState: logins.admin.path }); test.describe("without org selected", () => { - test.beforeEach(async ({ page }) => { - await reportDetails.mockGetSubmissionHistoryResponse(page, id); - await submissionDetails.gotoDetails(page, id); - }); - - test("has correct title", async ({ page }) => { - await submissionDetails.title(page); + test("has correct title", async ({ submissionsDetailsPage }) => { + await expect(submissionsDetailsPage.page).toHaveTitle(submissionsDetailsPage.title); }); - test("has reportId in breadcrumb", async ({ page }) => { - await expect(page.locator(".usa-breadcrumb ol li").nth(1)).toHaveText(`Details: ${id}`); + test("has reportId in breadcrumb", async ({ submissionsDetailsPage }) => { + await expect(submissionsDetailsPage.page.locator(".usa-breadcrumb ol li").nth(1)).toHaveText( + `Details: ${id}`, + ); }); - test("has footer", async ({ page }) => { - await expect(page.locator("footer")).toBeAttached(); + test("has footer", async ({ submissionsDetailsPage }) => { + await expect(submissionsDetailsPage.page.locator("footer")).toBeAttached(); }); }); test.describe("with org selected", () => { - test.beforeEach(async ({ page }) => { - await selectTestOrg(page); - await reportDetails.mockGetSubmissionHistoryResponse(page, id); - await submissionDetails.gotoDetails(page, id); - }); - - test("has correct title", async ({ page }) => { - await submissionDetails.title(page); + test("breadcrumb navigates to Submission History page", async ({ submissionsDetailsPage }) => { + await submissionDetails.breadcrumbLink( + submissionsDetailsPage.page, + 0, + "Submissions", + URL_SUBMISSION_HISTORY, + ); }); - test("breadcrumb navigates to Submission History page", async ({ page }) => { - await submissionDetails.breadcrumbLink(page, 0, "Submissions", URL_SUBMISSION_HISTORY); - }); - - test("has footer", async ({ page }) => { - await expect(page.locator("footer")).toBeAttached(); + test("has footer", async ({ submissionsDetailsPage }) => { + await expect(submissionsDetailsPage.page.locator("footer")).toBeAttached(); }); }); }); test.describe("admin user - server error", () => { - test.use({ storageState: "e2e/.auth/admin.json" }); + test.use({ storageState: logins.admin.path }); - test.beforeEach(async ({ page }) => { - await reportDetails.mockGetSubmissionHistoryResponse(page, id, 500); - await submissionDetails.gotoDetails(page, id); - }); - - test("has error message", async ({ page }) => { - await expect(page.getByText(/An error has occurred./)).toBeAttached(); - }); + test("error is shown on the page", async ({ submissionsDetailsPage }) => { + submissionsDetailsPage.mockError = true; + await submissionsDetailsPage.reload(); - test("has footer", async ({ page }) => { - await expect(page.locator("footer")).toBeAttached(); + await expect(submissionsDetailsPage.page.getByText(/An error has occurred./)).toBeAttached(); + await expect(submissionsDetailsPage.page.locator("footer")).toBeAttached(); }); }); test.describe("sender user - happy path", () => { - test.use({ storageState: "e2e/.auth/sender.json" }); + test.use({ storageState: logins.sender.path }); - test.beforeEach(async ({ page }) => { - await reportDetails.mockGetSubmissionHistoryResponse(page, id); - await submissionDetails.gotoDetails(page, id); + test("has correct title", async ({ submissionsDetailsPage }) => { + await expect(submissionsDetailsPage.page).toHaveTitle(submissionsDetailsPage.title); }); - test("has correct title", async ({ page }) => { - await submissionDetails.title(page); + test("has reportId in breadcrumb", async ({ submissionsDetailsPage }) => { + await expect(submissionsDetailsPage.page.locator(".usa-breadcrumb ol li").nth(1)).toHaveText( + `Details: ${id}`, + ); }); - test("has reportId in breadcrumb", async ({ page }) => { - await expect(page.locator(".usa-breadcrumb ol li").nth(1)).toHaveText(`Details: ${id}`); + test("breadcrumb navigates to Submission History page", async ({ submissionsDetailsPage }) => { + await submissionDetails.breadcrumbLink( + submissionsDetailsPage.page, + 0, + "Submissions", + URL_SUBMISSION_HISTORY, + ); }); - test("breadcrumb navigates to Submission History page", async ({ page }) => { - await submissionDetails.breadcrumbLink(page, 0, "Submissions", URL_SUBMISSION_HISTORY); - }); - - test("has footer", async ({ page }) => { - await expect(page.locator("footer")).toBeAttached(); + test("has footer", async ({ submissionsDetailsPage }) => { + await expect(submissionsDetailsPage.page.locator("footer")).toBeAttached(); }); }); test.describe("sender user - server error", () => { - test.use({ storageState: "e2e/.auth/sender.json" }); - - test.beforeEach(async ({ page }) => { - await reportDetails.mockGetSubmissionHistoryResponse(page, id, 500); - await submissionDetails.gotoDetails(page, id); - }); - - test("has error message", async ({ page }) => { - await expect(page.getByText(/An error has occurred./)).toBeAttached(); - }); + test.use({ storageState: logins.sender.path }); - test("has footer", async ({ page }) => { - await expect(page.locator("footer")).toBeAttached(); + test("has error message", async ({ submissionsDetailsPage }) => { + submissionsDetailsPage.mockError = true; + await submissionsDetailsPage.reload(); + await expect(submissionsDetailsPage.page.getByText(/An error has occurred./)).toBeAttached(); + await expect(submissionsDetailsPage.page.locator("footer")).toBeAttached(); }); }); test.describe("receiver user", () => { - test.use({ storageState: "e2e/.auth/receiver.json" }); - - test.beforeEach(async ({ page }) => { - await submissionDetails.gotoDetails(page, id); - }); - - test("has error message", async ({ page }) => { - await expect(page.getByText(/An error has occurred./)).toBeAttached(); - }); + test.use({ storageState: logins.receiver.path }); - test("has footer", async ({ page }) => { - await expect(page.locator("footer")).toBeAttached(); + test("has error message", async ({ submissionsDetailsPage }) => { + submissionsDetailsPage.mockError = true; + await submissionsDetailsPage.reload(); + await expect(submissionsDetailsPage.page.getByText(/An error has occurred./)).toBeAttached(); + await expect(submissionsDetailsPage.page.locator("footer")).toBeAttached(); }); }); });