Add test for CertificateDeleteDialog component

src/components/certificate-delete-dialog/CertificateDeleteDialog.test.tsx

@@ -0,0 +1,52 @@
+import { render, userEvent } from "@testing";
+import { CertificateDeleteDialog } from "./CertificateDeleteDialog";
+
+describe("<CertificateDeleteDialog />", () => {
+  const certificateName = "Certificate Name";
+  const certificateId = "1";
+
+  it("Should render and handle buttons click", async () => {
+    const handleClose = vi.fn();
+    const handleDelete = vi.fn((data) => data);
+
+    const { getAllByRole, getByText } = render(
+      <CertificateDeleteDialog
+        certificateName={certificateName}
+        certificateId={certificateId}
+        onDialogClose={handleClose}
+        onDeleteClick={handleDelete}
+      />
+    );
+
+    expect(
+      getByText(`Are you sure you want to delete “${certificateName}”?`)
+    ).toBeInTheDocument();
+
+    const buttons = getAllByRole("button");
+
+    // Cancel button
+    await userEvent.click(buttons[0]);
+
+    expect(handleClose).toBeCalledTimes(1);
+
+    // Delete button
+    await userEvent.click(buttons[1]);
+
+    expect(handleDelete).toBeCalledTimes(1);
+    expect(handleDelete).toBeCalledWith(certificateId);
+  });
+
+  it("Should render loading", async () => {
+    const { getByText } = render(
+      <CertificateDeleteDialog
+        certificateName={certificateName}
+        certificateId={certificateId}
+        onDialogClose={vi.fn()}
+        onDeleteClick={vi.fn()}
+        loading={true}
+      />
+    );
+
+    expect(getByText(/Deleting certificate/)).toBeInTheDocument();
+  });
+});