milestone 23 s2: react aria primitives and their cluster

web/src/features/blocklists/BlocklistsPage.test.tsx

@@ -41,14 +41,20 @@ const RESPONSES: Record<string, unknown> = {
 };
 
 let resolveUpdate: ((response: Response) => void) | null;
+let deleted: string[];
 
 beforeEach(() => {
 	clearRefreshStatus();
 	resolveUpdate = null;
+	deleted = [];
 	vi.stubGlobal(
 		"fetch",
 		vi.fn(async (input: RequestInfo | URL, init?: RequestInit) => {
 			const url = String(input);
+			if (init?.method === "DELETE") {
+				deleted.push(url);
+				return new Response(null, { status: 204 });
+			}
 			if (url === "/api/blocklists/update" && init?.method === "POST") {
 				return new Promise<Response>((resolve) => {
 					resolveUpdate = resolve;
@@ -227,3 +233,27 @@ test("the refresh snapshot outlives the query cache's gcTime", async () => {
 		vi.useRealTimers();
 	}
 });
+
+test("delete asks for confirmation, and cancelling sends no request", async () => {
+	renderBlocklistsRoute();
+	await screen.findByRole("heading", { name: "Blocklists" });
+
+	fireEvent.click(screen.getAllByRole("button", { name: "Delete" })[0]!);
+	const dialog = await screen.findByRole("alertdialog");
+	expect(dialog.textContent).toContain('Delete blocklist "StevenBlack"? Its domains stop being blocked.');
+
+	fireEvent.click(screen.getByRole("button", { name: "Cancel" }));
+	await waitFor(() => expect(screen.queryByRole("alertdialog")).toBeNull());
+	expect(deleted).toEqual([]);
+});
+
+test("confirming the delete dialog issues the DELETE for that source", async () => {
+	renderBlocklistsRoute();
+	await screen.findByRole("heading", { name: "Blocklists" });
+
+	fireEvent.click(screen.getAllByRole("button", { name: "Delete" })[1]!);
+	await screen.findByRole("alertdialog");
+	fireEvent.click(screen.getByRole("button", { name: "Delete" }));
+
+	await waitFor(() => expect(deleted).toEqual(["/api/blocklists/2"]));
+});