From c2d27d2b3f254b323d418c2eec13391673465816 Mon Sep 17 00:00:00 2001 From: Molecule AI Core-BE Date: Mon, 11 May 2026 11:35:13 +0000 Subject: [PATCH] fix(canvas/test): ApprovalBanner mockReset to prevent queue stacking Cherry-picked from PR #452 (fix/canvas-test-and-design-fixes) which was closed without merge during the PR #443 cascade. The fix adds a mockPost reference so individual tests can reset the POST mock cleanly instead of queueing multiple resolved/rejected values. Without this, the "shows an error toast when POST fails" and "keeps the card visible when POST fails" tests queue two responses from beforeEach's mockResolvedValue({}) and the second mockRejectedValueOnce() call, causing non-deterministic test outcomes. Fixes test failures in ApprovalBanner suite. --- .../components/__tests__/ApprovalBanner.test.tsx | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/canvas/src/components/__tests__/ApprovalBanner.test.tsx b/canvas/src/components/__tests__/ApprovalBanner.test.tsx index 09817ef9..2a3fc758 100644 --- a/canvas/src/components/__tests__/ApprovalBanner.test.tsx +++ b/canvas/src/components/__tests__/ApprovalBanner.test.tsx @@ -41,9 +41,10 @@ const pendingApproval = (id = "a1", workspaceId = "ws-1"): { created_at: "2026-05-10T10:00:00Z", }); -// Shared spy reference so individual tests can call mockGet.mockRestore() -// without needing to pass it through beforeEach → it scope chain. +// Shared spy references so individual tests can reset or reject the POST mock +// without needing to call spyOn again (which would create a duplicate spy). let mockGet: ReturnType; +let mockPost: ReturnType; // ─── Tests ──────────────────────────────────────────────────────────────────── @@ -139,8 +140,8 @@ describe("ApprovalBanner — renders approval cards", () => { describe("ApprovalBanner — decisions", () => { beforeEach(() => { vi.useFakeTimers(); - vi.spyOn(api, "get").mockResolvedValueOnce([pendingApproval("a1")]); - vi.spyOn(api, "post").mockResolvedValue({}); + mockGet = vi.spyOn(api, "get").mockResolvedValueOnce([pendingApproval("a1")]); + mockPost = vi.spyOn(api, "post").mockResolvedValue({}); }); afterEach(() => { @@ -196,7 +197,7 @@ describe("ApprovalBanner — decisions", () => { }); it("shows an error toast when POST fails", async () => { - vi.mocked(api.post).mockRejectedValueOnce(new Error("Network error")); + mockPost.mockReset().mockRejectedValue(new Error("Network error")); render(); await act(async () => { await vi.runOnlyPendingTimersAsync(); }); fireEvent.click(screen.getAllByRole("button", { name: /approve/i })[0]); @@ -208,8 +209,9 @@ describe("ApprovalBanner — decisions", () => { }); it("keeps the card visible when the POST fails", async () => { - // Use mockRejectedValueOnce on the same spy as beforeEach (don't call spyOn again) - vi.mocked(api.post).mockRejectedValueOnce(new Error("Network error")); + // Reset the post mock before rejecting so the beforeEach's resolved value + // is gone and we get a clean rejection instead of a resolved→rejected queue. + mockPost.mockReset().mockRejectedValue(new Error("Network error")); render(); await act(async () => { await vi.runOnlyPendingTimersAsync(); }); fireEvent.click(screen.getAllByRole("button", { name: /approve/i })[0]);