Constantly “Connecting” in FireFox

This is an interesting issue, sometimes we see in FireFox 9 and above an issue where the tab title will actually get set to a state where it says “Connecting” and the spinner is constantly in motion.

One of the things I found recently when I discovered this was quickly writing out DOM elements and then Removing them.

Example

Take the following code, it appends a Node element to the DOM. As soon as the onload or onerror function is fired it removes the element.

var urls = [
...
];

for (var i = 0; i <= urls.length; i++){
	addObjectElement(url);
}

function addObjectElement(url){
	var obj = document.createElement("object");
	obj.data = url;
	
	obj.onload = obj.onerror = function() { removeElement(obj) };
	
	document.appendChild(obj);	
}

function removeElement(item) {
	var parent = item.parentElement;
	p.removeChild(item);
}

The previous could would end up causing an issue where FireFox would actually think it was still working. Thus creating the "Connecting" issue and the spinning icon.

How do we fix it?

Well, actually the fix is simple. If you wait a small amount of time to actually do the removal, firefox will unlock the thread rendering it back to the being normal.

Let's take a look.

The fix

var urls = [
...
];

for (var i = 0; i <= urls.length; i++){
	addObjectElement(url);
}

function addObjectElement(url){
	var obj = document.createElement("object");
	obj.data = url;
	
	obj.onload = obj.onerror = function() { setTimeout(function(){ removeElement(obj)}, 5); };
	
	document.appendChild(obj);	
}

function removeElement(item) {
	var parent = item.parentElement();
	p.removeChild(item);
}

Once we add the setTimeout to the code, even at a small 5ms delay, we unlock the thread and cause firefox to resume normal operation.

2 thoughts on “Constantly “Connecting” in FireFox”

    1. Setting timeout to 0 can cause the same behavior. The root cause is a bug in FF that has been reported, where if you remove a node during the onload event, it will sit and “spin” from then on. You need to make sure that the onload even has finished completely before removing the node.

Leave a Reply to JC Fant IV Cancel reply

Your email address will not be published. Required fields are marked *