Closed
Bug 436261
Opened 17 years ago
Closed 17 years ago
[CSSLoader] CSS @import fails in style sheet dynamically added and then changed from persistent to preferred
Categories
(Core :: CSS Parsing and Computation, defect)
Core
CSS Parsing and Computation
Tracking
()
RESOLVED
FIXED
People
(Reporter: hiramegl, Assigned: bzbarsky)
References
Details
Attachments
(6 files, 1 obsolete file)
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9) Gecko/2008051206 Firefox/3.0
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9) Gecko/2008051206 Firefox/3.0
Is possible to load a css document using this code:
var el = document.createElement("link");
el.type = "text/css";
el.rel = "stylesheet";
el.href = uri;
var h = document.getElementsByTagName("HEAD")[0];
h.appendChild(el);
but if that document (the one in "uri") contains a line (the first line) like:
@import url( "anotherfile.css" );
then "anotherfile.css" will not be imported.
Reproducible: Always
Steps to Reproduce:
1. create a css and include an import
2. create an html with the javascript code mentioned above
3. load the html
Actual Results:
the imported file will not be loaded
Expected Results:
the imported file would be loaded
Updated•17 years ago
|
Component: General → Style System (CSS)
Product: Firefox → Core
QA Contact: general → style-system
Summary: Not possible to import CSS files through JS code → CSS @import fails if the stylesheet is added to the document using JS
Sounds like we're either having trouble resolving relative URLs or resolving them relative to something other than what's expected. Do you have a testcase you could attach to the bug or a URL for one?
Hi David,
Trying to create a small testcase I couldn't reproduce the problem. It might be a problem with my css rules. I will continue checking where the problem in my code is. Thanks for your answer!
Status: UNCONFIRMED → RESOLVED
Closed: 17 years ago
Resolution: --- → INVALID
Hi again,
I manage to reproduce the problem. It happens when setting the "title" property of the element.
index.html: ****************************************
<html>
<head>
<title>import css</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<script type="text/javascript">
var el = document.createElement("link");
el.type = "text/css";
el.rel = "stylesheet";
el.href = "test1.css";
var h = document.getElementsByTagName("HEAD")[0];
h.appendChild(el);
el.title = "theme"; // comment this line to make the test work!
</script>
<p>test</p>
</body>
</html>
test1.css ****************************************
@import url( "test2.css" );
body {
background-color: gray;
}
test2.css *****************************************
p {
background-color: red;
}
Status: RESOLVED → UNCONFIRMED
Resolution: INVALID → ---
Setting the title attribute makes it a preferred or alternate style sheet. Only one style sheet title can be selected at once; that's how alternate style sheets work. (The rel="alternate stylesheet" vs rel="stylesheet" is only a hint as to which title should be initially selected, but doesn't allow you to break the rule that only one title can be selected at once.)
Marking as duplicate of an invalid bug.
Status: UNCONFIRMED → RESOLVED
Closed: 17 years ago → 17 years ago
Resolution: --- → DUPLICATE
(That said, if it happens in the really simple example above with no other style sheets, it would be a bug, but I'm guessing that you simplified the HTML and there's another style sheet with a title. If it's the former, then feel free to reopen and attach the testcase using "Create an attachment".)
Attachment #323089 -
Attachment is obsolete: true
Sorry, I do see the bug with the HTML you pasted; sorry for assuming that you'd cut it down further beyond what demonstrated the bug.
Status: RESOLVED → UNCONFIRMED
Resolution: DUPLICATE → ---
Summary: CSS @import fails if the stylesheet is added to the document using JS → CSS @import fails in preferred stylesheet that is added dynamically
Summary: CSS @import fails in preferred stylesheet that is added dynamically → CSS @import fails in style sheet dynamically changed from persistent to preferred
So I've further found that:
* if I set the title before adding the link element to the document, the bug doesn't happen
* if I just set the title on a link element that's already in the document, the bug doesn't happen
Status: UNCONFIRMED → NEW
Ever confirmed: true
Summary: CSS @import fails in style sheet dynamically changed from persistent to preferred → CSS @import fails in style sheet dynamically added and then changed from persistent to preferred
Steps to reproduce: load attachment 323090 [details]
Expected results: background of body is gray, background of p is red
Actual results: background of body is gray, but background of p is NOT red
And I'm seeing this in a mozilla-central debug build on Linux.
OS: Windows XP → All
Hardware: PC → All
![]() |
Assignee | |
Comment 14•17 years ago
|
||
It looks like this regressed between 2005-12-09-06 and 2005-12-10-06. Bonsai range:
http://bonsai.mozilla.org/cvsquery.cgi?treeid=default&module=MozillaTinderboxAll&branch=HEAD&branchtype=match&dir=&file=&filetype=match&who=&whotype=match&sortby=Date&hours=2&date=explicit&mindate=2005-12-09+06&maxdate=2005-12-10+06&cvsroot=%2Fcvsroot
Presumably a regression from bug 303313.
Blocks: 303313
![]() |
Assignee | |
Comment 15•17 years ago
|
||
![]() |
Assignee | |
Comment 16•17 years ago
|
||
This testcase doesn't trigger the bug on branch because we block the parser for CSS loads.
![]() |
Assignee | |
Comment 17•17 years ago
|
||
The basic problem is that when the bug appears we're cloning a not-yet-fully-parsed stylesheet. The thing is, cloning will clone the child sheets (which aren't there yet in this case), and clone the @import rule... but when the import rule finishes loading the child sheet it's only inserted into the parent sheet of the rule. In this case, the first sheet.
In reporter's testcase, that first sheet has been dropped altogether; in the other two testcases I posted it just has media="print" so it's not applied.
This is basically a manifestation of bug 183348. It's also basically a duplicate of bug 290018, but this bug has a much clearer testcase and such, so I'd prefer to keep it separate.
Summary: CSS @import fails in style sheet dynamically added and then changed from persistent to preferred → [CSSLoader] CSS @import fails in style sheet dynamically added and then changed from persistent to preferred
![]() |
Assignee | |
Comment 19•17 years ago
|
||
Fixed by checkin for bug 183348.
Assignee: nobody → bzbarsky
Status: NEW → RESOLVED
Closed: 17 years ago → 17 years ago
Flags: in-testsuite+
Resolution: --- → FIXED
You need to log in
before you can comment on or make changes to this bug.
Description
•