diff --git a/src/components/CanvasBoard.vue b/src/components/CanvasBoard.vue index 1de00d2..d196ef8 100644 --- a/src/components/CanvasBoard.vue +++ b/src/components/CanvasBoard.vue @@ -81,10 +81,19 @@ store.renderer.ctx = store.renderer.canvas.getContext("2d", { willReadFrequently: true, }); - store.renderer.workCanvas = new OffscreenCanvas( - canvas.parentElement.clientWidth, - canvas.parentElement.clientHeight - ); + if (typeof OffscreenCanvas != "undefined") { + store.renderer.workCanvas = new OffscreenCanvas( + canvas.parentElement.clientWidth, + canvas.parentElement.clientHeight + ); + } + // https://developer.mozilla.org/en-US/docs/Web/API/OffscreenCanvas/OffscreenCanvas#Browser_compatibility + // Fallback for when offscreenCanvas is unsupported or disabled (Firefox < 44, default for Firefox?) + else { + store.renderer.workCanvas = document.createElement("canvas"); + store.renderer.workCanvas.width = canvas.parentElement.clientWidth; + store.renderer.workCanvas.height = canvas.parentElement.clientHeight; + } store.renderer.workCtx = store.renderer.workCanvas.getContext("2d", { willReadFrequently: true, });