0

I'm trying to dynamically preload list of files which may be anything between images and JavaScript files. Everything is going supersmooth with Chrome and Firefox, but failing when I'm trying to preload JavaScript files with Edge. Edge still can handle images for example but no js files. And yes I've tried with addEventListener, it's not working either.

Edge doesn't give me any errors.

    var object = {};
    object = document.createElement('object');
    object.width = object.height = 0;
    object.data = path/to/javascriptfile.js
    body.appendChild(object);

    object.onload = function(){
         console.log('hello world')
         //not firing with edge
    }

Anything relevant I'm missing?

UPDATE: Didn't get any success after the day. Will probably leave it for now and just skip preloading script files with edge until i find a solution.

eljuko
  • 145
  • 1
  • 12
  • Possible duplicate of [Is there a cross-browser standard on-load event for HTML's "object" tag?](http://stackoverflow.com/questions/7756353/is-there-a-cross-browser-standard-on-load-event-for-htmls-object-tag) – Heretic Monkey Dec 20 '16 at 15:20

2 Answers2

1

Perhaps worth a check - from msdn:

The client loads applications, embedded objects, and images as soon as it encounters the applet, embed, and img objects during parsing. Consequently, the onload event for these objects occurs before the client parses any subsequent objects. To ensure that an event handler receives the onload event for these objects, place the script object that defines the event handler before the object and use the onload attribute in the object to set the handler.

https://msdn.microsoft.com/en-us/library/windows/apps/hh465984.aspx

Edit, a clarification:

You should attach the event listener before the element is added to the page.

Even doing that I'm not sure if it'll work or not though. But to make sure you've exhausted all options try the example below: 

function doLoad() {
   console.log('The load event is executing');
}

var object = {};
object = document.createElement('object');
object.width = object.height = 0;
object.data = 'path/to/javascriptfile.js';

object.onreadystatechange = function () {
   if (object.readyState === 'loaded' || object.readyState === 'complete') doLoad();
   console.log('onreadystatechange');
}

if (object.addEventListener) { 
   object.addEventListener( "load", doLoad, false );
   console.log('addEventListener');
}
else 
{
   if (object.attachEvent) { 
      object.attachEvent( "onload", doLoad );
      console.log('attachEvent');
   } else if (object.onLoad) {
      object.onload = doLoad;
      console.log('onload');
   }
}

var body = document.getElementsByTagName("body")[0];    
body.appendChild(object);

If this doesn't work, you could perhaps preload using "image" instead of "object" in IE: https://stackoverflow.com/a/11103087/1996783

Community
  • 1
  • 1
Mackan
  • 6,200
  • 2
  • 25
  • 45
  • Unfortunately at this moment i'm completely dead inside or i'm just dum, but couldn't get it work with given information. I'll keep looking but probably will need to make complete workaround for edge. At least for now. – eljuko Dec 20 '16 at 16:19
  • @eljuko I've added an example. Not sure if it'll work or not, but crossing my fingers – Mackan Dec 21 '16 at 07:41
  • Thanks for putting effort in this. Will try this and inform once i'm done. – eljuko Dec 21 '16 at 09:33
  • Ok. So, didn't get it working with these either. scripts don't fire onreadystatechange. using images instead of objects... well, same thing. But i got it fired if i directly put it to script tags. i think thats the way to go at the moment even i have to make some ugly code :) Anyhow, thank you again for your effort. Will update the answer once i get it fully working. – eljuko Dec 21 '16 at 10:48
0

Working temporary solution is to put onload event directly to script element instead of object. It's sad since it works like a charm in Chrome & FF.

It turns out, object.data with css source did not load either. I don't know if it's a bug since it still can load image from to object.data.

But show must go on.

Cheers, eljuko

eljuko
  • 145
  • 1
  • 12