Closed Bug 445903 Opened 16 years ago Closed 16 years ago

Text in <head> makes body text appear (unstyled) while external CSS loads

Categories

(Core :: CSS Parsing and Computation, defect)

1.9.0 Branch
defect
Not set
minor

Tracking

()

RESOLVED DUPLICATE of bug 387669

People

(Reporter: digitalpacman, Unassigned)

References

Details

(Keywords: regression, testcase)

Attachments

(1 file, 2 obsolete files)

User-Agent:       Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; .NET CLR 1.1.4322; .NET CLR 2.0.50727; InfoPath.2)
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9) Gecko/2008052906 Firefox/3.0

NOTE: There are multiple cases where this happens, but I cannot pinpoint them all, but I know of one that is always reproducable.

When you have text before a link to a CSS file, either but <link> or @import, the CSS file will not be rendered until the page has finished processing. No other browser behaves this way.

This causes text-indent: -9999px for CSS layouts to show the text and then the text hides when the page finishes loading.

Reproducible: Always

Steps to Reproduce:
1. Create an HTML file
2. Create a CSS file
3. Put a definition of text-indent: -9999px in the CSS file
4. Put an HTML element that matches the CSS definition in the HTML file
5. Put straight text into the HTML document, directly one line before the link to the CSS file
6. Have a slow connection, or large CSS file OR
6a. Create a server side script that has a "pause for one second" command. Then prints the CSS definition. Also set the contentType to "text/css" or else FF3 won't render it either.
7. Load the HTML page
Actual Results:  
The text shows up in the HTML element, then dissapears after page load when the CSS is applied.

Expected Results:  
The browser should halt processing of the page while the CSS file is loaded, as it does with javascript files, and as does every other browser in existance.

Fresh new install with no addons of firefox 3.0

This has destroyed hundreds of designs my company has built.

Customers are complaining about "flashing text" that we can only solve on a case by case basis as they come to us. Costing us much money in support.
NOTE: This issue can be fixed if you move the CSS link definition above a javascript external link definition.

this is fine
<link href="">
<script src="">

<script src="">
this is broken
<link href="">
Attached file Example HTML file (obsolete) —
This is an example HTML file that can be used for testing
ASP file that waits for a short period, then prints the CSS definition for the example HTML file
An unintended consequence of bug 84582 or bug 387691, perhaps?  Note that if you use DOM Inspector, you'll see that the <link> is a child of <body> rather than <head> because of the text.
Severity: critical → minor
Component: General → Style System (CSS)
Product: Firefox → Core
QA Contact: general → style-system
Version: unspecified → 1.9.0 Branch
Attached file live testcase
Thanks for the clear testcase.  This version uses Hixie's delayed-file script.
Attachment #330150 - Attachment is obsolete: true
Attachment #330154 - Attachment is obsolete: true
I suspect that given the HTML parser behavior, this is the same layout issue as bug 387669.  (I found that bug by looking through the dependency list of bug 84582.)
Status: UNCONFIRMED → NEW
Depends on: 387669
Ever confirmed: true
Keywords: regression, testcase
Summary: Firefox 3 does not halt/stop page processing when external CSS is incountered → Text in <head> makes body text appear (unstyled) while external CSS loads
I'm using

Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.4; en-US; rv:1.9.1a1pre) Gecko/2008071716 Minefield/3.1a1pre
OS: Windows XP → All
Hardware: PC → All
(In reply to comment #5)
> Created an attachment (id=330183) [details]
> live testcase
> Thanks for the clear testcase.  This version uses Hixie's delayed-file script.

Your post doesn't work. It gives a security warning and doesn't show the problem happening. =(

If I was allowed too I would host the scripts myself but the company I work for won't let me.
Maybe that's because you have "Show a warning dialog when: I'm about to view an encrypted page that contains some unencrypted information" checked in Options>Security>Settings.  (Bugzilla uses https but Hixie does not.)  Anyway, you should be able to reproduce the bug with that testcase if you download it first.
Verified - It does show the bug correctly in FF.. thank you for the updated attachment
I disagree with this bug being moved to minor severity.

I mentioned in my original post it happens in many situations and this is a standard method of design that it breaks.

This is just the easiest way I have been able to reproduce it. My customers who are receiving the error do not have text in their <head> tag.

Here is an example of their head tag:

<head>
<META NAME="Description" CONTENT="">
<META NAME="Keywords" CONTENT="">
<title></title>
<meta name="robots" content="index,follow">
<meta name="GOOGLEBOT" content="INDEX, FOLLOW">
<script type="text/javascript" src""></script>
<!-- html comment -->
<link href="">
<style>
@import url()
</style>
</head>


This is a standard head tag that our customers use and we are receiving reports from multiple sources of this happening on slow connections.
Interesting that you can get buggy behavior without text in the <head>.  Can you make a reduced testcase based on that, using Hixie's delayed-file script?  Does DOM Inspector show the LINK and STYLE elements as being in the <head>?  If so, it might turn out to be a different bug.
I'll do what I can but it's that thing where people are telling me it's happening but I cannot make it happen myself because there is something else they are doing other than what is stated because they don't know they are doing it so... I cry... I'll repost my findings.
Ok I found out what the customer was doing. They have special code in their website that breaks the DOCTYPE (prints text before the DOCTYPE tag) in special conditions.

Confirmed that text before the <link> tag is the true problem.

Text can be out of the head tag, before the HTML tag.

So this falls into the category of an improperly defined document acting unexpectedly.
Text can be out of the head tag, before the HTML tag.

--> What I meant was the error will still occur no matter if the text is in the HEAD or not
Yeah, so this is a duplicate of bug 387669.
Status: NEW → RESOLVED
Closed: 16 years ago
Resolution: --- → DUPLICATE
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: