We have a js function that runs on DOMContentLoaded, document.addEventListener(“DOMContentLoaded”, OURFUNCTION). It works fine when you refresh the browser, but never shows when you navigate the site. I presume that’s because Discourse only loads the dom once and then the rest of handled with clien…

Hey, If you’re looking for an event called when page loads, there is api.onPageChange . api.onPageChange((url, title) => { console.log('the page changed to: ' + url + ' and title ' + title); }); If you’re looking for something else, can you elaborate on what you want to achieve? We could give y…

Hmmm … I’m not sure it guarantees the DOM content has loaded, I believe it fires on the Route change, which is much earlier. You’d need to consider attaching a Component to a Plugin Outlet and firing on didInsert modifier if the DOM loading is important. If just the Route change is important, then…

You may be right! :thinking: onPageChange is called the next runloop, so I think it will still be called after DOMContentLoaded in most situations, but I can’t say it’s guaranteed. I can see usage relying on onPageChange and doing DOM element stuff directly. From where is fired the routeDidChange …

Thanks. I’ve read thru the documentation extensively and per my comments and a discourse member follow up there, the plugin API is legacy and will be deprecated soon. So while your code might work now, it will break soon, I believe in future updates. That’s why I’m looking for a better solution. Se…

[صورة] DDSGadget: the plugin API is legacy and will be deprecated soon I don’t believe that is correct. [صورة] Using the PluginAPI in Site Customizations Developer Guides Using the client side Plugin API is the safest way to build Discourse Javascript plugins and t…

Thanks for clarifying! So it’s just the widget api . Ok will try the api suggestions above first

[صورة] DDSGadget: it’s just the widget api This is kind of a blessing :sweat_smile:, Glimmer is a helluva lot more developer friendly

BTW, we tested it with api.OnPageChange and it works fine. We haven’t run into an instance yet here the DOM content wasn’t available upon calling OnPageChange, so it seems like it is fired after DomContentLoaded. But, I can’t be 100% sure. Thanks for your help on this.

Good. Just be aware that timing is not guaranteed. But glad it works for your use case!

[صورة] Robert: firing on didInsert modifier if the DOM loading Can you please better explain what this means? What is the didInsert modifier? I’m firing on the decorateCookedElement. Thanks.

كيفية تجاوز DOMContentLoaded للتنقل

مطور

ddsgad (DDSGadget) 21 فبراير 2025، 3:00م 11

هل يمكنك شرح هذا بشكل أفضل؟ ما هو مُعدِّل didInsert؟ أنا أعمل على decorateCookedElement. شكرًا.

الموضوع		الردود	مرات العرض
[newbie] Trouble adding script to dynamically change CSS values based on conditions Support	10	1689	8 يونيو 2024
Trigger javascript on clicking any page link, but before the page content loads? Development	10	1278	4 نوفمبر 2024
Executing js after DOM loaded Support	7	3634	30 ديسمبر 2018
My plugin codes runs just once!(My own script shouldn't be cached) Development	17	2321	21 نوفمبر 2016
beforePageChange plugin API? Development	1	607	15 ديسمبر 2021

كيفية تجاوز DOMContentLoaded للتنقل

الموضوعات ذات الصلة