Saving canvas with snapshotArea in Safari

Phaser 3
1

The code below was working fine in mobile Safari with Phaser 3.24.1, but is not working in 3.52.0. It works in Chrome with both versions. Anyone know why it stopped working in mobile Safari?

this.game.renderer.snapshotArea(225, 190, 870, 460, function (image)
{
var canvas = Phaser.Display.Canvas.CanvasPool.create(this,image.width,image.height);
var ctx = canvas.getContext(‘2d’);
ctx.drawImage(image, 0, 0, image.width, image.height);

      canvasToBlob(canvas)
        .then(function(blob) {
          var metadata = {
            contentType: 'image/png',
          };
      })
      .then(function (snapshot) {

      })
      .catch(function (error) {
        console.log('Image failed to load.');
      });
      Phaser.Display.Canvas.CanvasPool.remove(canvas);
    },'image/png');
2

Possible CanvasPool.remove(canvas) is too early.

But I don’t understand the purpose of the code. The snapshot callback already has image.

3

I see what you mean. I simplified the code without using canvas, but it still only works in mobile Safari with Phaser version 3.24.1. It works fine in Chrome with either Phaser version. Thanks for your help!

this.game.renderer.snapshotArea(225, 190, 870, 460, function (image)
{
imgSrcToBlob(image.src)
.then(function(blob) {
var metadata = {
contentType: ‘image/png’,
};
})
.then(function (snapshot) {
})
.catch(function (error) {
});
},‘image/png’);

4

What is the end goal with this code?

5

I am taking a snapshot of a user created drawing and uploading it into a Firebase storage container.