Another post, something new learnt… While trying to use olarks browser window sharing feature, we (the team) discovered the that the canvas image layer (a JS image stamped onto a canvas) wasn’t being rendered. A dig in the console and a conversation with the support identified this console message as the problem:
Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.
It seem’s that images that are pulled from a different domain to the actual page and rendered onto a canvas, “taint” the canvas. Tainted canvases can then not be exported as an image nor dataURL.
The solution (thankfully) was straight forward. By setting a crossOrigin attribute on the image we can override the default browser security.
var image = new Image(); image.setAttribute('crossOrigin', 'anonymous'); image.src = url;