CODEWITHSUNDEEP
javascriptsitecoresitecore7sitecore7.2
Corey Adler
Corey Adler

Reputation: 16137

Sitecore Page Editor running script before div added to DOM

Yesterday I asked this SO question about an issue that I was having with a rendering not showing up after trying to add it through Page Editor, even though it worked perfectly when added through the Presentation Details on the Content Editor. The rendering contained a JavaScript function inside of it that appeared to be the culprit, especially since the rendering would work perfectly fine if it was removed.

@MarekMusielak gave me a great answer to the question, but had the following to say:

The issue is that when you add a component through Page Editor, the script is fired before the div element is added to DOM. Don't ask me why...

I've been trying to figure out why this happens, but I can't seem to find anything online about this, and none of my co-workers know why this happens either. It's really starting to bug me.

Why does Page Editor fire the script before the <div> is added to the DOM?

Upvotes: 0

Views: 329

Answers (1)

Mark Cassidy
Mark Cassidy

Reputation: 5860

By no means do I consider myself an expert on DOM in modern browsers, but I did find this - and it might be worth a shot.

Colin Ihrig writes:

As previously stated, tags cause the browser to block the rest of the page while the script is processed. This can lead to problems if the script references DOM elements which haven’t finished loading yet. In this scenario, the DOM-related code is typically placed in an event handler such as window load or DOMContentLoaded. Another option is to postpone execution until the document has been parsed using the “defer” attribute.

His entire article is quite thorough. I would try messing a bit with "defer" and "async" and see if it has any impact on what you're experiencing.

Upvotes: 2

Related Questions