From ea79cbb3189e57d3852a02a5bf35ed1dff938de1 Mon Sep 17 00:00:00 2001 From: mcmcphillips Date: Thu, 24 Oct 2024 09:04:03 -0700 Subject: [PATCH 1/2] MAT-7332: Fix edge cases, remove alert --- .../editTestCase/qiCore/EditTestCase.test.tsx | 30 ++++--- .../editTestCase/qiCore/EditTestCase.tsx | 79 ++++++++----------- 2 files changed, 55 insertions(+), 54 deletions(-) diff --git a/src/components/editTestCase/qiCore/EditTestCase.test.tsx b/src/components/editTestCase/qiCore/EditTestCase.test.tsx index f9d9311ce..8b37d9bf1 100644 --- a/src/components/editTestCase/qiCore/EditTestCase.test.tsx +++ b/src/components/editTestCase/qiCore/EditTestCase.test.tsx @@ -750,7 +750,7 @@ describe("EditTestCase component", () => { const createBtn = screen.getByRole("button", { name: "Save" }); userEvent.click(createBtn); - const alert = await screen.findByTestId("create-test-case-alert"); + const alert = await screen.findByTestId("error-toast"); expect(alert).toBeInTheDocument(); expect(alert).toHaveTextContent( "An error occurred while creating the test case." @@ -784,11 +784,20 @@ describe("EditTestCase component", () => { const createBtn = screen.getByRole("button", { name: "Save" }); userEvent.click(createBtn); - const alert = await screen.findByTestId("create-test-case-alert"); - expect(alert).toBeInTheDocument(); + const alert = await screen.findByTestId("error-toast"); expect(alert).toHaveTextContent( "An error occurred - create did not return the expected successful result." ); + + const closeAlertBtn = screen.findByTestId("close-toast-button"); + userEvent.click(await closeAlertBtn); + await waitFor(() => { + expect( + screen.queryByText( + "An error occurred - create did not return the expected successful result." + ) + ).not.toBeInTheDocument(); + }); }); it("should update test case when update button is clicked", async () => { @@ -945,16 +954,18 @@ describe("EditTestCase component", () => { const createBtn = screen.getByRole("button", { name: "Save" }); userEvent.click(createBtn); - const alert = await screen.findByTestId("create-test-case-alert"); + const alert = await screen.findByTestId("error-toast"); expect(alert).toHaveTextContent( "An error occurred while creating the test case." ); - const closeAlertBtn = screen.findByTestId("close-create-test-case-alert"); + const closeAlertBtn = screen.findByTestId("close-toast-button"); userEvent.click(await closeAlertBtn); - - const dismissedAlert = await screen.queryByRole("alert"); - expect(dismissedAlert).not.toBeInTheDocument(); + await waitFor(() => { + expect( + screen.queryByText("An error occurred while creating the test case.") + ).not.toBeInTheDocument(); + }); }); it("should load existing test case data when viewing specific test case", async () => { @@ -1933,7 +1944,6 @@ describe("EditTestCase component", () => { userEvent.type(seriesInput, testCaseDescription); const updateBtn = screen.getByRole("button", { name: "Save" }); userEvent.click(updateBtn); - const debugOutput = await screen.findByText( testCaseAlertToast ? "Changes updated successfully but the following error(s) were found" @@ -2404,7 +2414,7 @@ describe("EditTestCase component", () => { await waitFor(() => expect(saveButton).not.toBeDisabled()); userEvent.click(saveButton); - const alert = await screen.findByTestId("create-test-case-alert"); + const alert = await screen.findByTestId("error-toast"); expect(alert).toBeInTheDocument(); }); diff --git a/src/components/editTestCase/qiCore/EditTestCase.tsx b/src/components/editTestCase/qiCore/EditTestCase.tsx index e3153a183..8ff6e4305 100644 --- a/src/components/editTestCase/qiCore/EditTestCase.tsx +++ b/src/components/editTestCase/qiCore/EditTestCase.tsx @@ -1,4 +1,5 @@ import React, { + ReactNode, Dispatch, SetStateAction, useCallback, @@ -220,7 +221,7 @@ const EditTestCase = (props: EditTestCaseProps) => { // Toast utilities const [toastOpen, setToastOpen] = useState(false); - const [toastMessage, setToastMessage] = useState(""); + const [toastMessage, setToastMessage] = useState(""); const [toastType, setToastType] = useState("danger"); const onToastClose = () => { setToastMessage(""); @@ -228,8 +229,8 @@ const EditTestCase = (props: EditTestCaseProps) => { }; const showToast = ( - message: string, - toastType: "success" | "danger" | "warning" + message: ReactNode, + toastType: "success" | "danger" | "warning" | "info" ) => { setToastOpen(true); setToastType(toastType); @@ -414,10 +415,7 @@ const EditTestCase = (props: EditTestCaseProps) => { setSeriesState({ loaded: true, series: existingSeries }) ) .catch((error) => { - setAlert(() => ({ - status: "error", - message: error.message, - })); + showToast(error.message, "danger"); setErrors([...errors, error.message]); }); } @@ -471,10 +469,7 @@ const EditTestCase = (props: EditTestCaseProps) => { handleTestCaseResponse(savedTestCase, "create"); } catch (error) { - setAlert(() => ({ - status: "error", - message: "An error occurred while creating the test case.", - })); + showToast("An error occurred while creating the test case.", "danger"); setErrors([...errors, "An error occurred while creating the test case."]); } }; @@ -502,21 +497,14 @@ const EditTestCase = (props: EditTestCaseProps) => { }); setTestCase(_.cloneDeep(updatedTc)); setEditorVal(updatedTc.json); - handleTestCaseResponse(updatedTc, "update"); } catch (error) { - setAlert(() => { - if (error instanceof MadieError) { - return { - status: "error", - message: error.message, - }; - } - return { - status: "error", - message: "An error occurred while updating the test case.", - }; - }); + showToast( + error instanceof MadieError + ? error.message + : "An error occurred while updating the test case.", + "danger" + ); setErrors([...errors, "An error occurred while updating the test case."]); } }; @@ -614,30 +602,33 @@ const EditTestCase = (props: EditTestCaseProps) => { const valErrors = validationErrors.map((error) => (
  • {error.diagnostics}
    • )); - setAlert({ - status: `${severityOfValidationErrors(validationErrors)}`, - message: testCaseAlertToast ? ( -
    -

    - Changes {action}d successfully but the following{" "} - {severityOfValidationErrors(validationErrors)}(s) were found -

    -
      {valErrors}
    -
    - ) : ( - `Test case updated successfully with ${severityOfValidationErrors( - validationErrors - )}s in JSON` - ), - }); + const message: ReactNode = testCaseAlertToast ? ( +
    +

    + Changes {action}d successfully but the following{" "} + {severityOfValidationErrors(validationErrors)}(s) were found +

    +
      {valErrors}
    +
    + ) : ( + `Test case updated successfully with ${severityOfValidationErrors( + validationErrors + )}s in JSON` + ); + let severity = severityOfValidationErrors(validationErrors); + if (severity === "error") { + severity = "danger"; + } + //@ts-ignore + showToast(message, severity); handleHapiOutcome(testCase.hapiOperationOutcome); } updateMeasureStore(action, testCase); } else { - setAlert(() => ({ - status: "error", - message: `An error occurred - ${action} did not return the expected successful result.`, - })); + showToast( + `An error occurred - ${action} did not return the expected successful result.`, + "danger" + ); setErrors([ ...errors, `An error occurred - ${action} did not return the expected successful result.`, From af8660d1e489a70ea5281309de2e0eea76b072c5 Mon Sep 17 00:00:00 2001 From: adongare Date: Mon, 28 Oct 2024 14:38:19 -0400 Subject: [PATCH 2/2] MAT-7854 Quantity value should be a number --- .../common/quantityInput/QuantityInput.test.tsx | 8 ++++---- src/components/common/quantityInput/QuantityInput.tsx | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/components/common/quantityInput/QuantityInput.test.tsx b/src/components/common/quantityInput/QuantityInput.test.tsx index ea9f2eceb..870745ffc 100644 --- a/src/components/common/quantityInput/QuantityInput.test.tsx +++ b/src/components/common/quantityInput/QuantityInput.test.tsx @@ -142,14 +142,14 @@ describe("QuantityInput Component", () => { expect(quantityFieldInput.value).toBe(""); expect(onQuantityChange).toBeCalled(); userEvent.type(quantityFieldInput, "-1-"); - await expect(onQuantityChange).toHaveBeenNthCalledWith(2, { + expect(onQuantityChange).toHaveBeenNthCalledWith(2, { unit: "mg", - value: "-1", + value: -1, }); userEvent.type(quantityFieldInput, "2.5/...-"); - await expect(onQuantityChange).toHaveBeenNthCalledWith(6, { + expect(onQuantityChange).toHaveBeenNthCalledWith(6, { unit: "mg", - value: "2.5", + value: 2.5, }); }); }); diff --git a/src/components/common/quantityInput/QuantityInput.tsx b/src/components/common/quantityInput/QuantityInput.tsx index a15467beb..3e1809545 100644 --- a/src/components/common/quantityInput/QuantityInput.tsx +++ b/src/components/common/quantityInput/QuantityInput.tsx @@ -105,7 +105,7 @@ const QuantityInput = ({ const handleQuantityValueChange = (newValue) => { const newQuantity: CQL.Quantity = { - value: newValue, + value: Number(newValue), unit: currentQuantity.unit, }; setCurrentQuantity(newQuantity);