Open Bug 692754 Opened 13 years ago Updated 2 years ago

Combination of script with async flag and alert function stops the rendering of the page

Categories

(Core :: DOM: Core & HTML, defect, P5)

Product:
Core
Component:
DOM: Core & HTML
Platform:
x86
All
Type:
defect

Tracking

()

Status:
UNCONFIRMED

People

(Reporter: karolis.n, Unassigned)

Details

(Whiteboard: DUPEME) 

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_1) AppleWebKit/535.6 (KHTML, like Gecko) Chrome/16.0.899.0 Safari/535.6

Steps to reproduce:

Open a page containing a script tag with an async flag, e.g. <script src="test.js" async></script>, where test.js contains an alert("test"); There are also other resources on the page, e.g. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>

AN EXAMPLE OF SUCH FILE CAN BE FOUND HERE:
http://kidkarolis.github.com/ff_async_bug/


Actual results:

1. The alert popup shows "test".
2. Click OK.
3. Alert is closed.
4. Firefox shows the "Read ..."/"Loading ..." in the status, the page is blank, the page is never rendered.


Expected results:

1. The alert popup shows "test".
2. Click OK.
3. Alert is closed.
4. The page is rendered.
Sometimes it takes a few refreshes to reproduce the problem. Try clearing the cache if it doesn't happen. Might depend on internet connection speed, computer specs, etc.

Reproduced on
Firefox 7 Mac OS
Firefox 8 Mac OS
Firefox 5 Windows XP
My worry about this bug is that alert function is not the only function that can cause this hang. I've seen this happen when no alert was used in the script being loaded, but it's much harder to reproduce that case or find the root of cause. Alert function reproduces this bug more reliably.

If the async script is executed before the page finished rendering - the page hangs.
If the async script is executed after the page finished rendering - the page renders.
Confirmed on Mozilla/5.0 (Windows NT 5.1; rv:10.0a1) Gecko/20111007 Firefox/10.0a1 ID:20111007031227

User's test case:

<!DOCTYPE html>
<html>
  <head>
    <title>OpenTag failing to load</title>
    <script src='ff_async_bug.js' async defer></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
  </head>
  <body>

    This page never loads (in Firefox).
    document.readyState === "loading"
  </body>
</html>
OS: Mac OS X → All
Summary: Combination of script with async flag and alert function hangs the rendering of the page → Combination of script with async flag and alert function stops the rendering of the page
Version: 7 Branch → Trunk
Component: General → DOM
Product: Firefox → Core
QA Contact: general → general
Whiteboard: DUPEME
Maybe related to bug 637264.
I also checked this same bug with the following code:

<!DOCTYPE html>
<html>
    <head>
        <title>Exercise 1</title>
        <script type="text/javascript" async src="example1.js"></script>
        <script type="text/javascript" async src="example4.js"></script>
        <script type="text/javascript" src="example3.js"></script>
    </head>
    <body>
        <p>Hello world</p>
    </body>
</html>

//example1.js:
alert("I'm the example 1");

//example3.js
alert("I'm the example 3");

//example4.js
alert("I'm the example 4");

When I open the file which contains the above html code, the following occurs:

1) In first place, the script "example3.js" is executed, and then a pop-up with the text "I'm the example 3" appears. Afterwards, I click on OK button inside the pop-up window.

2) In second place, the script "example4.js" is executed, and then a pop-up with the text "I'm the example 4" appears. Afterwards, I click on OK button inside the pop-up window.

3) In third place, the script "example1.js" is executed, and then a pop-up with the text "I'm the example 1" appears. Afterwards, I click on OK button inside the pop-up window.

4) And finally, the body content should be displayed (he paragraph with the text "Hello World"), but it doesn't in Firefox, but in Chrome. In Firefox, the page load doesn't stop.
https://bugzilla.mozilla.org/show_bug.cgi?id=1472046

Move all DOM bugs that haven’t been updated in more than 3 years and has no one currently assigned to P5.

If you have questions, please contact :mdaly.
Priority: -- → P5
Component: DOM → DOM: Core & HTML
Severity: normal → S3
You need to log in before you can comment on or make changes to this bug.