From a4aad412998ebe736864ec4e012ded5a04812922 Mon Sep 17 00:00:00 2001 From: fzhao99 Date: Thu, 7 Dec 2023 08:50:39 -0500 Subject: [PATCH] Bob/test card refactor e2e (#7014) * rename test specs * match the pattern correctly * fix spec 04 * fix spec 9 * rename test * some more work on the alternate flows * move action menu into main spec and refactor alternate specs * fix frontend tests * add modal dismissals to e2es * remove unused import * dedupe test id * jk remove the extra styles for submit * add force true * maybe consolidate tests * update * fix class * snapshots --- .../src/main/resources/application-e2e.yaml | 4 +- .../e2e/04-covid_only_test_main_flow.cy.js | 120 --------- cypress/e2e/04-covid_only_tests.cy.js | 242 ++++++++++++++++++ .../04b-covid_only_test_alternate_flows.cy.js | 198 -------------- cypress/e2e/09-multiplex_testing.cy.js | 31 ++- .../src/app/testQueue/TestCard/TestCard.tsx | 1 + .../__snapshots__/TestCard.test.tsx.snap | 1 + .../__snapshots__/TestQueue.test.tsx.snap | 2 + 8 files changed, 263 insertions(+), 336 deletions(-) delete mode 100644 cypress/e2e/04-covid_only_test_main_flow.cy.js create mode 100644 cypress/e2e/04-covid_only_tests.cy.js delete mode 100644 cypress/e2e/04b-covid_only_test_alternate_flows.cy.js diff --git a/backend/src/main/resources/application-e2e.yaml b/backend/src/main/resources/application-e2e.yaml index 2aba5dc96d..fc49f1c109 100644 --- a/backend/src/main/resources/application-e2e.yaml +++ b/backend/src/main/resources/application-e2e.yaml @@ -130,5 +130,5 @@ simple-report-initialization: datahub: url: "http://invalidhost:8080" api-key: "placeholder" -features: - testCardRefactorEnabled: false \ No newline at end of file + features: + testCardRefactorEnabled: true \ No newline at end of file diff --git a/cypress/e2e/04-covid_only_test_main_flow.cy.js b/cypress/e2e/04-covid_only_test_main_flow.cy.js deleted file mode 100644 index d6a0483b76..0000000000 --- a/cypress/e2e/04-covid_only_test_main_flow.cy.js +++ /dev/null @@ -1,120 +0,0 @@ -import { loginHooks } from "../support/e2e"; -import { graphqlURL } from "../utils/request-utils"; -import { aliasGraphqlOperations } from "../utils/graphql-test-utils"; - -describe("Conducting a COVID test", () => { - let patientName, lastName, covidOnlyDeviceName; - const queueCard = "div.prime-queue-item:last-of-type"; - loginHooks(); - - before("retrieve the patient name and covid device name", () => { - cy.task("getPatientName").then((name) => { - patientName = name; - lastName = patientName.split(",")[0]; - }); - cy.task("getCovidOnlyDeviceName").then((name) => { - covidOnlyDeviceName = name; - }); - }); - - beforeEach(() => { - cy.intercept("POST", graphqlURL, (req) => { - aliasGraphqlOperations(req); - }); - }); - - it("searches for the patient", () => { - cy.visit("/"); - cy.get(".usa-nav-container"); - cy.get("#desktop-conduct-test-nav-link").click(); - cy.get("#search-field-small").type(lastName); - cy.get(".results-dropdown").contains(lastName); - - cy.wait("@GetPatientsByFacilityForQueue"); - - cy.injectSRAxe(); - cy.checkAccessibility(); // Conduct Tests page - }); - it("begins a test", () => { - cy.get(".results-dropdown").within(() => { - cy.get("button.usa-button--unstyled:first-of-type") - .contains("Begin test") - .click(); - }); - - cy.get(".ReactModal__Content").contains( - "Are you experiencing any of the following symptoms?" - ); - - // Test a11y on the AoE modal - cy.checkAccessibility(); - }); - it("fills out the aoe questions and submits", () => { - cy.get(".ReactModal__Content").within(() => { - cy.get('input[name="no_symptoms"][value="no"]+label').click(); - cy.get('input[name="pregnancy"][value="60001007"]+label').click(); - cy.get("#aoe-form-save-button").click(); - }); - - cy.wait("@AddPatientToQueue"); - cy.wait("@GetFacilityQueue", { timeout: 20000 }); - - cy.get(".prime-home").contains(patientName); - - cy.get(queueCard).contains("COVID-19 results"); - - cy.checkAccessibility(); // Test Card page - }); - it("completes the test", () => { - cy.get(queueCard).within(() => { - cy.get('select[name="testDevice"]').select(covidOnlyDeviceName); - cy.get('select[name="testDevice"]') - .find("option:selected") - .should("have.text", covidOnlyDeviceName); - }); - - // We cant wait on EditQueueItem after selecting as device - // because if the covid device was already selected, - // then it won't trigger a network call - cy.wait("@GetFacilityQueue", { timeout: 20000 }); - - // Wait for the FacilityQueue results to populate - // To be resolved in #6079 - // https://github.com/CDCgov/prime-simplereport/pull/6464#discussion_r1313361521 - // eslint-disable-next-line cypress/no-unnecessary-waiting - cy.wait(100); - cy.get(queueCard).within(() => { - cy.contains("label", "Negative (-)").click(); - }); - - cy.wait("@EditQueueItem"); - - cy.get(queueCard).within(() => { - cy.get(".prime-test-result-submit button") - .last() - .should("be.enabled") - .click(); - }); - - cy.wait("@SubmitQueueItem"); - - cy.contains(`Result for ${patientName} was saved and reported.`); - cy.get(".prime-home .grid-container").should("not.have.text", patientName); - }); - it("shows the result on the results table", () => { - cy.get("#desktop-results-nav-link").click(); - cy.get(".usa-table").contains(patientName); - - // Test a11y on the Results page - cy.checkAccessibility(); - }); - it("stores the patient link", () => { - cy.get(".sr-test-result-row").then(($row) => { - const dataTestId = $row.attr("data-testid"); - const testEventId = dataTestId.split("-").slice(2, 7).join("-"); - - cy.task("setTestEventId", testEventId); - cy.task("setPatientName", patientName); - }); - }); -}); diff --git a/cypress/e2e/04-covid_only_tests.cy.js b/cypress/e2e/04-covid_only_tests.cy.js new file mode 100644 index 0000000000..0582d7d2e0 --- /dev/null +++ b/cypress/e2e/04-covid_only_tests.cy.js @@ -0,0 +1,242 @@ +import { generatePatient, loginHooks } from "../support/e2e"; +import { graphqlURL } from "../utils/request-utils"; +import { aliasGraphqlOperations } from "../utils/graphql-test-utils"; + +describe("Conducting a COVID test from:", () => { + let patientName, lastName, covidOnlyDeviceName; + const queueCard = "[data-cy=prime-queue-item]:last-of-type"; + loginHooks(); + + before("retrieve the patient name and covid device name", () => { + cy.task("getPatientName").then((name) => { + patientName = name; + lastName = patientName.split(",")[0]; + }); + cy.task("getCovidOnlyDeviceName").then((name) => { + covidOnlyDeviceName = name; + }); + }); + + beforeEach(() => { + cy.intercept("POST", graphqlURL, (req) => { + aliasGraphqlOperations(req); + }); + }); + + it("conducts a test from the result page", () => { + cy.visit("/"); + cy.get(".usa-nav-container"); + cy.get("#desktop-conduct-test-nav-link").click(); + cy.get("#search-field-small").type(lastName); + cy.get(".results-dropdown").contains(lastName); + + cy.wait("@GetPatientsByFacilityForQueue"); + + cy.injectSRAxe(); + cy.get(".results-dropdown").within(() => { + cy.get("button.usa-button--unstyled:first-of-type") + .contains("Begin test") + .click(); + }); + + cy.wait("@AddPatientToQueue"); + cy.wait("@GetFacilityQueue", { timeout: 20000 }); + + cy.get(".prime-home").contains(patientName); + cy.contains("Newly added patients go to the bottom of the queue").click(); + + cy.get(queueCard).contains("COVID-19 result"); + + cy.get(queueCard).within(() => { + cy.get('select[name="testDevice"]').select(covidOnlyDeviceName); + cy.get('select[name="testDevice"]') + .find("option:selected") + .should("have.text", covidOnlyDeviceName); + }); + + // We cant wait on EditQueueItem after selecting as device + // because if the covid device was already selected, + // then it won't trigger a network call + cy.wait("@GetFacilityQueue", { timeout: 20000 }); + + cy.contains("Submit results").click(); + cy.contains("Please enter a valid test result"); + cy.contains("Invalid test results").click(); + + cy.contains("legend", "COVID-19 result") + .next("div") + .within(() => { + cy.contains("label", "Negative (-)").click(); + }); + + cy.get(queueCard).within(() => { + cy.contains("Please enter a valid test result").should("not.exist"); + }); + + cy.wait("@EditQueueItem"); + + // fill out aoe and submit + cy.contains("legend", "Is the patient pregnant?") + .next("div") + .within(() => { + cy.contains("label", "Yes").click(); + }); + + cy.contains("legend", "Is the patient currently experiencing any symptoms?") + .next("div") + .within(() => { + cy.contains("label", "No").click(); + }); + + cy.contains("Select any symptoms the patient is experiencing").should( + "not.exist", + ); + + cy.contains("legend", "Is the patient currently experiencing any symptoms?") + .next("div") + .within(() => { + cy.contains("label", "Yes").click(); + }); + + cy.contains("Select any symptoms the patient is experiencing").should( + "exist", + ); + + cy.contains("label", "When did the patient's symptoms start?") + .next("input") + .type("2021-10-05"); + + cy.contains("legend", "Select any symptoms the patient is experiencing") + .next("div") + .within(() => { + cy.contains("label", "Chills").click(); + cy.contains("label", "Headache").click(); + }); + + cy.checkAccessibility(); + + cy.contains("Submit results").click(); + cy.wait("@SubmitQueueItem"); + + cy.contains(`Result for ${patientName} was saved and reported.`); + cy.get(".prime-home .grid-container").should("not.have.text", patientName); + + cy.get("#desktop-results-nav-link").click(); + cy.get(".usa-table").contains(patientName); + + // // stores the patient link + cy.get(".sr-test-result-row").then(($row) => { + const dataTestId = $row.attr("data-testid"); + const testEventId = dataTestId.split("-").slice(2, 7).join("-"); + + cy.task("setTestEventId", testEventId); + cy.task("setPatientName", patientName); + }); + + cy.checkAccessibility(); + }); + + it("starts a test via the manage patients page action menu and then submits a test", () => { + cy.visit("/"); + cy.get(".usa-nav-container"); + cy.get('[data-cy="desktop-patient-nav-link"]').click(); + cy.get('[data-cy="manage-patients-header"]').contains("Patients"); + cy.get('[data-cy="manage-patients-header"]').contains("Showing"); + cy.get('[data-cy="manage-patients-search-input"]').type(lastName); + cy.wait("@GetPatientsByFacility"); + cy.get('[data-cy="manage-patients-page"]').contains(patientName); + + cy.contains("tr", patientName).find(".sr-actions-menu").click(); + cy.contains("Start test").click({ force: true }); + + cy.wait("@GetFacilityQueue", { timeout: 20000 }); + cy.contains("Newly added patients go to the bottom of the queue").click(); + + cy.contains("legend", "COVID-19 result") + .next("div") + .within(() => { + cy.contains("label", "Negative (-)").click(); + }); + + cy.contains("legend", "Is the patient pregnant?") + .next("div") + .within(() => { + cy.contains("label", "No").click(); + }); + + cy.contains("legend", "Is the patient currently experiencing any symptoms?") + .next("div") + .within(() => { + cy.contains("label", "No").click(); + }); + + cy.contains("Submit results").click(); + cy.wait("@SubmitQueueItem"); + }); + + it("starts and submits a test for a new patient from the patient form", () => { + const patient = generatePatient(); + patient.email = "myemail@test.com"; + + cy.visit("/"); + cy.get(".usa-nav-container"); + cy.get("#desktop-patient-nav-link").click(); + cy.get("#add-patient").click(); + cy.get("#individual_add-patient").click(); + cy.get(".prime-edit-patient").contains("Add new patient"); + cy.injectSRAxe(); + cy.checkAccessibility(); // New Patient page + + cy.get('input[name="firstName"]').type(patient.firstName); + cy.get('input[name="lastName"]').type(patient.lastName); + cy.get('select[name="facilityId"]').select("All facilities"); + cy.get('input[name="birthDate"]').type(patient.dobForInput); + cy.get('input[name="number"]').type(patient.phone); + cy.get('input[value="LANDLINE"]+label').click(); + cy.get('input[name="email-0"]').type(patient.email); + cy.get('input[name="street"]').type(patient.address); + cy.get('input[name="city"]').type(patient.city); + cy.get('select[name="state"]').select(patient.state); + cy.get('input[name="zipCode"]').type(patient.zip); + cy.get('input[name="race"][value="other"]+label').click(); + cy.get('input[name="ethnicity"][value="refused"]+label').click(); + cy.get('input[name="gender"][value="male"]+label').click(); + cy.get(".prime-save-patient-changes-start-test").first().click(); + cy.get( + '.modal__container input[name="addressSelect-person"][value="userAddress"]+label', + ).click(); + cy.checkAccessibility(); + + cy.get(".modal__container #save-confirmed-address").click(); + cy.url().should("include", "queue"); + + cy.wait("@GetFacilityQueue", { timeout: 20000 }); + + cy.get(".prime-home").contains(patient.firstName); + cy.url().should("include", "queue"); + cy.wait("@GetFacilityQueue", { timeout: 20000 }); + cy.contains("Patient record created").click(); + cy.contains("Newly added patients go to the bottom of the queue").click(); + + cy.contains("legend", "COVID-19 result") + .next("div") + .within(() => { + cy.contains("label", "Negative (-)").click(); + }); + + cy.contains("legend", "Is the patient pregnant?") + .next("div") + .within(() => { + cy.contains("label", "No").click(); + }); + + cy.contains("legend", "Is the patient currently experiencing any symptoms?") + .next("div") + .within(() => { + cy.contains("label", "No").click(); + }); + + cy.contains("Submit results").click(); + cy.wait("@SubmitQueueItem"); + }); +}); diff --git a/cypress/e2e/04b-covid_only_test_alternate_flows.cy.js b/cypress/e2e/04b-covid_only_test_alternate_flows.cy.js deleted file mode 100644 index 9e7416aea5..0000000000 --- a/cypress/e2e/04b-covid_only_test_alternate_flows.cy.js +++ /dev/null @@ -1,198 +0,0 @@ -import { generatePatient, loginHooks, testNumber } from "../support/e2e"; -import { graphqlURL } from "../utils/request-utils"; -import { aliasGraphqlOperations } from "../utils/graphql-test-utils"; - -loginHooks(); - -describe("Save and start covid test", () => { - let patientName, lastName, phoneNumber, covidOnlyDeviceName; - before("retrieve the patient info", () => { - cy.task("getPatientName").then((name) => { - patientName = name; - lastName = patientName.split(",")[0]; - }); - cy.task("getPatientPhone").then((phone) => { - phoneNumber = phone; - }); - cy.task("getCovidOnlyDeviceName").then((name) => { - covidOnlyDeviceName = name; - }); - }); - - beforeEach(() => { - cy.intercept("POST", graphqlURL, (req) => { - aliasGraphqlOperations(req); - }); - }); - - context("edit patient and save and start test", () => { - it("searches for the patient", () => { - cy.visit("/"); - cy.get('[data-cy="desktop-patient-nav-link"]').click(); - cy.get('[data-cy="manage-patients-header"]').contains("Patients"); - cy.get('[data-cy="manage-patients-header"]').contains("Showing"); - cy.get('[data-cy="manage-patients-search-input"]').type(lastName); - cy.wait("@GetPatientsByFacility"); - cy.get('[data-cy="manage-patients-page"]').contains(patientName); - }); - - it("edits the found patient and clicks save and start test ", () => { - cy.get(".sr-patient-list").contains(patientName).click(); - cy.contains("General information").should("exist"); - // a11y scan of edit patient page - cy.injectSRAxe(); - cy.checkAccessibility(); - cy.get('input[name="middleName"]').clear(); - cy.get('input[name="middleName"]').type(testNumber().toString(10)); - cy.get(".prime-save-patient-changes-start-test").click(); - }); - - it("completes and verifies AoE form and verifies queue", () => { - cy.contains("Test questionnaire"); - - cy.get(".ReactModal__Content").contains( - "Are you experiencing any of the following symptoms?", - ); - // patient created in 02-add-patient_spec.js has phone number but no email defined - cy.contains("Yes, text all mobile numbers on file").click(); - cy.contains("Results will be sent to these numbers:"); - cy.contains(phoneNumber); - cy.get('input[name="testResultDeliveryEmail"][value="EMAIL"]').should( - "be.disabled", - ); - cy.contains( - "(There are no email addresses listed in your patient profile.)", - ); - - cy.contains("New loss of taste").should("exist").click(); - - // Test a11y on the AoE form - cy.checkAccessibility(); - - cy.contains("button", "Continue").click(); - cy.get(".prime-home").contains(patientName); - cy.url().should("include", "queue"); - - cy.wait("@GetFacilityQueue", { timeout: 20000 }); - - // Test a11y on the Test Queue page - cy.checkAccessibility(); - }); - }); - - context("add patient and save and start test", () => { - const patient = generatePatient(); - patient.email = "myemail@test.com"; - - it("navigates to the add patient form", () => { - cy.visit("/"); - cy.get(".usa-nav-container"); - cy.get("#desktop-patient-nav-link").click(); - cy.get("#add-patient").click(); - cy.get("#individual_add-patient").click(); - cy.get(".prime-edit-patient").contains("Add new patient"); - - cy.injectSRAxe(); - cy.checkAccessibility(); // New Patient page - }); - - it("fills out form fields and clicks save and start test and verifies AoE form is correctly filled in", () => { - cy.get('input[name="firstName"]').type(patient.firstName); - cy.get('input[name="lastName"]').type(patient.lastName); - cy.get('select[name="facilityId"]').select("All facilities"); - cy.get('input[name="birthDate"]').type(patient.dobForInput); - cy.get('input[name="number"]').type(patient.phone); - cy.get('input[value="LANDLINE"]+label').click(); - cy.get('input[name="email-0"]').type(patient.email); - cy.get('input[name="street"]').type(patient.address); - cy.get('input[name="city"]').type(patient.city); - cy.get('select[name="state"]').select(patient.state); - cy.get('input[name="zipCode"]').type(patient.zip); - cy.get('input[name="race"][value="other"]+label').click(); - cy.get('input[name="ethnicity"][value="refused"]+label').click(); - cy.get('input[name="gender"][value="male"]+label').click(); - cy.get(".prime-save-patient-changes-start-test").first().click(); - cy.get( - '.modal__container input[name="addressSelect-person"][value="userAddress"]+label', - ).click(); - - cy.checkAccessibility(); - - cy.get(".modal__container #save-confirmed-address").click(); - cy.url().should("include", "queue"); - - cy.wait("@GetFacilityQueue", { timeout: 20000 }); - - cy.get('input[name="testResultDeliverySms"][value="SMS"]').should( - "be.disabled", - ); - cy.contains( - "(There are no mobile phone numbers listed in your patient profile.)", - ); - cy.contains( - "fieldset", - "Would you like to receive a copy of your results via email?", - ).within(() => { - cy.get('input[name="testResultDeliveryEmail"][value="EMAIL"]').should( - "not.be.disabled", - ); - cy.contains("Yes").click(); - cy.contains("Results will be sent to these email addresses:"); - cy.contains(patient.email); - }); - }); - it("completes AoE form and verifies queue", () => { - cy.contains("New loss of taste").click(); - cy.contains("button", "Continue").click(); - cy.get(".prime-home").contains(patient.firstName); - cy.url().should("include", "queue"); - cy.wait("@GetFacilityQueue", { timeout: 20000 }); - }); - }); - - context("edit patient from test queue", () => { - it("navigates to test queue and edits patient", () => { - cy.visit("/"); - cy.get(".usa-nav-container"); - cy.get("#desktop-conduct-test-nav-link").click(); - - cy.wait("@GetFacilityQueue", { timeout: 20000 }); - - cy.get(".card-name").contains(patientName).click(); - cy.get('input[name="middleName"]').clear(); - cy.get('input[name="middleName"]').type(testNumber().toString(10)); - }); - it("clicks save changes and verifies test queue redirect", () => { - cy.get(".prime-save-patient-changes").first().click(); - cy.wait("@UpdatePatient"); - }); - it("verifies test card highlighted", () => { - cy.wait("@GetFacilityQueue", { timeout: 20000 }); - cy.get(".ReactModal__Content").should("not.exist"); - cy.url().should("include", "queue"); - cy.get(".prime-queue-item__info").contains(patientName); - }); - }); - - context("start test from patients page for patient already in queue", () => { - it("navigates to patients page, selects Start test, and verifies link to test queue", () => { - cy.visit("/"); - cy.get(".usa-nav-container"); - cy.get("#desktop-patient-nav-link").click(); - - cy.wait("@GetPatientsByFacility"); - - cy.get(".sr-patient-list").contains("Loading...").should("not.exist"); - cy.get("#search-field-small").type(lastName); - cy.contains("tr", patientName).find(".sr-actions-menu").click(); - cy.contains("Start test").click(); - cy.wait("@GetFacilityQueue", { timeout: 20000 }); - }); - - it("verifies test card highlighted", () => { - cy.get(".ReactModal__Content").should("not.exist"); - cy.url().should("include", "queue"); - cy.get(".prime-queue-item__info").contains(patientName); - }); - }); -}); diff --git a/cypress/e2e/09-multiplex_testing.cy.js b/cypress/e2e/09-multiplex_testing.cy.js index c704dd3c47..2be1b06b05 100644 --- a/cypress/e2e/09-multiplex_testing.cy.js +++ b/cypress/e2e/09-multiplex_testing.cy.js @@ -56,7 +56,6 @@ describe("Testing with multiplex devices", () => { ); cy.wait("@GetPatientsByFacilityForQueue"); cy.contains("Begin test").click(); - cy.get('button[id="aoe-form-save-button"]').click(); cy.get(".Toastify").contains(`${patient.lastName}, ${patient.firstName}`); cy.get(".Toastify").contains(`was added to the queue`); @@ -64,7 +63,7 @@ describe("Testing with multiplex devices", () => { cy.injectSRAxe(); cy.checkAccessibility(); - const queueCard = `div[data-testid="test-card-${patient.internalId}"]`; + const queueCard = `li[data-testid="test-card-${patient.internalId}"]`; cy.get(queueCard).within(() => { cy.get('select[name="testDevice"]').select(multiplexDeviceName); cy.get('select[name="testDevice"]') @@ -77,25 +76,25 @@ describe("Testing with multiplex devices", () => { // then it won't trigger a network call cy.wait("@GetFacilityQueue", { timeout: 20000 }); + cy.contains("Submit results").click(); + cy.contains("Please enter a valid test result"); + cy.contains("Invalid test results"); + + cy.contains("legend", "Flu A result") + .next("div") + .within(() => { + cy.contains("label", "Inconclusive").click(); + }); + cy.get(queueCard).within(() => { - cy.get('button[type="submit"]').as("submitBtn"); - cy.get("@submitBtn").should("be.disabled"); - cy.get(".multiplex-result-form").contains("COVID-19"); - cy.get(".multiplex-result-form").contains("Flu A"); - cy.get(".multiplex-result-form").contains("Flu B"); - cy.get(".multiplex-result-form").contains("Mark test as inconclusive"); - cy.get('input[name="inconclusive-tests"]') - .should("not.be.checked") - .should("be.enabled") - .siblings("label") - .click(); + cy.contains("Please enter a valid test result").should("not.exist"); }); + cy.wait("@EditQueueItem"); - cy.get(queueCard).within(() => { - cy.get("@submitBtn").should("be.enabled").click(); - }); + cy.contains("Submit results").click(); cy.contains("Submit anyway").click(); + cy.wait("@SubmitQueueItem"); cy.wait("@GetFacilityQueue", { timeout: 20000 }); }); diff --git a/frontend/src/app/testQueue/TestCard/TestCard.tsx b/frontend/src/app/testQueue/TestCard/TestCard.tsx index 3d9600e987..f36fc840b3 100644 --- a/frontend/src/app/testQueue/TestCard/TestCard.tsx +++ b/frontend/src/app/testQueue/TestCard/TestCard.tsx @@ -87,6 +87,7 @@ export const TestCard = ({