Cannot edit components in author editor mode until iframe load

[Julkar__Naim]

Hi everyone,

I have created a simple custom iframe component as such - 

<iframe id="iframe-test" class="embed-iframe iframe-main"
        src="${properties.url}"
        style="width:100%;border:none;"
        allowfullscreen>
</iframe>

 
In editor mode I am unable to edit other components while this iframe component is loading. Is it possible to make this iframe loading asynchronous in editor mode? so that I can author other components while this iframe is loading? The iframe behaves asynchronously in view as published mode and in publisher. 

[arunpatidar]

Hi @Julkar__Naim 
Yes, using javascript you can load Iframe asynchronsly 

https://stackoverflow.com/questions/2114239/load-an-iframe-asynchronously 

[Raja_Reddy · Accepted solution]

Hi @Julkar__Naim 
To make the iframe loading asynchronous in editor mode, you can use JavaScript to load the iframe after the rest of the page has finished loading.

window.addEventListener('DOMContentLoaded', function() {
  var iframe = document.getElementById('iframe-test');
  iframe.src="${properties.url}";
});

By using the DomcontentLoaded event, the iframe will only start loading after the rest of the page has finished loading. This allows you to author other components while the iframe is loading asynchronously.