Stabilise flaky QR code rendering tests (#33593)

* Stabilise QR code rendering tests * Extract QR mocking code to test-utils
2026-05-25 07:10:10 +00:00
parent 1ffbe66d72
commit 40fbe1fae1
4 changed files with 65 additions and 7 deletions
@@ -0,0 +1,44 @@
+/*
+Copyright 2026 New Vector Ltd.
+
+SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
+Please see LICENSE files in the repository root for full details.
+*/
+
+import { act } from "jest-matrix-react";
+import { toDataURL, type QRCodeSegment, type QRCodeToDataURLOptions } from "qrcode";
+
+jest.mock("qrcode", () => ({
+    ...jest.requireActual("qrcode"),
+    toDataURL: jest.fn(),
+}));
+
+const realQRCode = jest.requireActual("qrcode") as { toDataURL: typeof toDataURL };
+const mockedToDataURL = jest.mocked(toDataURL);
+
+let qrCodeRenderPromise: Promise<string> | undefined;
+
+export function mockQRCodeRender(): void {
+    // Keep real PNG generation, but capture the promise so the test can await it directly.
+    mockedToDataURL.mockImplementation(((data: string | QRCodeSegment[], options?: QRCodeToDataURLOptions) => {
+        qrCodeRenderPromise = realQRCode.toDataURL(data, options);
+        return qrCodeRenderPromise;
+    }) as typeof toDataURL);
+}
+
+export async function waitForQRCodeRender(): Promise<void> {
+    if (!qrCodeRenderPromise) {
+        throw new Error("mockQRCodeRender() must be called before waitForQRCodeRender()");
+    }
+
+    // Flush the React state update scheduled by QRCode after toDataURL resolves.
+    await act(async () => {
+        await qrCodeRenderPromise;
+        await Promise.resolve();
+    });
+}
+
+export function resetQRCodeMock(): void {
+    mockedToDataURL.mockReset();
+    qrCodeRenderPromise = undefined;
+}