diff --git a/packages/replay-canvas/src/canvas.ts b/packages/replay-canvas/src/canvas.ts index 7861572b190f..0ed2b49d237e 100644 --- a/packages/replay-canvas/src/canvas.ts +++ b/packages/replay-canvas/src/canvas.ts @@ -77,6 +77,7 @@ export const _replayCanvasIntegration = ((options: Partial ] as [number, number], }; + let currentCanvasManager: CanvasManager | undefined; let canvasManagerResolve: (value: CanvasManager) => void; const _canvasManager: Promise = new Promise(resolve => (canvasManagerResolve = resolve)); @@ -104,14 +105,19 @@ export const _replayCanvasIntegration = ((options: Partial } }, }); + + currentCanvasManager = manager; + + // Resolve promise on first call for backward compatibility canvasManagerResolve(manager); + return manager; }, ...(CANVAS_QUALITY[quality || 'medium'] || CANVAS_QUALITY.medium), }; }, async snapshot(canvasElement?: HTMLCanvasElement, options?: SnapshotOptions) { - const canvasManager = await _canvasManager; + const canvasManager = currentCanvasManager || (await _canvasManager); canvasManager.snapshot(canvasElement, options); }, diff --git a/packages/replay-canvas/test/canvas.test.ts b/packages/replay-canvas/test/canvas.test.ts index 1acfeab69d21..ee51c91ce47a 100644 --- a/packages/replay-canvas/test/canvas.test.ts +++ b/packages/replay-canvas/test/canvas.test.ts @@ -103,3 +103,31 @@ it('has correct types', () => { const res2 = rc.snapshot(document.createElement('canvas')); expect(res2).toBeInstanceOf(Promise); }); + +it('tracks current canvas manager across multiple getCanvasManager calls', async () => { + const rc = _replayCanvasIntegration({ enableManualSnapshot: true }); + const options = rc.getOptions(); + + // First call - simulates initial recording session + // @ts-expect-error don't care about the normal options we need to call this with + options.getCanvasManager({}); + expect(CanvasManager).toHaveBeenCalledTimes(1); + + const mockManager1 = vi.mocked(CanvasManager).mock.results[0].value; + mockManager1.snapshot = vi.fn(); + + // Second call - simulates session refresh after inactivity or max age + // @ts-expect-error don't care about the normal options we need to call this with + options.getCanvasManager({}); + expect(CanvasManager).toHaveBeenCalledTimes(2); + + const mockManager2 = vi.mocked(CanvasManager).mock.results[1].value; + mockManager2.snapshot = vi.fn(); + + void rc.snapshot(); + + await new Promise(resolve => setTimeout(resolve, 0)); + + expect(mockManager1.snapshot).toHaveBeenCalledTimes(0); + expect(mockManager2.snapshot).toHaveBeenCalledTimes(1); +});