test(jest): unit tests for modal

cardano-foundation · Jul 15, 2024 · 1013fff · 1013fff
1 parent 3855f92
commit 1013fff
Show file tree

Hide file tree

Showing 3 changed files with 57 additions and 22 deletions.
diff --git a/src/ui/components/IdentifierOptions/IdentifierOptions.test.tsx b/src/ui/components/IdentifierOptions/IdentifierOptions.test.tsx
@@ -69,10 +69,33 @@ describe("Identifier Options modal", () => {
     );
     await waitForIonicReact();
 
-    expect(getByTestId("view-json-identifier-options")).toBeVisible();
-    expect(getByTestId("edit-identifier-options")).toBeVisible();
-    expect(getByTestId("share-identifier-options")).toBeVisible();
-    expect(getByTestId("delete-identifier-options")).toBeVisible();
+    expect(getByTestId("view-json-identifier-option")).toBeVisible();
+    expect(getByTestId("edit-identifier-option")).toBeVisible();
+    expect(getByTestId("rotate-keys-option")).toBeVisible();
+    expect(getByTestId("share-identifier-option")).toBeVisible();
+    expect(getByTestId("delete-identifier-option")).toBeVisible();
+  });
+
+  test("should not display the rotate-keys-option inside the modal", async () => {
+    const setIdentifierOptionsIsOpen = jest.fn();
+    const setCardData = jest.fn();
+    const { queryByTestId } = render(
+      <Provider store={mockedStore}>
+        <IdentifierOptions
+          handleRotateKey={jest.fn()}
+          optionsIsOpen={true}
+          setOptionsIsOpen={setIdentifierOptionsIsOpen}
+          cardData={identifierFix[2]}
+          setCardData={setCardData}
+          handleDeleteIdentifier={async () => {
+            jest.fn();
+          }}
+        />
+      </Provider>
+    );
+    await waitForIonicReact();
+
+    await waitFor(() => expect(queryByTestId("rotate-keys-option")).toBe(null));
   });
 });
 
@@ -109,7 +132,7 @@ describe("Identifier Options function test", () => {
   test("Display JSON view", async () => {
     const setIdentifierOptionsIsOpen = jest.fn();
     const setCardData = jest.fn();
-    const { getByTestId, getByText } = render(
+    const { getByTestId } = render(
       <Provider store={mockedStore}>
         <IdentifierOptions
           handleRotateKey={jest.fn()}
@@ -125,10 +148,10 @@ describe("Identifier Options function test", () => {
     );
     await waitForIonicReact();
 
-    expect(getByTestId("view-json-identifier-options")).toBeVisible();
+    expect(getByTestId("view-json-identifier-option")).toBeVisible();
 
     act(() => {
-      fireEvent.click(getByTestId("view-json-identifier-options"));
+      fireEvent.click(getByTestId("view-json-identifier-option"));
     });
 
     await waitFor(() => {
@@ -170,10 +193,10 @@ describe("Identifier Options function test", () => {
     );
     await waitForIonicReact();
 
-    expect(getByTestId("edit-identifier-options")).toBeVisible();
+    expect(getByTestId("edit-identifier-option")).toBeVisible();
 
     act(() => {
-      fireEvent.click(getByTestId("edit-identifier-options"));
+      fireEvent.click(getByTestId("edit-identifier-option"));
     });
 
     await waitFor(() => {
@@ -208,7 +231,7 @@ describe("Identifier Options function test", () => {
     const setIdentifierOptionsIsOpen = jest.fn();
     const setCardData = jest.fn();
     const mockDelete = jest.fn();
-    const { getByTestId, getAllByText } = render(
+    const { getByTestId } = render(
       <Provider store={mockedStore}>
         <IdentifierOptions
           handleRotateKey={jest.fn()}
@@ -222,10 +245,10 @@ describe("Identifier Options function test", () => {
     );
     await waitForIonicReact();
 
-    expect(getByTestId("delete-identifier-options")).toBeVisible();
+    expect(getByTestId("delete-identifier-option")).toBeVisible();
 
     act(() => {
-      fireEvent.click(getByTestId("delete-identifier-options"));
+      fireEvent.click(getByTestId("delete-identifier-option"));
     });
 
     await waitFor(() => {

diff --git a/src/ui/components/IdentifierOptions/IdentifierOptions.tsx b/src/ui/components/IdentifierOptions/IdentifierOptions.tsx
@@ -30,7 +30,6 @@ import { OptionItem, OptionModal } from "../OptionsModal";
 import "./IdentifierOptions.scss";
 import { IdentifierOptionsProps } from "./IdentifierOptions.types";
 import { IdentifierJsonModal } from "./components";
-import { RotateKeyModal } from "../../pages/IdentifierDetails/components/RotateKeyModal/RotateKeyModal";
 
 const IdentifierOptions = ({
   optionsIsOpen,
@@ -47,6 +46,15 @@ const IdentifierOptions = ({
   const [newSelectedTheme, setNewSelectedTheme] = useState(cardData.theme);
   const [viewIsOpen, setViewIsOpen] = useState(false);
   const [keyboardIsOpen, setkeyboardIsOpen] = useState(false);
+  const identifiersData = useAppSelector(getIdentifiersCache);
+  const [isMultiSig, setIsMultiSig] = useState(false);
+
+  useEffect(() => {
+    const identifier = identifiersData.find((data) => data.id === cardData.id);
+    if (identifier && identifier.multisigManageAid) {
+      setIsMultiSig(true);
+    }
+  }, [identifiersData, cardData.id]);
 
   const verifyDisplayName =
     newDisplayName.length > 0 &&
@@ -148,39 +156,43 @@ const IdentifierOptions = ({
     dispatch(setCurrentOperation(OperationType.IDLE));
   };
 
-  const options: OptionItem[] = [
+  const optionsRotate: OptionItem[] = [
     {
       icon: codeSlashOutline,
       label: i18n.t("identifiers.details.options.view"),
       onClick: viewJson,
-      testId: "view-json-identifier-options",
+      testId: "view-json-identifier-option",
     },
     {
       icon: pencilOutline,
       label: i18n.t("identifiers.details.options.edit"),
       onClick: updateIdentifier,
-      testId: "edit-identifier-options",
+      testId: "edit-identifier-option",
     },
     {
       icon: refreshOutline,
       label: i18n.t("identifiers.details.options.rotatekeys"),
       onClick: rotateKey,
-      testId: "rotate-keys",
+      testId: "rotate-keys-option",
     },
     {
       icon: shareOutline,
       label: i18n.t("identifiers.details.options.share"),
       onClick: share,
-      testId: "share-identifier-options",
+      testId: "share-identifier-option",
     },
     {
       icon: trashOutline,
       label: i18n.t("identifiers.details.options.delete"),
       onClick: deleteIdentifier,
-      testId: "delete-identifier-options",
+      testId: "delete-identifier-option",
     },
   ];
 
+  const optionsNoRotate = optionsRotate.filter(
+    (option) => option.testId !== "rotate-keys-option"
+  );
+
   return (
     <>
       <OptionModal
@@ -190,7 +202,7 @@ const IdentifierOptions = ({
         header={{
           title: `${i18n.t("identifiers.details.options.title")}`,
         }}
-        items={options}
+        items={isMultiSig ? optionsNoRotate : optionsRotate}
       />
       <OptionModal
         modalIsOpen={editorOptionsIsOpen}

diff --git a/src/ui/pages/IdentifierDetails/IdentifierDetails.test.tsx b/src/ui/pages/IdentifierDetails/IdentifierDetails.test.tsx
@@ -191,7 +191,7 @@ describe("Cards Details page (not multi-sig)", () => {
     });
 
     await waitFor(() => {
-      expect(getByTestId("edit-identifier-options")).toBeInTheDocument();
+      expect(getByTestId("edit-identifier-option")).toBeInTheDocument();
     });
   });
 
@@ -261,7 +261,7 @@ describe("Cards Details page (not multi-sig)", () => {
     });
 
     await waitFor(() => {
-      expect(getByTestId("delete-identifier-options")).toBeInTheDocument();
+      expect(getByTestId("delete-identifier-option")).toBeInTheDocument();
     });
 
     act(() => {