From 3d1877cff83d9a018630674fb6e730050ceef812 Mon Sep 17 00:00:00 2001 From: Manoel Aranda Neto <5731772+marandaneto@users.noreply.github.com> Date: Fri, 5 Apr 2024 14:24:25 +0200 Subject: [PATCH] fix: createImageBitmap throws DOMException if source is 0 (#1422) * fix: createImageBitmap throws DOMException if source is 0 * code review * fix * Create breezy-cats-heal.md * fix format --------- Co-authored-by: Justin Halsall --- .changeset/breezy-cats-heal.md | 5 +++++ .../rrweb/src/record/observers/canvas/canvas-manager.ts | 6 ++++++ 2 files changed, 11 insertions(+) create mode 100644 .changeset/breezy-cats-heal.md diff --git a/.changeset/breezy-cats-heal.md b/.changeset/breezy-cats-heal.md new file mode 100644 index 0000000000..6e1bc2fa46 --- /dev/null +++ b/.changeset/breezy-cats-heal.md @@ -0,0 +1,5 @@ +--- +'rrweb': patch +--- + +fix: createImageBitmap throws DOMException if source is 0 width or height diff --git a/packages/rrweb/src/record/observers/canvas/canvas-manager.ts b/packages/rrweb/src/record/observers/canvas/canvas-manager.ts index a8e06e468b..f825877f69 100644 --- a/packages/rrweb/src/record/observers/canvas/canvas-manager.ts +++ b/packages/rrweb/src/record/observers/canvas/canvas-manager.ts @@ -184,6 +184,12 @@ export class CanvasManager { .forEach(async (canvas: HTMLCanvasElement) => { const id = this.mirror.getId(canvas); if (snapshotInProgressMap.get(id)) return; + + // The browser throws if the canvas is 0 in size + // Uncaught (in promise) DOMException: Failed to execute 'createImageBitmap' on 'Window': The source image width is 0. + // Assuming the same happens with height + if (canvas.width === 0 || canvas.height === 0) return; + snapshotInProgressMap.set(id, true); if (['webgl', 'webgl2'].includes((canvas as ICanvas).__context)) { // if the canvas hasn't been modified recently,