Background images not freed when changing CSS classes

[Joe Edwards]

If css is defined as follows:

.bg1 {
 background-image: url(img1.jpg);
} 

.bg2 {
 background-image: url(img2.jpg);
}


And then you change the background on an element using:

    document.getElementById('pagebg').className = "bg1";
or
    document.getElementById('pagebg').className = "bg2";


The "old" image reference is not freed up. (Use of cache has been disabled)

If I change the image background using 

    document.getElementById('pagebg').style.backgroundImage = 'url(img1.jpg)';
or
    document.getElementById('pagebg').style.backgroundImage = 'url(img2.jpg)';


The old image reference is correctly freed up.


I have put up pages to illustrate this behaviour:

The first use case (which caches the image) is at:
http://www.joelebeau.co.uk/testcssbg/index.htm

The 2nd use case is at:
http://www.joelebeau.co.uk/testcssbg/index2.htm


(In both pages the image loads/transitions are triggered by a key press)

[Alexey Proskuryakov]

I'm not sure what the difference in behavior between the two linked tests is. What do you mean by "freed up"? Is this a memory leak, and if it is, how did you confirm it?

[Joe Edwards]

Essentially i looked at the web server logs in both cases... In the first case I could see each image only being requested once.

In the 2nd case each image was re-requested before each change.

From adding debug it seems that there is still a reference (client) to the CachedImage by CSSImageValue

[Simon Fraser (smfr)]

We used to load all images referenced by matched selectors, but that was fixed by bug 49204. Does this still reproduce?

[Alexey Proskuryakov]

Simon, did you mean to reference bug 24223?

[Simon Fraser (smfr)]

(In reply to comment #4)
> Simon, did you mean to reference bug 24223?

I did, yes.