Odd problem restarting a level(scene)

Phaser 3
1

I am able to restart scenes with almost no problems. The one problem I am having is it draws my powerup twice (over the top of each other). My restart function looks like this:
restartLevel() {
this.game.state.mode = MODE.RESTARTING;
this.isRestarting = true;
this.game.points = this.startingPoints;
Audio.turnOffMusic();

this.game.state.phase = undefined;
this.scene.stop();
this.scene.restart();

}
Any ideas on what would cause this to draw these sprites twice like this? We have a pretty complex game going now. This is the only current bug. Thanks so much for your help!

2

Have you tried removing this.scene.stop()? My game goes back to the menu when the player dies, and stopping the scene gave me problems with matter constraints; but calling this.scene.restart() before starting the menu scene solved it.

this.scene.restart();
this.scene.start(myMainMenuScene);

3

Thanks for the idea, but it didn’t help. It is still drawing them over the top of each other.

4

How is the powerup created?

5

We have a base-scene function. In that function we use:
this.components.push(PowerUps); in preload()
We have a function called:
spawnPowerup() {
if (this.game.state.mode === MODE.FINISH) {
return;
}

if (this.game.hero.activePowerup) {
  return;
}

const heroY = this.game.hero.gameObject.y;
const vpHeight = ui.pixelViewportHeight;
const vpWidth = ui.pixelViewportHeight;

const allPlatforms = this.sceneGroups.Platform.getChildren();

const visiblePlatforms = allPlatforms.filter((platform) => {
  const visible = platform.y > (heroY - vpHeight * 0.75) &&
                    platform.y < (heroY + vpHeight * 0.25) &&
                    platform.visible &&
                    !platform.speed;

  return visible;
});

if (visiblePlatforms.length === 0) {
  return;
}

const platform = visiblePlatforms[Phaser.Math.Between(0, visiblePlatforms.length - 1)];
const { plank1, platformWidth } = platform.component;
const offset = (platformWidth / 2) - 50;

if (this.availablePowerup) {
  this.availablePowerup.fadeOut();
}

const type = this.powerups[Phaser.Math.Between(0, this.powerups.length - 1)];
let x = plank1.x + Phaser.Math.Between(-offset, offset);
x = (x > vpWidth - 150) ? (vpWidth - 150) : x;
x = (x < 150) ? 150 : x;

const offsetToHero = this.game.hero.gameObject.x - x;
if (Math.abs(offsetToHero) < 200) {
  if (offsetToHero > 0) {
    // push x left
    x = this.game.hero.gameObject.x - 200;
  } else {
    x = this.game.hero.gameObject.x + 200;
  }
}

this.time.delayedCall(3000, () => {
  this.availablePowerup = PowerUps.create(this, {
    type,
    x,
    y: platform.y - 16 - 100,
  });
});

}

We have divided each scene into phases. IN our startPhase() functions we call
this.powerupSpawnTimer = this.time.addEvent({
delay: 12000,
callback: this.spawnPowerup,
callbackScope: this,
loop: true,
});

That is the basics of it. Thanks for taking the time to look at this!!

6

Try to verify the contents of the scene’s display list (this.sys.displayList).