Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Script-blocking style sheet tests #14899

Merged
merged 5 commits into from
Jan 17, 2019
Merged

Script-blocking style sheet tests #14899

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
b4de314
Add some link style sheet loading tests
domfarolino Jan 16, 2019
c6e99d7
Remove DCL test
domfarolino Jan 16, 2019
8704b7a
Add corresponding link error event
domfarolino Jan 17, 2019
32ee744
Address review for style changes
domfarolino Jan 17, 2019
d2d702a
Used unreached_func, and remove extraneous onerror handler
domfarolino Jan 17, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 25 additions & 0 deletions ...ntics/document-metadata/the-link-element/link-error-fired-before-scripting-unblocked.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
<!DOCTYPE html>
<link rel="author" title="Dom Farolino" href="mailto:[email protected]">
<link rel="help" href="https://html.spec.whatwg.org/multipage/links.html#link-type-stylesheet">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script>
var saw_link_onerror = false;
var t = async_test("Check if the stylesheet's error event is fired before the " +
"pending parsing-blocking script is unblocked");
</script>
<link href="nonexistent.css" rel="stylesheet" id="style_test"
onload="t.step(function() { assert_unreached('Sheet should fail to load'); });"
onerror="t.step(function() { saw_link_onerror = true; });">
<script>
t.step(function() {
assert_true(saw_link_onerror, "The pending parsing-blocking script should " +
"only run after the last element that " +
"contributes a script-blocking style " +
"sheet's error event is fired if the sheet " +
"fails to load.");
});
t.done();
</script>
</head>
</html>
24 changes: 24 additions & 0 deletions ...antics/document-metadata/the-link-element/link-load-fired-before-scripting-unblocked.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
<!DOCTYPE html>
<link rel="author" title="Dom Farolino" href="mailto:[email protected]">
<link rel="help" href="https://html.spec.whatwg.org/multipage/links.html#link-type-stylesheet">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script>
var saw_link_onload = false;
var t = async_test("Check if the stylesheet's load event is fired before the " +
"pending parsing-blocking script is unblocked");
</script>
<link href="style.css?pipe=trickle(d3)" rel="stylesheet" id="style_test"
onload="t.step(function() { saw_link_onload = true; });"
onerror="t.step(function() { assert_unreached('Sheet should load OK'); });"></link>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can use t.unreached_func('Sheet should load OK') if you want

<script>
t.step(function() {
assert_true(saw_link_onload, "The pending parsing-blocking script should " +
"only run after the last element that " +
"contributes a script-blocking style " +
"sheet's load event is fired.");
});
t.done();
</script>
</head>
</html>
3 changes: 3 additions & 0 deletions html/semantics/document-metadata/the-link-element/resources/neutral.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
body {
background-color: gray;
}
30 changes: 30 additions & 0 deletions ...ocument-metadata/the-link-element/stylesheet-not-removed-until-next-stylesheet-loads.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
<!DOCTYPE html>
<link rel="author" title="Dom Farolino" href="mailto:[email protected]">
<link rel="help" href="https://html.spec.whatwg.org/multipage/links.html#link-type-stylesheet">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script>
var t = async_test("Check that the style sheet loaded by an <link> element " +
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's unclear why this is an async_test.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good point; mostly that was copy paste

"is available to scripts until its successor is completely loaded");
</script>
<link href="style.css?pipe=trickle(d3)" rel="stylesheet" id="style_test"
onerror="t.step(function() { assert_unreached('Sheet should load OK'); });"></link>
<script>
t.step(function() {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You might as well join these all into one t.step()

assert_true(document.styleSheets.length === 1 &&
document.styleSheets[0].href.includes("style.css"),
"The style sheet 'style.css' is not available to scripts");
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Generally, the assertion messages should be stated as things that should happen (like in your other tests), not as things that should not happen. This is inconsistent across WPT but especially for code readers I think it's the right thing to do.

});

style_test.href = "resources/neutral.css?pipe=trickle(d3)";
t.step(function() {
assert_true(document.styleSheets.length === 1 &&
document.styleSheets[0].href.includes("style.css"),
"The style sheet 'style.css' was removed from " +
"document.styleSheets before the next style sheet to replace " +
"it has finished loading");
t.done();
});
</script>
</head>
</html>