Accessing "this.app" from external js script

Help & Support
1

In the case where a playcanvas app is embedded in a webpage with external scripts interacting with playcanvas, getting “this.app” from an external js script is doable via:

contentWindow.window.pc.Application.getApplication()
//from: https://stackoverflow.com/questions/49633946/publishing-multiple-playcanvas-apps-on-a-website

However, the “pc” object doesn’t seem to load in until some time (1-2seconds) after loading in the exported “index.html”, causing the line above to return undefined.

What is the loading order for a playcanvas exported application, when is the “pc” object available, and is there an event I can trigger on to tell when getApplication() will succeed? One workaround may be to do setInterval() and wait until pc is not undefined?

2

This question is similar to [SOLVED] Cannot access pc.app on application startup

Turns out setInterval works as I thought, but still looking for something cleaner.

//playcanvas is loaded in an iframe, so "window" refers to the window inside the iframe, aka the playcanvas app
window.addEventListener("DOMContentLoaded",function(){
        console.log("playcanvas's index.html is loaded");
        var pcReadyTrigger = setInterval(function(){
                if(typeof document.getElementById("playcanvas-iframe").contentWindow.window.pc !== 'undefined'){
                        clearInterval(pcReadyTrigger);
                        afterPcReady();
                }
        }, 100); //wait 100ms and check if pc is loaded again.
});

function afterPcReady(){
        var app1 = document.getElementById("playcanvas-iframe").contentWindow.window.pc.Application.getApplication();
        console.log(app1);
}