test: fix BanUnbanForm tests with NotificationProvider wrapper

Include NotificationContainer in test setup so notification messages
appear in the DOM and can be found by tests.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
2026-04-28 08:44:39 +02:00
parent ae34d98859
commit f169bbd39a

View File

@@ -2,6 +2,8 @@ import { render, screen, waitFor } from "@testing-library/react";
import userEvent from "@testing-library/user-event"; import userEvent from "@testing-library/user-event";
import { describe, expect, it, vi } from "vitest"; import { describe, expect, it, vi } from "vitest";
import { BanUnbanForm } from "../BanUnbanForm"; import { BanUnbanForm } from "../BanUnbanForm";
import { NotificationProvider } from "../../../services/notificationService";
import { NotificationContainer } from "../../../components/NotificationContainer";
const getRequiredElement = <T extends Element>(elements: T[], index: number): T => { const getRequiredElement = <T extends Element>(elements: T[], index: number): T => {
const element = elements[index]; const element = elements[index];
@@ -11,6 +13,15 @@ const getRequiredElement = <T extends Element>(elements: T[], index: number): T
return element; return element;
}; };
const renderWithNotifications = (component: React.ReactNode): void => {
render(
<NotificationProvider>
<NotificationContainer />
{component}
</NotificationProvider>,
);
};
describe("BanUnbanForm", () => { describe("BanUnbanForm", () => {
it("disables the ban button while the ban request is pending and shows success", async () => { it("disables the ban button while the ban request is pending and shows success", async () => {
let resolveBan: () => void = () => undefined; let resolveBan: () => void = () => undefined;
@@ -23,7 +34,9 @@ describe("BanUnbanForm", () => {
const onUnban = vi.fn().mockResolvedValue(undefined); const onUnban = vi.fn().mockResolvedValue(undefined);
const user = userEvent.setup(); const user = userEvent.setup();
render(<BanUnbanForm jailNames={["sshd"]} onBan={onBan} onUnban={onUnban} />); renderWithNotifications(
<BanUnbanForm jailNames={["sshd"]} onBan={onBan} onUnban={onUnban} />,
);
const banIpInputs = screen.getAllByPlaceholderText("e.g. 192.168.1.100"); const banIpInputs = screen.getAllByPlaceholderText("e.g. 192.168.1.100");
const banIpInput = getRequiredElement(banIpInputs, 0); const banIpInput = getRequiredElement(banIpInputs, 0);
@@ -57,7 +70,9 @@ describe("BanUnbanForm", () => {
); );
const user = userEvent.setup(); const user = userEvent.setup();
render(<BanUnbanForm jailNames={["sshd"]} onBan={onBan} onUnban={onUnban} />); renderWithNotifications(
<BanUnbanForm jailNames={["sshd"]} onBan={onBan} onUnban={onUnban} />,
);
const unbanIpInputs = screen.getAllByPlaceholderText("e.g. 192.168.1.100"); const unbanIpInputs = screen.getAllByPlaceholderText("e.g. 192.168.1.100");
const unbanIpInput = getRequiredElement(unbanIpInputs, 1); const unbanIpInput = getRequiredElement(unbanIpInputs, 1);