[OpenLayers-Dev] FireFox Image Loading Bug?

[Tim Schaub]

Erik Uzureau wrote:
> If anyone can figure out the problem here, I would be forever grateful:
> 
> http://dev.openlayers.org/sandbox/euzuro/untiled3/examples/ffbug.html

Hmm.  I would call this expected behavior.  (I also see the same thing 
in non-FF browsers, so I'm wondering if I'm looking at different output.)

Here's what makes sense to me.  Two sequences:

Gothic (1)
----------
1) you set the src of img1a to be Gothic
2) when that image finishes loading, you set the src of img1b to be 
Gothic - the browser has this image handy, so it is able to trigger 
onload *before* returning from this line
3) in the very next line, you set the src of img1b again to Gothic - 
again, the browser has this image handy and it triggers onload

Thompson (2)
------------
1) you set the src of img2a to be Thompson#12345
2) when that image finishes loading, you set the src of img2b to be 
Thompson - the browser doesn't have this image handy, so it makes an 
asynchronous request for it, not triggering onload until it is loaded, 
and returning immediately to execute the next line
3) in the very next line, you set the src of img2b again to be Thompson 
- the browser is still busy waiting for this image to download, but it 
respects your request to set the src again, cancels the previous 
requests (or at least stops listening for the response), and requests 
the image again.  Even if it is smart enough to wait for the same 
response, it makes good sense that the first process stops listening for 
the response and the second one takes over the response handling.
4) whenever the Thompson image finishes loading, you see onload 
triggered once - because there is only one process listening for it.

Basically, if an image is already in the cache, it makes sense to me that

   for(var i=0; i<3; ++i) {image.src = "cached.jpg";}

would trigger onload 3 times.

And, it also makes sense to me that if an image is not already loaded, then

   for(var i=0; i<10; ++i) {image.src = "uncached.jpg";}

would trigger onload an unknown number of times - likely once - based on 
when it finished loading the image.

Sensible?
Tim

PS -
And a quick test in Firebug confirms the above.  After loading your 
page, I run the following:

var image = $('img1b');
image.onload = function() {console.log('loaded');}
var cached = image.src;
for(var i=0; i<3; ++i) {image.src = cached;}

And, as you'd expect, 'loaded' shows up three times in the console.  To 
test the second bit, I continue on with:

var uncached = "http://www.midwestrocklobster.com/ugly/ugly3_lg.gif";
for(var i=0; i<3; ++i) {image.src = uncached;}

And, again as you might expect, 'loaded' shows up once - after the image 
has finished loading.