Geeks With Blogs
Blake Caraway

I ran into a crazy issue while working on my ASP.Net 2.0 application in Firefox this week and thought I'd share...

When a certain ASPX page completed rendering and emitted it's final markup to the browser, I noticed the status bar read 'Done' for an instant, but then immediately changed to 'Waiting for localhost...' again. It definitely seemed as if the page was being requested twice. I immediately looked at FireBug to see what was loading, and indeed the same page showed up twice in the 'Net' listing. To see it in action, I ran the site in DEBUG mode and put a break on Page_Load. Sure enough, the page WAS being requested twice. IE(7) worked just fine. It was not behaving in this odd manner, so I set out to figure out what was causing this strange behavior in Firefox.


Two Browsers - Two Different Behaviors

After many Google searches, I finally found a few message board posts talking about pages being loaded twice. It seems that an empty src attribute (like in an <img> tag) will cause this undesirable behavior in Firefox. The browser's rendering engine sees an empty src attribute and tries to put the current page name (URI) in it's place.

So, when Firefox sees this...

<IMG id="fooImage" src="" /> substitutes the empty attribute value like this...

<IMG id="fooImage" src="http://localhost/foo/bar.aspx" />

Inserting the current page within the src attribute will of course cause the browser to request the page once again. That's why I was seeing the 'waiting for localhost...' browser status message fire up again after the page had already visually rendered. IE (7) handles the empty src attribute by adding '/null' rather than the actual page name, like this...

<IMG id="fooImage" src="http://localhost/foo/null" />


AJAX Extender Control To Blame

The reason this strange behavior started to occur was because I recently began using the ASP.Net AJAX DropDown extender on the problematic ASPX page in question. The DropDown extender has several properties that you can configure to fit your display needs. One of these properties is the 'DropArrowImageUrl'. Since I didn't have the need to override this image, I didn't assign a value to this property. When ASP.Net renders the image tag for this control, the src attribute is left empty because I didn't specify a particular image.


The Fix (Hack)

It was clear that some sort of valid image needed to be set on this control in order to prevent Firefox from requesting the page twice. So we plugged in a 1 pixel transparent image and the problem went away. I've provided a few links below to a good blog post and a couple forum threads that discuss the issue and helped point me to a solution. In the blog post there's a comment about the URI specification and how Firefox seems to adhere to the specification - which doesn't really make sense for <img> tags.

Either way, it's silly that I had to go through this in order to prevent a (potentially expensive - depending on the page in question) needless page request. The AJAX extender controls have some nice behaviors that can really help out your UI development. But since these controls are fairly new, we should be mindful of potential side effects our sites may experience due to the fact that these controls probably have not been as rigorously tested as the standard ASP.Net controls have.



Posted on Friday, August 24, 2007 2:30 PM ASP.Net | Back to top

Comments on this post: How Firefox Handles Empty SRC tags

# re: How Firefox Handles Empty SRC tags
Requesting Gravatar...
We encountered this exact problem on a jsp page and reached the same conclusion using firebug. Yes we used the same hack to fix it, nice post and great description of the problem. I've shared this blog with a number of folks on our team.
Left by Robert Todd on Jan 31, 2008 2:07 PM

Comments have been closed on this topic.
Copyright © Blake Caraway | Powered by: