I am new to Phaser (just started learning it this weekend) and just started following tutorials/playing around with it and I hit a bug that is puzzling me. I’m hoping someone here can enlighten me on what is going wrong?
So the first run through of the game works totally fine but when the game ends and I try to play again, I hit an error when I try to execute setText() to update the score on the screen:
Uncaught TypeError: s is null
setSize http://localhost/js/phaser.min.js:1
updateText http://localhost/js/phaser.min.js:1
setText http://localhost/js/phaser.min.js:1
So when the game ends, I exit my game scene by simply calling the game over scene with this.scene.start(). Then, I re-enter my game scene by calling this.scene.start() from the game over scene, and again, this re-entry is when I am unable to update the score anymore.
I instantiate the scoreboard object (which ultimately will update the text) in my main game scene and use EventEmitters to detect when to update the score. All of that code leading up to calling setText() seems to work fine. But something goes wrong when setText() is called. I have confirmed that my setText() inputs are valid (not null).
Does anyone know why this.data on line 375 would be null and how to fix this?
Also it seems like if I destroy the game and re instantiate new Phaser.Game after the game ends, this error does not occur. I am assuming this method is not good practice though and we shouldn’t have to destroy and re-instantiate Phaser.Game after each game run?
So I added a listener that will execute emitter.off() for those event listeners related to updating the score after the scene shuts down but I still see the same error afterwards.
The error seems to be because the frame data is somehow null - I am wondering what could cause this from scene switches?
Okay so I looked more into what is going on and I think I know what is happening. I am still unsure of how to properly resolve this though. Here are my observations:
So in GameScene create() - I create an instance of the ScoreBox class. This ScoreBox class creates this.scoreText via the method this.scene.add.text().
this.scoreText.setText() is called whenever the EventEmitter detects that the score needs to be updated. For the first run of the game, all of this works totally fine.
For debug purposes, I assigned this.scoreText a member variable with a random number, which came out to be 2 (this.scoreText.debugNumber=2).
After the game ends, I made a point to run emitter.off(...) for the events related to score updates, I run this.scoreBox.scoreText.destroy(), and set this.scoreBox=null prior to switching to the game over scene (although I get the same error even without doing this so this is probably not necessary).
In the second run of the game, the ScoreBox object is recreated when GameScene’s create() runs again, and a new this.scoreText variable is created. this.scoreText this time has a debugNumber value of 76.
When the game tries to run this.scoreText.setText() though, the debugger tells me that it is using the first this.scoreText that was already destroyed - the one with this.scoreText.debugNumber=2, instead of the newly created one. This is why this scoreText has a frame object with data=null.
How do I get the new this.scoreText object to be used instead? I already called emitter.off() on the event that calls for updating the score.
