Changing browser tab clear drawing buffer.

jsfiddle example here.

Quick preview:

Steps to reproduce

• Initial state:

• Click on “Draw from canvas 1 to canvas 2”. This uses 2d context of canvas 2 to drawImage:

const ctx = canvas2.getContext("2d");
ctx.drawImage(canvas1, 0, 0);

Note: it works only if `preserveDrawingBuffer` is set to `true` on the canvas1 PIXI.Renderer.

• Change tab.

• Come back.

• Click again on “Draw from canvas 1 to canvas 2”. The red square disappear.

Expected Behavior

The red square must not disappear.

Current Behavior

The red square disappears.

Chrome ONLY.

Does not work on:

Chrome 87. (Windows 10, Linux UBUNTU 20.04, MacOS 10.15.7) PIXI v5.X v6.X

Changing window on Windows and MacOS also leads to the issue.

Works on:

Firefox (Windows 10, Linux UBUNTU 20.04, MacOS 10.15.7.) PIXI v5.X v6.X

[Kurtil]

Thanks! https://bugs.chromium.org/p/chromium/issues/detail?id=1166789

[bigtimebuddy]

Good bug!

Here’s a webgl example without PIXI: https://jsfiddle.net/bigtimebuddy/s418rk6y/

This seems like a browser bug (not PixiJS) and you might want to report to Chrome/Chromium.