@glimt/record 0.0.14 → 0.0.15

package/dist/record.js

@@ -361,19 +361,31 @@ function toLowerCase(str) {
   return str.toLowerCase();
 }
 const ORIGINAL_ATTRIBUTE_NAME = "__rrweb_original__";
+const COPY_CANVAS_ON_VOLUME_GREATER_THAN = 25e4;
+function getReadableCanvasContext(canvas) {
+  if (canvas.width === 0 || canvas.height === 0) return canvas.getContext("2d");
+  if (canvas.width * canvas.height < COPY_CANVAS_ON_VOLUME_GREATER_THAN)
+    return canvas.getContext("2d");
+  console.log(
+    "detected large canvas, copying to offscreen canvas for willReadFrequently"
+  );
+  const offscreen = document.createElement("canvas");
+  offscreen.width = canvas.width;
+  offscreen.height = canvas.height;
+  const ctx = offscreen.getContext("2d");
+  if (ctx) {
+    ctx.drawImage(canvas, 0, 0);
+  }
+  return offscreen.getContext("2d", { willReadFrequently: true });
+}
 function is2DCanvasBlank(canvas) {
-  console.log("Creating context with willReadFrequently:", canvas);
-  const ctx = canvas.getContext("2d", {
-    willReadFrequently: true
-  });
+  const ctx = getReadableCanvasContext(canvas);
   if (!ctx) return true;
   const chunkSize = 50;
   for (let x2 = 0; x2 < canvas.width; x2 += chunkSize) {
     for (let y = 0; y < canvas.height; y += chunkSize) {
       const getImageData = ctx.getImageData;
       const originalGetImageData = ORIGINAL_ATTRIBUTE_NAME in getImageData ? getImageData[ORIGINAL_ATTRIBUTE_NAME] : getImageData;
-      console.log("Calling getImageData on ctx:", ctx);
-      console.trace();
       const pixelBuffer = new Uint32Array(
         // eslint-disable-next-line @typescript-eslint/no-unsafe-argument, @typescript-eslint/no-unsafe-member-access
         originalGetImageData.call(