views:

751

answers:

6

When I debug locally in fire fox 2.0x many times my page won't have the styles added properly or the page will not completely render (the end is seemingly cut off). Sometimes it takes multiple refreshes or shift-refreshes to fix this. Is this a common issue or is it just me? Any solutions?

I want to add that this is happening in fire fox 3.x to me as well. I add my javascript to the pages dynamically and this might be part of the issue. This is when I am working locally with Visual Studio.

Update: This does happen in IE but it happens much more often in Fire Fox. The issue seems to be only javascript and CSS files not loading. For example I get jQuery is not defined, $ is not defined etc. I don't think I have local IIS to test this on but from the server it always works perfectly. Fire Bug shows all my css and javascript files to be requested and received.

A: 

One thing to do would be to check the source of the page(s) in question. My guess would be that the local server that VS runs is not giving you the entire source of the page. One way to verify this would be to run exactly the same code in the debug environment, as well as from a "real" server like IIS 6. If the same behavior is seen on loading the page from both servers, as well as insuring that the full page source is being recieved by the browser(s), then it is a bug in Firefox and should be reported. This is especially true if other browsers, ie. IE, Chrome, Safari, Opera, render the page fully.

cdeszaq
+1: Do a view source in firefox (or use Firebug to show you the source), and verify that the web server is in fact sending the entire page. Then come back and update your question accordingly and people will be able to help more accurately
Orion Edwards
But why should this happen only in Firefox? How could the webserver distinguish? IMHO this must be a related browser problem.
splattne
@splattne - There are many ways a server could distinguish, but that is not the point. From the post, we do not know if other browsers work or not, simply that FF doesn't. From the given evidence, and how well FF typically works for most people, missing content from the server seems most likely.
cdeszaq
+2  A: 

This could be a problem with IPv6 and DNS of the Firefox browser. This issue is known to slow down Firefox on localhost:SOMEPORT. The effect would be that some external files won't load (css, js etc.) resulting in a partially rendered page.

You can solve this issue by simply deactivating IPv6 in Firefox:

  1. Insert about:config in the Firefox address bar
  2. Set network.dns.disableIPv6 to true or alternatively add localhost to network.dns.ipv4OnlyDomains

A different way to fix this issue, is to a remove the ipv6 address from your hosts file this way: open the file

C:\Windows\System32\drivers\etc\hosts

(with administrator privileges) and remove (or comment out #):

   :: localhost
splattne
Why -1? The slow down could prevent firefox loading css and js files etc.
splattne
Read here, similar issue: http://www.andreas-kraus.net/blog/fix-the-slow-firefox-when-using-localhost-with-visual-studio/
splattne
I don't know who downvoted this, but it is a known issue and likely the problem
John Sheehan
+1  A: 

Make sure that you narrow the scope of the problem. Does the problem just happen when debugging from VS or does it also happen with local IIS? With server-based IIS? Does it happen to other developers in your company? Is it really just FireFox or does it happen to Chrome, Opera, IE, etc?

Assuming that you've already worked that all out, I would suggest installing a FireFox plug-in called "Tamper Data". Open that and refresh the page. You'll see a record of every connection from the browser to the server (for each html file, image, css file, etc). Look to see if any of the them are very slow or not completing (perhaps one of those files is taking a long time and FF is waiting for it to finish before loading other important files).

Assuming that all of the files correctly loads, you should consider checking that the syntax is valid (maybe there is some unclosed tag or quotation mark that is causing FF confusion). I use a plugin called "Web Developer", but there are a lot of other options out there.

You could also use a plugin called FireBug to view the HTML behind various parts of the page to see if there are any noticeable problems. You start FireBug, go to the HTML tab, click Inpsect, and move your mouse over something on the page, and it will show you the HTML behind it.

Mitchell Gilman
A: 

Are you comparing what you see in Firefox to what is displayed in the Visual Studio designer? If this is the case, then they are using 2 different methods to render the html and may not display the same.

Eppz
A: 

Anything further on this folks?

I have examined the traffic using Firebug and it appears that when veiwing the response from the request for a style sheet, the response is just blank. After refreshing (sometimes multiple times) the age displays correctly and the response information contains the style sheet. I have not seen this in any other browser and it only occurs when viewing the app from Visual Studio.

A: 

2! Recently i had the same problem. Im using MVC 1.0 and I added a new stylesheet into Views/Share folder. And when i run the project, the page didnt render along with the css. If your web project is a MVC one so try put the css file into the Content folder. Hope this help. HaiVu.Doan.