How to execute javascript after page fully loaded?

PeerTube
#1

Hi. I am trying to modify some things that require Javascript to be used. So I use the custom JS section.

My issue is, the code seems to be executed before the page fully load.

I have tried following solutions:

window.addEventListener('load',() => {
  // more code
});

window.onload = function(){
  // more code
};

document.onreadystatechange = function () {
  // more code
};

But all 3 of them seems not working. I am not sure how Peertube work, but I believe the custom JS loaded in the main part of the website, then the content loaded separately after.

The only solution now is to set timeout. But this is quite ugly since everyone have different loading time.
Any idea?

Thanks!

#2

Hello,

Client content is renderer by Angular, a SPA framework so the content may be not rendered yet when your code is running.

What do you want to achieve?

#3

I want to change the color or my name, and probably do some more styling later if I got this to work.
So basically I search my name using Javascript and XPath. Then I add a class which I added in custom css section.

For now, that is all I wanted to do.