From b04795d6e8ac73093fef4fcd2f31554df9b37ec3 Mon Sep 17 00:00:00 2001
From: Dariusz L <dl122@wp.pl>
Date: Thu, 14 Aug 2025 15:04:08 +0200
Subject: [PATCH] Fix CORS for images loaded from IndexedDB

Add crossOrigin='anonymous' to image elements in CanvasState._createLayerFromSrc() method. This prevents canvas tainting when images are restored from IndexedDB after page refresh, ensuring export functions work correctly.
---
 js/CanvasState.js  | 2 ++
 src/CanvasState.ts | 2 ++
 2 files changed, 4 insertions(+)

diff --git a/js/CanvasState.js b/js/CanvasState.js
index 2fca6eb..74e6be4 100644
--- a/js/CanvasState.js
+++ b/js/CanvasState.js
@@ -200,6 +200,7 @@ export class CanvasState {
     _createLayerFromSrc(layerData, imageSrc, index, resolve) {
         if (typeof imageSrc === 'string') {
             const img = new Image();
+            img.crossOrigin = 'anonymous';
             img.onload = () => {
                 log.debug(`Layer ${index}: Image loaded successfully.`);
                 const newLayer = { ...layerData, image: img };
@@ -216,6 +217,7 @@ export class CanvasState {
             if (ctx) {
                 ctx.drawImage(imageSrc, 0, 0);
                 const img = new Image();
+                img.crossOrigin = 'anonymous';
                 img.onload = () => {
                     log.debug(`Layer ${index}: Image loaded successfully from ImageBitmap.`);
                     const newLayer = { ...layerData, image: img };
diff --git a/src/CanvasState.ts b/src/CanvasState.ts
index b219faf..4023a0d 100644
--- a/src/CanvasState.ts
+++ b/src/CanvasState.ts
@@ -235,6 +235,7 @@ export class CanvasState {
     _createLayerFromSrc(layerData: Layer, imageSrc: string | ImageBitmap, index: number, resolve: (value: Layer | null) => void): void {
         if (typeof imageSrc === 'string') {
             const img = new Image();
+            img.crossOrigin = 'anonymous';
             img.onload = () => {
                 log.debug(`Layer ${index}: Image loaded successfully.`);
                 const newLayer: Layer = {...layerData, image: img};
@@ -250,6 +251,7 @@ export class CanvasState {
             if (ctx) {
                 ctx.drawImage(imageSrc, 0, 0);
                 const img = new Image();
+                img.crossOrigin = 'anonymous';
                 img.onload = () => {
                     log.debug(`Layer ${index}: Image loaded successfully from ImageBitmap.`);
                     const newLayer: Layer = {...layerData, image: img};