Created attachment 440703 [details] render error on safari 15 Version: 15.0(17612.1.15.1.14) Description: 1. Getting the canvas context. 2. Create an image dom element with long base64 string as its source. 3. Using drawImage API to render that image dom. 4. The canvas crash, it cannot render anything after using drawImage API!!! Test code: https://codepen.io/applekaelyn/pen/mdWgMGq ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body> <img id="testImg" width="100" height="100" src="data:image/svg+xml;base64,CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2ZXJzaW9uPSIxLjEiPgogIDxlbGxpcHNlIGN4PSIyNDAiIGN5PSIxMDAiIHJ4PSIyMjAiIHJ5PSIzMCIgc3R5bGU9ImZpbGw6cHVycGxlIiAvPgogIDxlbGxpcHNlIGN4PSIyMjAiIGN5PSI3MCIgcng9IjE5MCIgcnk9IjIwIiBzdHlsZT0iZmlsbDpsaW1lIiAvPgogIDxlbGxpcHNlIGN4PSIyMTAiIGN5PSI0NSIgcng9IjE3MCIgcnk9IjE1IiBzdHlsZT0iZmlsbDp5ZWxsb3ciIC8+Cjwvc3ZnPg=="></img> <canvas height="200" width="200" id="test"></canvas> </body> </html> ``` ```js var ctx = document.getElementById("test").getContext("2d"); console.log("😄", ctx); ctx.font = "12px serif"; ctx.fillText("Hello world", 50, 10); var image = document.getElementById('testImg'); ctx.drawImage(image, 20, 20, 100, 100) ctx.fillText("Hello world again!", 50, 200); ```
Created attachment 440704 [details] Correct Rendering result on chrome
I cannot reproduce this with Safari 15.1 beta. Could you please verify with the beta, and reopen if this still happens?