Context problem

Phaser 2 / CE
1

I have a huge image as background and I move by panning across the world. However, at some point I get an exception like:

TypeError: Failed to execute ‘drawImage’ on ‘CanvasRenderingContext2D’: The provided value is not of type ‘(CSSImageValue or HTMLImageElement or SVGImageElement or HTMLVideoElement or HTMLCanvasElement or ImageBitmap or OffscreenCanvas)’
at Phaser.Sprite.PIXI.Sprite._renderCanvas (phaser.js:15712)
at Phaser.World.PIXI.DisplayObjectContainer._renderCanvas (phaser.js:15137)
at Phaser.Stage.PIXI.DisplayObjectContainer._renderCanvas (phaser.js:15137)
at PIXI.CanvasRenderer.renderDisplayObject (phaser.js:20531)
at PIXI.CanvasRenderer.render (phaser.js:20463)
at Phaser.Game.updateRender (phaser.js:36393)
at Phaser.Game.update (phaser.js:36314)
at Phaser.RequestAnimationFrame.updateRAF (phaser.js:61985)
at _onLoop (phaser.js:61968)

I changed the lines with try-catch to see which sprites are affected. There are multiple sprites… the funny thing: It paints everything fine when I start the state. Then I pan… and pan… and pan… sometimes, at the first pan this error occurs, sometimes after 2 minnutes panning around as if you’ve nothing else to do.
The previous state background is showing and then, after some seconds, it works again (because I catch the error, otherwise the whole game breaks).
Why would the type of a loaded sprite change? That makes no sense… especially because it’s drawn when I start the state and I can be drawn even after the exception is thrown.

I’m running out of ideas. Can someone help?

2

Nvm, got it. Duplicated sprites or whatever… clearing the cache between states fixed that like

game.state.start('anyState', true, false, ...yourParams);
3

Are you loading different textures with the same key?

4

Not that I’m aware of…
Each key is unique in my pack.json and I never call loadTexture somewhere.

5

TypeError: Failed to execute ‘drawImage’ on ‘CanvasRenderingContext2D’: The provided value is not of type ‘(CSSImageValue or HTMLImageElement or SVGImageElement or HTMLVideoElement or HTMLCanvasElement or ImageBitmap or OffscreenCanvas)’

Which line is this, and which sprites and textures are involved?

This can happen if texture.baseTexture.source becomes null, for one thing.

Are you using WEBGL_MULTI?

6

It’s line 15711, the concrete function signature is

PIXI.Sprite.prototype._renderCanvas = function(renderSession, matrix)

and the conrete line statement is

renderSession.context.drawImage(this.tintedTexture, 0, 0, cw, ch, dx, dy, cw / resolution, ch / resolution);

I’m not using WEBGL_MULTI I guess. I take canvas for all devices, except for iOS I take WebGL.

Better I check my pack.json and the loadings again. Maybe I messed it up there.

7

I guess it’s this.tintedTexture that’s empty then.