[SOLVED] Upon Changing Same Scene PlayCanvas Error

Hello,

I have only one scene “GamePlay”.
When i try to change Scene to “GamePlay” (actually game reloads which i want it to happen) I am getting error…

:warning:Error:

Uncaught TypeError: Cannot read property 'hitPadding' of null
    at ButtonComponent.get (playcanvas-stable.dbg.js:28851)
    at ElementInput._buildHitCorners (playcanvas-stable.dbg.js:56094)
    at ElementInput._checkElement (playcanvas-stable.dbg.js:56179)
    at ElementInput._getTargetElement (playcanvas-stable.dbg.js:56066)
    at ElementInput._onElementMouseEvent (playcanvas-stable.dbg.js:55869)
    at ElementInput._handleMove (playcanvas-stable.dbg.js:55754)
get @ playcanvas-stable.dbg.js:28851
_buildHitCorners @ playcanvas-stable.dbg.js:56094
_checkElement @ playcanvas-stable.dbg.js:56179
_getTargetElement @ playcanvas-stable.dbg.js:56066
_onElementMouseEvent @ playcanvas-stable.dbg.js:55869
_handleMove @ playcanvas-stable.dbg.js:55754

:arrow_forward:Here is button click Snippet

this.restartBtnCompEntity.element.on('click', function (evt) {

    this.isGameStarted = false;
    this.isGameOver = false;

    // Change scenes in 10 ms
    var self = this;
    var sceneName = this.sceneManagerEntity.script.sceneManagerScript.sceneNames[0];
    console.log(sceneName);
    setTimeout(function(){
        self.loadScene(sceneName); // reload game
    }.bind(this),10);
}, this);

:arrow_forward:Here is my load scene function


/*******************************************************\
| Load Scene
\*******************************************************/

GamePlayManagerScript.prototype.loadScene = function (sceneName) {
    // Get a reference to the scene's root object
    var oldHierarchy = this.app.root.findByName ('Root');
    
    // Get the path to the scene
    var scene = this.app.scenes.find(sceneName);
    
    // Load the scenes entity hierarchy
    this.app.scenes.loadSceneHierarchy(scene.url, function (err, parent) {
        if (!err) {
            oldHierarchy.destroy();
        } else {
            console.error(err);
        }
    });
};

How i can fix this?

See this issue: https://github.com/playcanvas/engine/issues/2167

TLDR, you need to destroy the scene hierarchy first before loading the same scene again.

1 Like

Thanks @yaustar for help! :slight_smile:

I managed to fix this issue using following method. Works great for me!

:arrow_forward: Button Click Snippet

this.restartBtnCompEntity.element.on('click', function (evt) {

    this.isGameStarted = false;
    this.isGameOver = false;

    // Change scenes in 10 mili seconds
    var self = this;
    var sceneName = self.sceneManagerEntity.script.sceneManagerScript.sceneNames[0];
    var sceneUrl = this.app.scenes.find(sceneName).url;
    console.log(sceneName, sceneUrl);
    setTimeout(function(){
        self.changeScene(sceneUrl); // reload game
    }.bind(this),10);
}, this);

:arrow_forward: on destroy:

this.on('destroy', function() {

    this.loadScene (this.sceneUrl, function () {

    }.bind(this));

}.bind(this));

:arrow_forward: Function Call


/*******************************************************\
| Change Scene
\*******************************************************/

GamePlayManagerScript.prototype.changeScene = function(sceneUrl) {
    
    this.sceneUrl = sceneUrl;
    try
    {
        var oldHierarchy =  this.app.root.findByName("Root");// this.app.root.findByName('Root');
        
        setTimeout(function(){
            oldHierarchy.destroy();
            this.app.root.destroy();
        }.bind(this));
    }
    catch(e)
    {
        console.log(e);
    }
};

GamePlayManagerScript.prototype.loadScene = function (id, callback) {
    // Get the path to the scene
    var url = id;
    // Load the scenes entity hierarchy
    this.app.loadSceneHierarchy(url, function (err, parent) {
        if (!err) {
            callback(parent);
        } else {
            console.error (err);
        }
    });
};

2 posts were split to a new topic: Changing scenes on published builds has error from 1.40.0 onwards