Bug Tracker

Opened 12 years ago

Closed 12 years ago

Last modified 9 years ago

#9675 closed bug (cantfix)

jQuery causes a second HTTP GET request on @font-face files on Firefox

Reported by: jdhoek Owned by: jdhoek
Priority: low Milestone: 1.next
Component: misc Version: 1.6.1
Keywords: Cc:
Blocked by: Blocking:


I'll start by noting that this is a very confusing bug, so my apologies if jQuery turns out not to be responsible at all.

The past few days I've trying to debug troublesome behaviour observed in Firefox (4 and 5 at least). It boils down to this: when I load fonts via the @font-face mechanism, Firefox requests the WOFF font-files. As soon as I add jQuery to the HMTL page, Firefox request them a second time after the DOMContentLoaded event, causing a nasty redrawing of the fonts on screen.

I have created a zip-archive with all the files needed to reproduce this issue:

  • A HTML file "twice.html" that loads jQuery and links to a simple stylesheet "stylesheet.css" which loads a (free software) font.
  • A HTML file "once.html" which does the same, but includes the CSS in the file itself.

The double request issue only occurs with the external stylesheet. When the same CSS is included directly in the HTML file (at least the @font-face part), the issue does not occur.

I can observe the font-file being requested twice by looking at Firebug's net panel.

Additional information:

  • Behaviour is the same for Firefox 5 on Ubuntu 11.04 and Windows 7.
  • Removing jQuery from the HTML file makes the issue go away.
  • Placing the @font-face declaration inside the HTML file (not in an external stylesheet) makes the issue go away.

jQuery may not be responsible at all, but I can't think of another actor that would cause such a second request after the DOMContentLoaded event. Any insights and tips would be greatly appreciated.

Change History (7)

comment:1 Changed 12 years ago by jdhoek

I can't seem to attach any files, so here are the relevant files:


Firebug's Net panel showing the behaviour:

comment:2 Changed 12 years ago by anonymous

I have uploaded the reproduction case itself as well:


This webhost is not very fast, and the issue does occur, but here the first request to the font-file gets aborted, after which the second one happens.

comment:3 Changed 12 years ago by [email protected]


I can confirm, that I have exactly the same problem too with a new website I'm currently coding. Using jQuery 1.6 + font-face too.

Firebug tells me the same font file is downloaded twice and I see an ugly flicker.

Cheers, Michael

comment:4 Changed 12 years ago by Rick Waldron

Component: unfiledmisc
Owner: set to jdhoek
Status: newpending

Thanks for taking the time to contribute to the jQuery project! Please provide a reduced jsFiddle test case to help us assess your ticket!

Additionally, be sure to test against the jQuery Edge version to ensure the issue still exists. To get you started, I've created this boilerplate: http://jsfiddle.net/rwaldron/da3nM/ Open the link and click to "Fork" in the top menu.

Have you tried omitting jQuery and writing a vanilla DOMContentLoaded handler?

Last edited 12 years ago by Rick Waldron (previous) (diff)

comment:5 in reply to:  4 Changed 12 years ago by jdhoek

Status: pendingnew

Replying to rwaldron:

Have you tried omitting jQuery and writing a vanilla DOMContentLoaded handler?

I have now, and I can reproduce the double loading bug in Firefox this way. This puts jQuery in the clear, so this bug is not a jQuery bug, but a Firefox bug.

Replying to michael.heuberger: Can you reproduce this issue with a simple DOMContentLoaded handler as well?

I filed the bug over at Mozilla: https://bugzilla.mozilla.org/show_bug.cgi?id=668178

comment:6 Changed 12 years ago by timmywil

Keywords: browser-firefox added
Priority: undecidedlow
Resolution: cantfix
Status: newclosed

Thanks for looking into it.

comment:7 Changed 9 years ago by miketaylr

Keywords: browser-firefox removed

Just removing the browser-firefox keyword here because the actual issue turned out to be a Firebug bug.

Note: See TracTickets for help on using tickets.