summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/html/semantics/document-metadata
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
commit26a029d407be480d791972afb5975cf62c9360a6 (patch)
treef435a8308119effd964b339f76abb83a57c29483 /testing/web-platform/tests/html/semantics/document-metadata
parentInitial commit. (diff)
downloadfirefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz
firefox-26a029d407be480d791972afb5975cf62c9360a6.zip
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/html/semantics/document-metadata')
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/conditionally-block-rendering-on-link-media-attr.html27
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/dynamic-render-blocking-link-stylesheet-does-not-block-script.html21
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/dynamic-render-blocking-style-element-does-not-block-script.html21
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/link-stylesheet-with-non-match-media-does-not-block-render.tentative.html21
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/script-created-link-stylesheet-does-not-block-script.html20
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/script-created-style-element-does-not-block-script.html20
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/style-element-media-match-block-script.html17
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/style-element-media-not-match-does-not-block-script.html17
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/stylesheet.py10
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/support/link-style.css3
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/support/utils.js20
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/styling/LinkStyle.html88
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/styling/support/alternate.css7
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/styling/support/emptytitle.css4
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/styling/support/normal.css5
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/styling/support/notitle.css4
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/styling/support/unmatch.css4
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base-data.html32
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base-javascript.html32
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_about_blank.html19
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_empty.html29
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_invalid.html12
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_specified.html33
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_unspecified.html30
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_multiple.html29
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_srcdoc.html19
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_target_does_not_affect_iframe_src_navigation.html10
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_target_does_not_affect_location_assignment.html10
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-base-element/example.html7
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-base-element/example2.html5
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/all3
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/all.headers1
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/document-without-browsing-context.html35
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-error-fired-before-scripting-unblocked.html25
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-error-events.html6
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-error-events.https.html6
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-event.html17
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-fired-before-scripting-unblocked.html24
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-multiple-error-events.html21
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-multiple-load-events.html21
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rel-attribute-ascii-case-insensitive-notref.html5
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rel-attribute-ascii-case-insensitive.html22
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rel-attribute.html44
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rellist.html25
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-style-error-01.html37
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-style-error-limited-quirks.html7
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-style-error-quirks.html7
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-type-attribute-ref.html3
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-type-attribute.html9
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/bad.css4
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/css.py7
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/empty-href.css3
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/good.css3
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/link-load-error-events.sub.js192
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/link-rel-attribute.css3
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/link-style-error.js47
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/neutral.css3
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/stylesheet.css3
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/style.css3
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-change-href-ref.html8
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-change-href.html13
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-empty-href-ref.html9
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-empty-href.html12
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-media-ref.html9
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-media.html17
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-not-removed-until-next-stylesheet-loads.html22
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-with-base-ref.html11
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-with-base.html11
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet.css3
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet.py9
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-attribute-changes.html35
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-empty-content-value.html14
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-first-valid-applies.html16
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-insert.html26
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-no-content-value.html14
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-normal-descendant-change.html20
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-remove-head.html17
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-remove.html19
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-single-value-in-body.html12
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-single-value-in-head.html10
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-single-value-in-shadow-tree.html22
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/support/compute-root-color-scheme.js28
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/http-equiv-and-name-1.html23
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/http-equiv-and-name-2.html13
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/allow-scripts-flag-changing-1.html57
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/allow-scripts-flag-changing-2.html55
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/dynamic-append.html31
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/not-in-shadow-tree.html38
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/parsing.html147
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/remove-from-document.html37
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/;url=foo1
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/__dir__.headers1
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/foo1
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/foo'bar1
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/refresh.py4
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/refresh.sub.html1
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/ufoo1
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/urfoo1
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/url foo1
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/urlfoo1
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/x;url=foo1
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-lower.html5
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-message.js1
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-mixed.html5
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-other.html5
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive.html32
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/the-lang-attribute-012.html51
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/historical.html14
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/html_style_in_comment-ref.html18
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/html_style_in_comment.xhtml18
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/mutations.window.js48
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style-error-01.html32
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style-load-after-mutate.html16
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_disabled.html39
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_events.html36
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_load_async.html25
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_load_event.html28
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_media.html40
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_media_change.html43
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_non_matching_media.html20
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_type_change.html39
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_type_html.html71
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_type_svg.svg75
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/support/css-red.txt1
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/update-style-block-ascii-case-insensitive-ref.html9
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-style-element/update-style-block-ascii-case-insensitive.html16
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-01.html25
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-02.xhtml30
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-03.html32
-rw-r--r--testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-04.xhtml37
130 files changed, 2745 insertions, 0 deletions
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/conditionally-block-rendering-on-link-media-attr.html b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/conditionally-block-rendering-on-link-media-attr.html
new file mode 100644
index 0000000000..d21df46d30
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/conditionally-block-rendering-on-link-media-attr.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="support/utils.js"></script>
+
+<link rel=stylesheet href=stylesheet.py>
+<link rel=stylesheet media="screen and (max-width:10px)" href=stylesheet.py?stylesNotMatchingEnvironment&delay=2>
+<h1>Dominic Farolino</h1>
+<script>
+ test(() => {
+ const h1 = document.querySelector('h1');
+ const computedColor = getComputedStyle(h1).color;
+ const expectedColor = "rgb(128, 0, 128)";
+
+ assert_equals(computedColor, expectedColor);
+ assert_true(styleExists("h1 { color: purple; }")); // first style sheet
+ assert_false(styleExists("h1 { color: brown; }")); // second style sheet (should not be loaded yet)
+ }, "Only the style sheet loaded via a link element whose media attribute matches the environment should block following script execution");
+
+ const secondStylesheetTest = async_test("Both style sheets loaded via the link elements should be registered as style sheets for the document after 2 seconds");
+ secondStylesheetTest.step_timeout(() => {
+ assert_true(styleExists("h1 { color: purple; }")); // first style sheet
+ assert_true(styleExists("h1 { color: brown; }")); // second style sheet (loaded now!)
+ secondStylesheetTest.done();
+ }, 3000);
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/dynamic-render-blocking-link-stylesheet-does-not-block-script.html b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/dynamic-render-blocking-link-stylesheet-does-not-block-script.html
new file mode 100644
index 0000000000..bcc98050ac
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/dynamic-render-blocking-link-stylesheet-does-not-block-script.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<title>Script-created render-blocking link stylesheet is not script-blocking</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/utils.js"></script>
+<script>
+const link = document.createElement('link');
+link.rel = 'stylesheet';
+link.href = 'stylesheet.py?delay=1';
+link.blocking = 'render';
+document.head.appendChild(link);
+</script>
+<h1>Some text</h1>
+<script>
+test(() => {
+ assert_false(styleExists("h1 { color: purple; }"),
+ 'stylesheet should still be pending');
+ const h1 = document.querySelector('h1');
+ assert_equals(getComputedStyle(h1).color, 'rgb(0, 0, 0)');
+});
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/dynamic-render-blocking-style-element-does-not-block-script.html b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/dynamic-render-blocking-style-element-does-not-block-script.html
new file mode 100644
index 0000000000..9a8c4b466b
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/dynamic-render-blocking-style-element-does-not-block-script.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<title>Script-created render-blocking style element is not script-blocking</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/utils.js"></script>
+<script>
+const style = document.createElement('style');
+const sheet = document.createTextNode('@import url(stylesheet.py?delay=1);');
+style.appendChild(sheet);
+style.blocking = 'render';
+document.head.appendChild(style);
+</script>
+<h1>Some text</h1>
+<script>
+test(() => {
+ assert_false(styleExists("h1 { color: purple; }"),
+ 'stylesheet should still be pending');
+ const h1 = document.querySelector('h1');
+ assert_equals(getComputedStyle(h1).color, 'rgb(0, 0, 0)');
+});
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/link-stylesheet-with-non-match-media-does-not-block-render.tentative.html b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/link-stylesheet-with-non-match-media-does-not-block-render.tentative.html
new file mode 100644
index 0000000000..7a881bcc3d
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/link-stylesheet-with-non-match-media-does-not-block-render.tentative.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<title>
+ Delayed Stylesheet imported using link tag should not block rendering
+ or JS execution when media doesn't match.
+</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/utils.js"></script>
+<link rel="stylesheet" href="support/link-style.css?pipe=trickle(d1)"
+ media="print" onload="this.media='all'">
+<h1>
+ This text is black in color till stylesheet is fetched.
+</h1>
+<script>
+test(() => {
+ assert_false(styleExists("h1 { color: purple; }"),
+ 'Stylesheet should still be pending due to delay');
+ const h1 = document.querySelector('h1');
+ assert_equals(getComputedStyle(h1).color, 'rgb(0, 0, 0)');
+});
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/script-created-link-stylesheet-does-not-block-script.html b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/script-created-link-stylesheet-does-not-block-script.html
new file mode 100644
index 0000000000..2c27bd32f9
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/script-created-link-stylesheet-does-not-block-script.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<title>Script-created link stylesheet is not script-blocking</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/utils.js"></script>
+<script>
+const link = document.createElement('link');
+link.rel = 'stylesheet';
+link.href = 'stylesheet.py?delay=1';
+document.head.appendChild(link);
+</script>
+<h1>Some text</h1>
+<script>
+test(() => {
+ assert_false(styleExists("h1 { color: purple; }"),
+ 'stylesheet should still be pending');
+ const h1 = document.querySelector('h1');
+ assert_equals(getComputedStyle(h1).color, 'rgb(0, 0, 0)');
+});
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/script-created-style-element-does-not-block-script.html b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/script-created-style-element-does-not-block-script.html
new file mode 100644
index 0000000000..f04c3f668f
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/script-created-style-element-does-not-block-script.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<title>Script-created style element is not script-blocking</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/utils.js"></script>
+<script>
+const style = document.createElement('style');
+const sheet = document.createTextNode('@import url(stylesheet.py?delay=1);');
+style.appendChild(sheet);
+document.head.appendChild(style);
+</script>
+<h1>Some text</h1>
+<script>
+test(() => {
+ assert_false(styleExists("h1 { color: purple; }"),
+ 'stylesheet should still be pending');
+ const h1 = document.querySelector('h1');
+ assert_equals(getComputedStyle(h1).color, 'rgb(0, 0, 0)');
+});
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/style-element-media-match-block-script.html b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/style-element-media-match-block-script.html
new file mode 100644
index 0000000000..17adfc1728
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/style-element-media-match-block-script.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<title>Style element is script-blocking when media matches</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/utils.js"></script>
+<style>
+@import url('stylesheet.py?delay=1');
+</style>
+<h1>Some text</h1>
+<script>
+test(() => {
+ assert_true(styleExists("h1 { color: purple; }"),
+ 'script should be blocked until the stylesheet is loaded');
+ const h1 = document.querySelector('h1');
+ assert_equals(getComputedStyle(h1).color, 'rgb(128, 0, 128)');
+});
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/style-element-media-not-match-does-not-block-script.html b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/style-element-media-not-match-does-not-block-script.html
new file mode 100644
index 0000000000..c05b6ed945
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/style-element-media-not-match-does-not-block-script.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<title>Style element is not script-blocking when media doesn't match</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/utils.js"></script>
+<style media="print">
+@import url('stylesheet.py?delay=1');
+</style>
+<h1>Some text</h1>
+<script>
+test(() => {
+ assert_false(styleExists("h1 { color: purple; }"),
+ 'stylesheet should still be pending');
+ const h1 = document.querySelector('h1');
+ assert_equals(getComputedStyle(h1).color, 'rgb(0, 0, 0)');
+});
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/stylesheet.py b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/stylesheet.py
new file mode 100644
index 0000000000..d5ae5b9cca
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/stylesheet.py
@@ -0,0 +1,10 @@
+from time import sleep
+def main(request, response):
+ if b"delay" in request.GET:
+ delay = int(request.GET[b"delay"])
+ sleep(delay)
+
+ if b"stylesNotMatchingEnvironment" in request.GET:
+ return u'h1 {color: brown;}'
+ else:
+ return u'h1 {color: purple;}'
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/support/link-style.css b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/support/link-style.css
new file mode 100644
index 0000000000..1024df8792
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/support/link-style.css
@@ -0,0 +1,3 @@
+h1 {
+ color: purple;
+}
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/support/utils.js b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/support/utils.js
new file mode 100644
index 0000000000..02d3a095cd
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/interactions-of-styling-and-scripting/support/utils.js
@@ -0,0 +1,20 @@
+function styleExistsInSheet(styleText, sheet) {
+ for (let rule of sheet.cssRules) {
+ if (styleText == rule.cssText)
+ return true;
+ if (rule instanceof CSSImportRule) {
+ if (rule.styleSheet && styleExistsInSheet(styleText, rule.styleSheet))
+ return true;
+ }
+ }
+ return false;
+}
+
+function styleExists(styleText) {
+ for (let sheet of document.styleSheets) {
+ if (styleExistsInSheet(styleText, sheet))
+ return true;
+ }
+ return false;
+}
+
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/styling/LinkStyle.html b/testing/web-platform/tests/html/semantics/document-metadata/styling/LinkStyle.html
new file mode 100644
index 0000000000..d1bb433520
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/styling/LinkStyle.html
@@ -0,0 +1,88 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <title>HTML Test: Styling</title>
+ <link rel="author" title="Intel" href="http://www.intel.com/">
+ <link rel="help" href="https://html.spec.whatwg.org/multipage/#styling">
+ <link id="style1" rel="text" title="Intel" href="./support/unmatch.css">
+ <link id="style2" rel="alternate stylesheet" type="text/css" title="" href="./support/emptytitle.css">
+ <link id="style3" rel="alternate stylesheet" type="text/css" href="./support/notitle.css">
+ <link id="style5" rel="stylesheet" type="text/css" href="./support/normal.css">
+ <link id="style6" rel="alternate stylesheet" type="text/css" href="./support/normal.css" title="./support/alternate.css">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <style id="style4" type="text/html">
+ #test {
+ height: 100px;
+ width: 100px;
+ }
+ </style>
+ <style id="style7" type="text/css" media="all" title="./support/alternate.css">
+ #test {
+ background-color: green;
+ }
+ </style>
+ </head>
+ <body>
+ <div id="log"></div>
+ <div id="test" style="display:none">STYLING TEST</div>
+
+ <script>
+ /**
+ * Browsers may incorrectly issue requests for these resources and defer
+ * definition of the `sheet` attribute until after loading is complete.
+ * In such cases, synchronous assertions regarding the absence of
+ * attributes will spuriously pass.
+ *
+ * In order to account for this incorrect behavior (exhibited at the time
+ * of this writing most notably by the Chromium browser), defer the
+ * assertions until the "load" event has been triggered.
+ */
+ async_test(function(t) {
+ window.addEventListener("load", t.step_func(function() {
+ var style = null,
+ i;
+ for (i = 1; i < 5; i++) {
+ style = document.getElementById("style" + i);
+ assert_equals(style.sheet, null, "The sheet attribute of style" + i + " should be null.");
+ assert_false(style.disabled, "The disabled attribute of style" + i + " should be false.");
+ }
+ t.done();
+ }));
+ }, "The LinkStyle interface's sheet attribute must return null; the disabled attribute must be false");
+
+ test(function() {
+ var style = document.createElement("style"),
+ link = document.createElement("link");
+ assert_equals(style.sheet, null, "The sheet attribute of the style element not in a document should be null.");
+ assert_equals(link.sheet, null, "The sheet attribute of the link element not in a document should be null.");
+ }, "The LinkStyle interface's sheet attribute must return null if the corresponding element is not in a Document");
+
+ async_test(function(t) {
+ window.addEventListener("load", t.step_func(function() {
+ var style = null,
+ i;
+ for (i = 5; i < 8; i++) {
+ style = document.getElementById("style" + i);
+ assert_true(style.sheet instanceof StyleSheet, "The sheet attribute of style" + i + " should be a StyleSheet object.");
+ assert_equals(style.disabled, style.sheet.disabled, "The disabled attribute of style" + i + " should equal to the same attribute of StyleSheet.");
+ }
+ t.done();
+ }));
+ }, "The LinkStyle interface's sheet attribute must return StyleSheet object; the disabled attribute must be same as the StyleSheet's disabled attribute");
+
+ test(function() {
+ assert_equals(document.getElementById("style2").title, "", "The title attribute of style2 is incorrect.");
+ assert_equals(document.getElementById("style5").title, "", "The title attribute of style5 is incorrect.");
+ assert_equals(document.getElementById("style6").title, "./support/alternate.css", "The title attribute of style6 is incorrect.");
+ assert_equals(document.getElementById("style7").title, "./support/alternate.css", "The title attribute of style7 is incorrect.");
+ }, "The title must be the same as the value of the element's title content attribute");
+
+ test(function() {
+ assert_equals(document.getElementById("style5").media, "", "The media attribute of style5 is incorrect.");
+ assert_equals(document.getElementById("style7").media, "all", "The media attribute of style7 is incorrect.");
+ }, "The media must be the same as the value of the element's media content attribute, or the empty string if it is omitted");
+ </script>
+ </body>
+</html>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/styling/support/alternate.css b/testing/web-platform/tests/html/semantics/document-metadata/styling/support/alternate.css
new file mode 100644
index 0000000000..b8deb07b0a
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/styling/support/alternate.css
@@ -0,0 +1,7 @@
+#test {
+ color: yellow;
+ background-color: blue;
+ width: 100px;
+ height: 50px;
+ font-size: .5em;
+}
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/styling/support/emptytitle.css b/testing/web-platform/tests/html/semantics/document-metadata/styling/support/emptytitle.css
new file mode 100644
index 0000000000..e62fe701b3
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/styling/support/emptytitle.css
@@ -0,0 +1,4 @@
+#test {
+ width: 100px;
+ height: 100px;
+}
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/styling/support/normal.css b/testing/web-platform/tests/html/semantics/document-metadata/styling/support/normal.css
new file mode 100644
index 0000000000..a803c22112
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/styling/support/normal.css
@@ -0,0 +1,5 @@
+#test {
+ width: 100px;
+ height: 50px;
+ font-size: 10px;
+}
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/styling/support/notitle.css b/testing/web-platform/tests/html/semantics/document-metadata/styling/support/notitle.css
new file mode 100644
index 0000000000..e62fe701b3
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/styling/support/notitle.css
@@ -0,0 +1,4 @@
+#test {
+ width: 100px;
+ height: 100px;
+}
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/styling/support/unmatch.css b/testing/web-platform/tests/html/semantics/document-metadata/styling/support/unmatch.css
new file mode 100644
index 0000000000..e62fe701b3
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/styling/support/unmatch.css
@@ -0,0 +1,4 @@
+#test {
+ width: 100px;
+ height: 100px;
+}
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base-data.html b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base-data.html
new file mode 100644
index 0000000000..4905dd84ca
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base-data.html
@@ -0,0 +1,32 @@
+<!-- Please update base-javascript.html together with this -->
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>&lt;base> and data: URLs</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<base href="data:/,test">
+<base href="https://example.com/">
+<div id=log></div>
+<script>
+test(() => {
+ const link = document.createElement("a");
+ link.href = "blah";
+ assert_equals(link.href, new URL("blah", document.URL).href);
+}, "First <base> has a data: URL so fallback is used");
+
+test(() => {
+ document.querySelector("base").remove();
+ const link = document.createElement("a");
+ link.href = "blah";
+ assert_equals(link.href, new URL("blah", "https://example.com/").href);
+}, "First <base> is removed so second is used");
+
+test(() => {
+ const base = document.createElement("base");
+ base.href = "data:/,more-test";
+ document.head.prepend(base);
+ const link = document.createElement("a");
+ link.href = "blah";
+ assert_equals(link.href, new URL("blah", document.URL).href);
+}, "Dynamically inserted first <base> has a data: URL so fallback is used");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base-javascript.html b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base-javascript.html
new file mode 100644
index 0000000000..65d9c84fcf
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base-javascript.html
@@ -0,0 +1,32 @@
+<!-- Please update base-data.html together with this -->
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>&lt;base> and javascript: URLs</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<base href="javascript:/,test">
+<base href="https://example.com/">
+<div id=log></div>
+<script>
+test(() => {
+ const link = document.createElement("a");
+ link.href = "blah";
+ assert_equals(link.href, new URL("blah", document.URL).href);
+}, "First <base> has a javascript: URL so fallback is used");
+
+test(() => {
+ document.querySelector("base").remove();
+ const link = document.createElement("a");
+ link.href = "blah";
+ assert_equals(link.href, new URL("blah", "https://example.com/").href);
+}, "First <base> is removed so second is used");
+
+test(() => {
+ const base = document.createElement("base");
+ base.href = "javascript:/,more-test";
+ document.head.prepend(base);
+ const link = document.createElement("a");
+ link.href = "blah";
+ assert_equals(link.href, new URL("blah", document.URL).href);
+}, "Dynamically inserted first <base> has a javascript: URL so fallback is used");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_about_blank.html b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_about_blank.html
new file mode 100644
index 0000000000..54c4794549
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_about_blank.html
@@ -0,0 +1,19 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>base element in about:blank document should resolve against its fallback base URI</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<iframe></iframe>
+<script>
+var t = async_test();
+addEventListener("load", t.step_func_done(function() {
+ var doc = frames[0].document;
+ var b = doc.createElement("base");
+ b.setAttribute("href", "test");
+ var newBaseValue = location.href.replace(/\/[^/]*$/, "/") + "test";
+ assert_equals(b.href, newBaseValue);
+ assert_equals(doc.baseURI, location.href);
+ doc.head.appendChild(b);
+ assert_equals(doc.baseURI, newBaseValue);
+}));
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_empty.html b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_empty.html
new file mode 100644
index 0000000000..7737556a1a
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_empty.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>HTML Test: base_href_empty</title>
+<link rel="author" title="Intel" href="http://www.intel.com/">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-base-element">
+<base id="base" href="" target="_blank">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<div id="log"></div>
+<img id="test" src="/images/blue-100x100.png" style="display:none">
+
+<script>
+ var testElement,
+ baseElement;
+
+ setup(function() {
+ testElement = document.getElementById("test");
+ baseElement = document.getElementById("base");
+ });
+
+ test(function() {
+ assert_equals(baseElement.href, document.location.href, "The href of base element is incorrect.");
+ }, "The value of the href attribute must be the document's address if it is empty");
+
+ test(function() {
+ var exp = testElement.src.substring(0, testElement.src.lastIndexOf("/images/blue-100x100.png") + 1);
+ assert_true(baseElement.href.indexOf(exp) != -1, "The src of img element is incorrect.");
+ }, "The src attribute of the img element must relative to document's address");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_invalid.html b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_invalid.html
new file mode 100644
index 0000000000..6d12d29e8a
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_invalid.html
@@ -0,0 +1,12 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>base element with unparseable href should have .href getter return attr value</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script>
+test(function() {
+ var b = document.createElement("base");
+ b.setAttribute("href", "//test:test");
+ assert_equals(b.href, "//test:test");
+});
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_specified.html b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_specified.html
new file mode 100644
index 0000000000..83e71387a0
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_specified.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>HTML Test: base_href_specified</title>
+<link rel="author" title="Intel" href="http://www.intel.com/">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-base-element">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/get-host-info.sub.js"></script>
+<base id="base">
+<div id="log"></div>
+<img id="test" src="test.ico" style="display:none">
+
+<script>
+ var testElement;
+ var baseElement;
+
+ var otherOrigin = get_host_info().HTTP_REMOTE_ORIGIN;
+
+ setup(function() {
+ testElement = document.getElementById("test");
+ baseElement = document.getElementById("base");
+
+ baseElement.setAttribute("href", otherOrigin);
+ });
+
+ test(function() {
+ assert_equals(baseElement.href, otherOrigin + "/", "The href attribute of the base element is incorrect.");
+ }, "The href attribute of the base element is specified");
+
+ test(function() {
+ assert_equals(testElement.src, otherOrigin + "/test.ico", "The src attribute of the img element is incorrect.");
+ }, "The src attribute of the img element must relative to the href attribute of the base element");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_unspecified.html b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_unspecified.html
new file mode 100644
index 0000000000..cf883f7239
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_href_unspecified.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>HTML Test: base_href_unspecified</title>
+<link rel="author" title="Intel" href="http://www.intel.com/">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-base-element">
+<base id="base" target="_blank">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+
+<div id="log"></div>
+<img id="test" src="/images/blue-100x100.png" style="display:none">
+
+<script>
+ var testElement,
+ baseElement;
+
+ setup(function () {
+ testElement = document.getElementById("test");
+ baseElement = document.getElementById("base");
+ });
+
+ test(function() {
+ assert_equals(baseElement.href, document.location.href, "Return the document base URL if the base element has no href content attribute.");
+ }, "The value of the href attribute must be the document's address if it is unspecified");
+
+ test(function() {
+ var exp = testElement.src.substring(0, testElement.src.lastIndexOf("/images/blue-100x100.png") + 1);
+ assert_true(baseElement.href.indexOf(exp) != -1, "The src attribute of the img element is incorrect.");
+ }, "The src attribute of the img element must relative to document's address");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_multiple.html b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_multiple.html
new file mode 100644
index 0000000000..4b7c0d213c
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_multiple.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>HTML Test: base_multiple</title>
+<link rel="author" title="Intel" href="http://www.intel.com/">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-base-element">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<body>
+ <div id="log"></div>
+ <iframe id="test1" src="example.html" style="width:0;height:0" frameborder="0"></iframe>
+ <iframe id="test2" src="example.html" name="targetWin" style="width:0;height:0" frameborder="0"></iframe>
+ <script>
+ async_test(function() {
+ window.onload = this.step_func(function() {
+ var fr1 = document.getElementById("test1");
+ fr1.addEventListener("load", this.unreached_func("loaded in the wrong iframe"));
+
+ var fr2 = document.getElementById("test2");
+ fr2.addEventListener("load", this.step_func_done(function () {
+ var doc2 = fr2.contentDocument;
+ assert_not_equals(doc2.location.href.indexOf("example2.html"), -1, "The target attribute does not impact the a element.");
+ assert_equals(doc2.getElementById("d1").innerHTML, "PASS", "The opend page should be the example2.html.");
+ }), true);
+
+ fr1.contentDocument.getElementById("a1").click();
+ });
+ }, "The attributes of the a element must be affected by the first base element");
+ </script>
+</body>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_srcdoc.html b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_srcdoc.html
new file mode 100644
index 0000000000..eea1efe51d
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_srcdoc.html
@@ -0,0 +1,19 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>base element in srcdoc document should resolve against its fallback base URI</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<iframe srcdoc=""></iframe>
+<script>
+var t = async_test();
+addEventListener("load", t.step_func_done(function() {
+ var doc = frames[0].document;
+ var b = doc.createElement("base");
+ b.setAttribute("href", "test");
+ var newBaseValue = location.href.replace(/\/[^/]*$/, "/") + "test";
+ assert_equals(b.href, newBaseValue);
+ assert_equals(doc.baseURI, location.href);
+ doc.head.appendChild(b);
+ assert_equals(doc.baseURI, newBaseValue);
+}));
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_target_does_not_affect_iframe_src_navigation.html b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_target_does_not_affect_iframe_src_navigation.html
new file mode 100644
index 0000000000..b432698f21
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_target_does_not_affect_iframe_src_navigation.html
@@ -0,0 +1,10 @@
+<base id="base" target="_blank">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<iframe id="i" src="about:blank"></iframe>
+<script>
+async_test(function(t) {
+ window.onmessage = () => t.done();
+ i.src = "data:text/html,This should navigate the iframe<script>top.postMessage('done', '*');</sc" + "ript>";
+});
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_target_does_not_affect_location_assignment.html b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_target_does_not_affect_location_assignment.html
new file mode 100644
index 0000000000..2914f1f77f
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/base_target_does_not_affect_location_assignment.html
@@ -0,0 +1,10 @@
+<base id="base" target="_blank">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<iframe id="i" src="about:blank"></iframe>
+<script>
+async_test(function(t) {
+ window.onmessage = () => t.done();
+ i.contentWindow.location = "data:text/html,This should navigate the iframe<script>top.postMessage('done', '*');</sc" + "ript>";
+});
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/example.html b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/example.html
new file mode 100644
index 0000000000..49dc772f91
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/example.html
@@ -0,0 +1,7 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Example</title>
+<base target="targetWin" href="">
+<base target="_self" href="http://www.example.com/">
+<link rel="author" title="Intel" href="http://www.intel.com/">
+<a id="a1" href="example2.html" target="">click me</a>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/example2.html b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/example2.html
new file mode 100644
index 0000000000..0e57cb9c5c
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-base-element/example2.html
@@ -0,0 +1,5 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Example</title>
+<link rel="author" title="Intel" href="http://www.intel.com/">
+<div id="d1">PASS</div>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/all b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/all
new file mode 100644
index 0000000000..60f1eab971
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/all
@@ -0,0 +1,3 @@
+body {
+ color: red;
+}
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/all.headers b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/all.headers
new file mode 100644
index 0000000000..74e07a14e7
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/all.headers
@@ -0,0 +1 @@
+Content-Type: text/css
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/document-without-browsing-context.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/document-without-browsing-context.html
new file mode 100644
index 0000000000..127b253f59
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/document-without-browsing-context.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>Documents without browsing contexts should not load stylesheets</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/utils.js"></script>
+<body>
+<script>
+ function count(id, t) {
+ var xhr = new XMLHttpRequest();
+ xhr.open('GET', 'stylesheet.py?count=1&id=' + id);
+ xhr.onload = t.step_func_done(function() {
+ assert_equals(xhr.responseText, "1");
+ });
+ xhr.onerror = t.unreached_func();
+ xhr.send();
+ }
+
+ async_test(function(t) {
+ var id = token();
+ var doc = (new DOMParser()).parseFromString('<link rel="stylesheet" href="stylesheet.py?id=' + id + '"></link>', 'text/html');
+ var link = doc.querySelector('link');
+ document.head.appendChild(link);
+ t.step_timeout(function() { count(id, t) }, 500);
+ }, 'Create a document, adopt the node');
+
+ async_test(function(t) {
+ var id = token();
+ var d = document.createElement('div');
+ document.body.appendChild(d);
+ d.innerHTML = '<link rel="stylesheet" href="stylesheet.py?id=' + id + '"></link>';
+ t.step_timeout(function() { count(id, t) }, 500);
+ }, 'Create a stylesheet in innerHTML document');
+</script>
+</body>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-error-fired-before-scripting-unblocked.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-error-fired-before-scripting-unblocked.html
new file mode 100644
index 0000000000..188e4ba5ab
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-error-fired-before-scripting-unblocked.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<link rel="author" title="Dom Farolino" href="mailto:dom@chromium.org">
+<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.unreached_func('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>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-error-events.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-error-events.html
new file mode 100644
index 0000000000..e4f617d458
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-error-events.html
@@ -0,0 +1,6 @@
+<!doctype html>
+<meta charset=utf-8>
+<title></title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="resources/link-load-error-events.sub.js"></script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-error-events.https.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-error-events.https.html
new file mode 100644
index 0000000000..e4f617d458
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-error-events.https.html
@@ -0,0 +1,6 @@
+<!doctype html>
+<meta charset=utf-8>
+<title></title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="resources/link-load-error-events.sub.js"></script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-event.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-event.html
new file mode 100644
index 0000000000..e95fff7988
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-event.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<link rel="author" title="Josh Matthews" href="mailto:josh@joshmatthews.net">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-link-element">
+<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 blocks the document load event");
+window.addEventListener('load', t.step_func_done(function() {
+ assert_true(saw_link_onload);
+}));
+</script>
+<link href="style.css?pipe=trickle(d3)" rel="stylesheet" id="style_test"
+ onload="t.step(function() { saw_link_onload = true; })"
+ onerror="t.unreached_func('Sheet should load OK')">
+</head>
+</html>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-fired-before-scripting-unblocked.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-fired-before-scripting-unblocked.html
new file mode 100644
index 0000000000..a809cc44b1
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-load-fired-before-scripting-unblocked.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<link rel="author" title="Dom Farolino" href="mailto:dom@chromium.org">
+<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.unreached_func('Sheet should load OK')">
+<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>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-multiple-error-events.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-multiple-error-events.html
new file mode 100644
index 0000000000..9d112e88d1
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-multiple-error-events.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<link rel="author" title="Dom Farolino" href="mailto:dom@chromium.org">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-link-element">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<link id=style_link rel=stylesheet>
+<script>
+ async_test(t => {
+ const link = document.querySelector('#style_link');
+ link.onload = t.unreached_func('Sheet should fail to load');
+ link.onerror = t.step_func(() => {
+ link.onerror = t.step_func_done(() => {});
+ link.href = 'nonexistent.css?second';
+ });
+
+ link.href = 'nonexistent.css?first';
+ }, "Check if the <link>'s error event fires for each stylesheet it fails to load");
+
+ </script>
+</head>
+</html>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-multiple-load-events.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-multiple-load-events.html
new file mode 100644
index 0000000000..b5550bb382
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-multiple-load-events.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<link rel="author" title="Dom Farolino" href="mailto:dom@chromium.org">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-link-element">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<link id=style_link rel=stylesheet>
+<script>
+ async_test(t => {
+ const link = document.querySelector('#style_link');
+ link.onerror = t.unreached_func('Sheet should load successfully');
+ link.onload = t.step_func(() => {
+ link.onload = t.step_func_done(() => {});
+ link.href = 'style.css?second';
+ });
+
+ link.href = 'style.css?first';
+
+ }, "Check if the <link>'s load event fires for each stylesheet it loads");
+ </script>
+</head>
+</html>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rel-attribute-ascii-case-insensitive-notref.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rel-attribute-ascii-case-insensitive-notref.html
new file mode 100644
index 0000000000..04e3a7cb02
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rel-attribute-ascii-case-insensitive-notref.html
@@ -0,0 +1,5 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>link element rel is ASCII case-insensitive (mismatch reference)</title>
+<link rel="stylesheet" href="stylesheet.css">
+<p>Test passes if background is not red.</p>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rel-attribute-ascii-case-insensitive.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rel-attribute-ascii-case-insensitive.html
new file mode 100644
index 0000000000..5ee55f7d2e
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rel-attribute-ascii-case-insensitive.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>link element rel is ASCII case-insensitive</title>
+<link rel="help" href="https://html.spec.whatwg.org/#the-link-element">
+<link rel="help" href="https://html.spec.whatwg.org/#attr-link-rel">
+<link rel="help" href="https://html.spec.whatwg.org/#linkTypes">
+<meta name="assert" content="link element's rel attribute is ASCII case-insensitive.">
+<link rel="mismatch" href="link-rel-attribute-ascii-case-insensitive-notref.html">
+
+<!-- Load sheet with a red background (rel attribute value is case-sensitive
+ equal to "stylesheet") -->
+<link rel="stylesheet" href="stylesheet.css">
+
+<!-- Load sheet with white background (rel attribute value is ASCII
+ case-insensitive equal to "stylesheet") -->
+<link rel="StyLeShEeT" href="style.css">
+
+<!-- Do not load sheet with a red background (rel attribute value is
+ case-insensitive equal to "stylesheet") -->
+<link rel="ſtyleſheet" href="stylesheet.css">
+
+<p>Test passes if background is not red.</p>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rel-attribute.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rel-attribute.html
new file mode 100644
index 0000000000..14d06227ac
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rel-attribute.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<script src = "/resources/testharness.js"></script>
+<script src = "/resources/testharnessreport.js"></script>
+
+<link id="light-link" rel="stylesheet" href="resources/link-rel-attribute.css">
+<div id="light-div" class="green">I"m green when light DOM link is on</div>
+
+<div id="host">
+ I"m green when Shadow DOM link is on
+ <template id="shadow-dom">
+ <link id="shadow-link" rel="stylesheet" href="resources/link-rel-attribute.css">
+ <div id="shadow-div" class="green">
+ <slot></slot>
+ </div>
+ </template>
+</div>
+
+<script>
+
+function testLinkRelModification(testDiv, testLink) {
+ assert_equals(getComputedStyle(testDiv).color, "rgb(0, 128, 0)");
+ testLink.setAttribute("rel", "no-stylesheet");
+ assert_equals(getComputedStyle(testDiv).color, "rgb(0, 0, 0)");
+ testLink.setAttribute("rel", "stylesheet");
+ assert_equals(getComputedStyle(testDiv).color, "rgb(0, 128, 0)");
+ testLink.removeAttribute("rel");
+ assert_equals(getComputedStyle(testDiv).color, "rgb(0, 0, 0)");
+}
+
+test (() => {
+ testLinkRelModification(document.querySelector("#light-div"),
+ document.querySelector("#light-link"));
+}, "Removing stylesheet from link rel attribute should remove the stylesheet for light DOM");
+
+test (() => {
+ var host = document.querySelector("#host");
+ var shadow = host.attachShadow({ mode: "open" });
+ var tmpl = document.querySelector("template#shadow-dom");
+ var clone = document.importNode(tmpl.content, true);
+ shadow.appendChild(clone);
+ testLinkRelModification(shadow.querySelector("#shadow-div"),
+ shadow.querySelector("#shadow-link"));
+}, "Removing stylesheet from link rel attribute should remove the stylesheet for shadow DOM");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rellist.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rellist.html
new file mode 100644
index 0000000000..8647426755
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-rellist.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<title>link.relList: non-string contains</title>
+<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-link-element">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#domtokenlist">
+<link rel="help" href="https://webidl.spec.whatwg.org/#ecmascript-binding">
+<link rel="help" href="http://www.ecma-international.org/publications/files/ECMA-ST/ECMA-262.pdf#page=57">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<link id="link" rel="undefined null 0 NaN Infinity">
+<div id="log"></div>
+<script>
+test(function() {
+ var list = document.getElementById("link").relList;
+ assert_equals(list.contains(undefined), true); //"undefined"
+ assert_equals(list.contains(null), true); //"null"
+ assert_equals(list.contains(-0), true); //"0"
+ assert_equals(list.contains(+0), true); //"0"
+ assert_equals(list.contains(NaN), true); //"NaN"
+ assert_equals(list.contains(+Infinity), true); //"Infinity"
+ assert_equals(list.contains(-Infinity), false); //"-Infinity"
+ assert_equals(list.supports("stylesheet"), true);
+ assert_equals(list.supports("nosuchrelvalueever"), false);
+});
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-style-error-01.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-style-error-01.html
new file mode 100644
index 0000000000..575324d761
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-style-error-01.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<title>link: error events</title>
+<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-link-element">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src=/common/get-host-info.sub.js></script>
+<div id="log"></div>
+<div id="test">
+<script>
+var t404 = async_test("Should get an error event for a 404 error.")
+t404.step(function() {
+ var elt = document.createElement("link");
+ elt.onerror = t404.step_func(function() {
+ assert_true(true, "Got error event for 404 error.")
+ t404.step_timeout(function() { t404.done() }, 0);
+ })
+ elt.onload = t404.unreached_func("load event should not be fired");
+ elt.rel = "stylesheet";
+ elt.href = "nonexistent_stylesheet.css";
+ document.getElementsByTagName("head")[0].appendChild(elt);
+})
+
+var tUnsupported = async_test("Should get an error event for an unsupported URL.")
+tUnsupported.step(function() {
+ var elt = document.createElement("link");
+ elt.onerror = tUnsupported.step_func(function() {
+ assert_true(true, "Got error event for unsupported URL.")
+ tUnsupported.step_timeout(function() { tUnsupported.done() }, 0);
+ })
+ elt.onload = tUnsupported.unreached_func("load event should not be fired");
+ elt.rel = "stylesheet";
+ elt.href = "nonexistent:stylesheet.css";
+ document.getElementsByTagName("head")[0].appendChild(elt);
+});
+</script>
+<script src=resources/link-style-error.js></script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-style-error-limited-quirks.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-style-error-limited-quirks.html
new file mode 100644
index 0000000000..d3c520ba75
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-style-error-limited-quirks.html
@@ -0,0 +1,7 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//" "">
+<title>link: error events in limited quirks mode</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src=/common/get-host-info.sub.js></script>
+<div id="log"></div>
+<script src=resources/link-style-error.js></script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-style-error-quirks.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-style-error-quirks.html
new file mode 100644
index 0000000000..ae2efa415e
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-style-error-quirks.html
@@ -0,0 +1,7 @@
+<!DOCTYPE HTML PUBLIC "-//Sun Microsystems Corp.//DTD HotJava Strict HTML//" "">
+<title>link: error events in quirks mode</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src=/common/get-host-info.sub.js></script>
+<div id="log"></div>
+<script src=resources/link-style-error.js></script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-type-attribute-ref.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-type-attribute-ref.html
new file mode 100644
index 0000000000..f32472105d
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-type-attribute-ref.html
@@ -0,0 +1,3 @@
+<!DOCTYPE html>
+<p>You should see a green rectangle below</p>
+<div style="width:100px;height:100px;background-color:green"></div>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-type-attribute.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-type-attribute.html
new file mode 100644
index 0000000000..80acb9f3dc
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/link-type-attribute.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<link rel=match href=link-type-attribute-ref.html>
+<link rel="stylesheet" type="application/javascript" href="data:text/css,div { background-color: red !important; }">
+<link rel="stylesheet" type="ABCtext/css" href="data:text/css,div { background-color: red !important; }">
+<link rel="stylesheet" type="text/cssDEF" href="data:text/css,div { background-color: red !important; }">
+<link rel="stylesheet" type="text/invalid" href="data:text/css,div { background-color: red !important; }">
+<link rel="stylesheet" type="invalid" href="data:text/css,div { background-color: red !important; }">
+<p>You should see a green rectangle below</p>
+<div style="width:100px;height:100px;background-color:green"></div>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/bad.css b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/bad.css
new file mode 100644
index 0000000000..4e1fe36165
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/bad.css
@@ -0,0 +1,4 @@
+p {
+ background-color: red;
+ color: black;
+} \ No newline at end of file
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/css.py b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/css.py
new file mode 100644
index 0000000000..1a11c1d5b3
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/css.py
@@ -0,0 +1,7 @@
+def main(request, response):
+ response.add_required_headers = False
+ if b"content_type" in request.GET:
+ response.writer.write_header(b"Content-Type", request.GET.first(b"content_type"))
+ if b"nosniff" in request.GET:
+ response.writer.write_header(b"x-content-type-options", b"nosniff")
+ response.writer.write_content(u"body { background:red }")
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/empty-href.css b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/empty-href.css
new file mode 100644
index 0000000000..60f1eab971
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/empty-href.css
@@ -0,0 +1,3 @@
+body {
+ color: red;
+}
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/good.css b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/good.css
new file mode 100644
index 0000000000..1da5e2b8cf
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/good.css
@@ -0,0 +1,3 @@
+p {
+ color: green;
+} \ No newline at end of file
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/link-load-error-events.sub.js b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/link-load-error-events.sub.js
new file mode 100644
index 0000000000..33c8709579
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/link-load-error-events.sub.js
@@ -0,0 +1,192 @@
+/**
+ * This is the guts of the load/error event tests for <link rel="stylesheet">.
+ *
+ * We have a list of tests each of which is an object containing: href value,
+ * expected load success boolean, test description. Href values are set up in
+ * such a way that we guarantee that all stylesheet URLs are unique. This
+ * avoids issues around caching of sheets based on URL.
+ */
+
+// Our URLs are random, so we don't use them in error messages by
+// default, but enable doing it if someone wants to debug things.
+const DEBUG_URLS = false;
+
+var isHttps = location.protocol == "https:";
+
+var tests = [
+ // Basic tests
+ {
+ href: existingSheet(),
+ success: true,
+ description: "Basic load of stylesheet",
+ },
+ {
+ href: nonexistentSheet(),
+ success: false,
+ description: "Attempted load of nonexistent stylesheet",
+ },
+ {
+ href: `data:text/css,@import url("${existingSheet()}")`,
+ success: true,
+ description: "Import of stylesheet",
+ },
+ {
+ href: `data:text/css,@import url("${nonexistentSheet()}")`,
+ success: false,
+ description: "Import of nonexistent stylesheet",
+ },
+ {
+ href: `data:text/css,@import url("data:text/css,@import url('${existingSheet()}')")`,
+ success: true,
+ description: "Import of import of stylesheet",
+ },
+ {
+ href: `data:text/css,@import url("data:text/css,@import url('${nonexistentSheet()}')")`,
+ success: false,
+ description: "Import of import of nonexistent stylesheet",
+ },
+
+ // Non-CSS-response tests.
+ {
+ href: makeUnique(""),
+ success: false,
+ description: "Load of non-CSS stylesheet",
+ },
+ {
+ href: `data:text/css,@import url("${makeUnique("")}")`,
+ success: false,
+ description: "Import of non-CSS stylesheet",
+ },
+ {
+ href: `data:text/css,@import url("data:text/css,@import url('${makeUnique("")}')")`,
+ success: false,
+ description: "Import of import of non-CSS stylesheet",
+ },
+
+ // http:// tests, to test what happens with mixed content blocking.
+ {
+ href: httpSheet(),
+ success: !isHttps,
+ description: "Load of http:// stylesheet",
+ },
+ {
+ href: `data:text/css,@import url("${httpSheet()}")`,
+ success: !isHttps,
+ description: "Import of http:// stylesheet",
+ },
+ {
+ href: `data:text/css,@import url("data:text/css,@import url('${httpSheet()}')")`,
+ success: !isHttps,
+ description: "Import of import of http:// stylesheet",
+ },
+
+ // https:// tests just as a control
+ {
+ href: httpsSheet(),
+ success: true,
+ description: "Load of https:// stylesheet",
+ },
+ {
+ href: `data:text/css,@import url("${httpsSheet()}")`,
+ success: true,
+ description: "Import of https:// stylesheet",
+ },
+ {
+ href: `data:text/css,@import url("data:text/css,@import url('${httpsSheet()}')")`,
+ success: true,
+ description: "Import of import of https:// stylesheet",
+ },
+
+ // Tests with multiple imports some of which are slow and some are fast.
+ {
+ href: `data:text/css,@import url("${slowResponse(existingSheet())}"); @import url("${nonexistentSheet()}");`,
+ success: false,
+ description: "Slow successful import, fast failing import",
+ },
+ {
+ href: `data:text/css,@import url("${existingSheet()}"); @import url("${slowResponse(nonexistentSheet())}");`,
+ success: false,
+ description: "Fast successful import, slow failing import",
+ }
+];
+
+// Note: Here we really do need to use "let" at least for the href,
+// because we lazily evaluate it in the unreached cases.
+for (var test of tests) {
+ let {href, success, description} = test;
+ var t = async_test(description);
+ var link = document.createElement("link");
+ link.rel = "stylesheet";
+ hrefString = DEBUG_URLS ? `: ${href}` : "";
+ if (success) {
+ link.onload = t.step_func_done(() => {});
+ link.onerror = t.step_func_done(() => assert_unreached(`error fired when load expected${hrefString}`) );
+ } else {
+ link.onerror = t.step_func_done(() => {});
+ link.onload = t.step_func_done(() => assert_unreached(`load fired when error expected${hrefString}`) );
+ }
+ link.href = href;
+ document.head.appendChild(link);
+}
+
+/* Utility function */
+function makeUnique(url) {
+ // Make sure we copy here, even if the thing coming in is a URL, so we don't
+ // mutate our caller's data.
+ url = new URL(url, location.href);
+ // We want to generate a unique URI to avoid the various caches browsers have
+ // for stylesheets. We don't want to just use a counter, because that would
+ // not be robust to the test being reloaded or othewise run multiple times
+ // without a browser restart. We don't want to use timstamps, because those
+ // are not likely to be unique across calls to this function, especially given
+ // the degraded timer resolution browsers have due to Spectre.
+ //
+ // So just fall back on Math.random() and assume it can't duplicate values.
+ url.searchParams.append("r", Math.random());
+ return url;
+}
+
+function existingSheet() {
+ return makeUnique("resources/good.css");
+}
+
+/**
+ * Function the add values to the "pipe" search param. See
+ * http://wptserve.readthedocs.io/en/latest/pipes.html for why one would do
+ * this. Because this param uses a weird '|'-separated syntax instead of just
+ * using multiple params with the same name, we need some manual code to munge
+ * the value properly.
+ */
+function addPipe(url, pipeVal) {
+ url = new URL(url, location.href);
+ var params = url.searchParams;
+ var oldVal = params.get("pipe");
+ if (oldVal) {
+ params.set("pipe", oldVal + "|" + pipeVal);
+ } else {
+ params.set("pipe", pipeVal);
+ }
+ return url;
+}
+
+function nonexistentSheet() {
+ return addPipe(existingSheet(), "status(404)");
+}
+
+function httpSheet() {
+ var url = existingSheet();
+ url.protocol = "http";
+ url.port = {{ports[http][0]}};
+ return url;
+}
+
+function httpsSheet() {
+ var url = existingSheet();
+ url.protocol = "https";
+ url.port = {{ports[https][0]}};
+ return url;
+}
+
+function slowResponse(url) {
+ return addPipe(url, "trickle(d1)");
+}
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/link-rel-attribute.css b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/link-rel-attribute.css
new file mode 100644
index 0000000000..fa95e11ba9
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/link-rel-attribute.css
@@ -0,0 +1,3 @@
+.green {
+ color: green;
+}
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/link-style-error.js b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/link-style-error.js
new file mode 100644
index 0000000000..d1fa5ac2d6
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/link-style-error.js
@@ -0,0 +1,47 @@
+["<link>", "@import"].forEach(linkType => {
+ [
+ ["same-origin", "resources/css.py"],
+ ["cross-origin", get_host_info().HTTP_REMOTE_ORIGIN + "/html/semantics/document-metadata/the-link-element/resources/css.py"]
+ ].forEach(originType => {
+ ["no Content-Type", "wrong Content-Type", "broken Content-Type"].forEach(contentType => {
+ ["no nosniff", "nosniff"].forEach(nosniff => {
+ async_test(t => {
+ const l = document.createElement("link");
+ t.add_cleanup(() => l.remove());
+ if (nosniff === "nosniff" || contentType === "wrong Content-Type" && (document.compatMode === "CSS1Compat" || originType[0] === "cross-origin")) {
+ l.onerror = t.step_func_done();
+ l.onload = t.unreached_func("error event should have fired");
+ } else {
+ l.onload = t.step_func_done();
+ l.onerror = t.unreached_func("load event should have fired");
+ }
+ l.rel = "stylesheet";
+ let query = [];
+ if (contentType === "broken Content-Type") {
+ query.push("content_type=oops");
+ } else if (contentType === "wrong Content-Type") {
+ query.push("content_type=text/plain")
+ }
+ if (nosniff === "nosniff") {
+ query.push("nosniff");
+ }
+ let stringQuery = "";
+ query.forEach(val => {
+ if (stringQuery === "") {
+ stringQuery += "?" + val;
+ } else {
+ stringQuery += "&" + val;
+ }
+ });
+ const link = new URL(originType[1] + stringQuery, location).href;
+ if (linkType === "<link>") {
+ l.href = link;
+ } else {
+ l.href = "data:text/css,@import url(" + link + ");";
+ }
+ document.head.appendChild(l);
+ }, "Stylesheet loading using " + linkType + " with " + contentType + ", " + originType[0] + ", and " + nosniff);
+ });
+ });
+ });
+});
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/neutral.css b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/neutral.css
new file mode 100644
index 0000000000..796c55c42f
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/neutral.css
@@ -0,0 +1,3 @@
+body {
+ background-color: gray;
+}
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/stylesheet.css b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/stylesheet.css
new file mode 100644
index 0000000000..e1b2552ffe
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/resources/stylesheet.css
@@ -0,0 +1,3 @@
+body {
+ background-color: green;
+}
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/style.css b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/style.css
new file mode 100644
index 0000000000..d48115e565
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/style.css
@@ -0,0 +1,3 @@
+body {
+ background-color: white;
+} \ No newline at end of file
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-change-href-ref.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-change-href-ref.html
new file mode 100644
index 0000000000..9ae6e36655
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-change-href-ref.html
@@ -0,0 +1,8 @@
+<!doctype html>
+<meta charset="utf-8">
+<style>
+ p {
+ color: green;
+ }
+</style>
+<p>This text should be green on a white background
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-change-href.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-change-href.html
new file mode 100644
index 0000000000..6a3f18de98
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-change-href.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>Obtaining a new stylesheet removes styles from the previous stylesheet.</title>
+<link rel=match href=stylesheet-change-href-ref.html>
+<script>
+ function changeHref() {
+ var elem = document.getElementById('stylesheet');
+ elem.href = 'resources/good.css';
+ elem.onload = null;
+ }
+</script>
+<link id=stylesheet rel=stylesheet href="resources/bad.css" onload="changeHref()">
+<p>This text should be green on a white background
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-empty-href-ref.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-empty-href-ref.html
new file mode 100644
index 0000000000..63b75d0ae2
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-empty-href-ref.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test</title>
+<style>
+body {
+ color: green;
+}
+</style>
+<p>This text should be green.
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-empty-href.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-empty-href.html
new file mode 100644
index 0000000000..16b14efacc
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-empty-href.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test</title>
+<link rel=match href=stylesheet-empty-href-ref.html>
+<style>
+body {
+ color: green;
+}
+</style>
+<base href=resources/empty-href.css>
+<link rel=stylesheet href>
+<p>This text should be green.
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-media-ref.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-media-ref.html
new file mode 100644
index 0000000000..63b75d0ae2
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-media-ref.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test</title>
+<style>
+body {
+ color: green;
+}
+</style>
+<p>This text should be green.
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-media.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-media.html
new file mode 100644
index 0000000000..9a72924cf4
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-media.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test</title>
+<link rel=match href=stylesheet-media-ref.html>
+<style>
+body {
+ color: green;
+}
+</style>
+<link rel=stylesheet id=link>
+<script>
+// This tests for a bug in Servo, where it would treat the media attribute as
+// if it was the href attribute.
+var link = document.getElementById("link");
+link.setAttribute("media", "all")
+</script>
+<p>This text should be green.
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-not-removed-until-next-stylesheet-loads.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-not-removed-until-next-stylesheet-loads.html
new file mode 100644
index 0000000000..ab8ee727f2
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-not-removed-until-next-stylesheet-loads.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<link rel="author" title="Dom Farolino" href="mailto:dom@chromium.org">
+<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>
+<link href="style.css" rel="stylesheet" id="style_test">
+<script>
+ test(function() {
+ assert_true(document.styleSheets.length === 1 &&
+ document.styleSheets[0].href.includes("style.css"),
+ "The style sheet 'style.css' must be available to scripts");
+
+ style_test.href = "resources/neutral.css?pipe=trickle(d1)";
+
+ assert_true(document.styleSheets.length === 1 &&
+ document.styleSheets[0].href.includes("style.css"),
+ "The style sheet 'style.css' must remain accessible to " +
+ "scripts until its replacement has finished loading");
+ }, "Check that a style sheet loaded by a <link> is available until its successor is loaded");
+</script>
+</head>
+</html>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-with-base-ref.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-with-base-ref.html
new file mode 100644
index 0000000000..83f0d06772
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-with-base-ref.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Stylesheet Without Base Tag</title>
+ <style>
+ body { background-color: green; }
+ </style>
+</head>
+<body>
+</body>
+</html>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-with-base.html b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-with-base.html
new file mode 100644
index 0000000000..a9f2a8bce0
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet-with-base.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Stylesheet With Base Tag</title>
+ <link rel="match" href="stylesheet-with-base-ref.html">
+ <base href="resources/">
+ <link rel="stylesheet" href="stylesheet.css">
+</head>
+<body>
+</body>
+</html>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet.css b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet.css
new file mode 100644
index 0000000000..e8f24f94a3
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet.css
@@ -0,0 +1,3 @@
+body {
+ background-color: red;
+}
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet.py b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet.py
new file mode 100644
index 0000000000..1a4dec2724
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-link-element/stylesheet.py
@@ -0,0 +1,9 @@
+def main(request, response):
+ try:
+ count = int(request.server.stash.take(request.GET[b"id"]))
+ except:
+ count = 0
+ if b"count" in request.GET:
+ return str(count)
+ request.server.stash.put(request.GET[b"id"], str(count + 1))
+ return u'body { color: red }'
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-attribute-changes.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-attribute-changes.html
new file mode 100644
index 0000000000..6f877ee416
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-attribute-changes.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<title>Meta color-scheme - attribute changes</title>
+<meta id="meta" name="color-scheme" content="dark">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#meta-color-scheme">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/compute-root-color-scheme.js"></script>
+<!--
+ NOTE: This test assumes that the browser's default color-scheme is "light",
+ see https://github.com/web-platform-tests/wpt/pull/31268 for reasoning
+-->
+<script>
+ assert_root_color_scheme("dark", "Meta color-scheme initially 'dark'.");
+
+ meta.removeAttribute("name");
+ assert_root_color_scheme("light", "Removed name attribute from meta color-scheme.");
+
+ meta.setAttribute("name", "color-scheme");
+ assert_root_color_scheme("dark", "Set meta name to color-scheme.");
+
+ meta.setAttribute("content", "");
+ assert_root_color_scheme("light", "Set content attribute of meta color-scheme to empty string.");
+
+ meta.setAttribute("content", ",,invalid");
+ assert_root_color_scheme("light", "Set content attribute of meta color-scheme to an invalid value.");
+
+ meta.setAttribute("content", "light");
+ assert_root_color_scheme("light", "Set content attribute of meta color-scheme to 'light'.");
+
+ meta.setAttribute("content", "dark");
+ assert_root_color_scheme("dark", "Set content attribute of meta color-scheme to 'dark'.");
+
+ meta.removeAttribute("content");
+ assert_root_color_scheme("light", "Removed the content attribute of meta color-scheme.");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-empty-content-value.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-empty-content-value.html
new file mode 100644
index 0000000000..8a3cf18af8
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-empty-content-value.html
@@ -0,0 +1,14 @@
+<!doctype html>
+<title>Meta color-scheme - empty content value</title>
+<meta name="color-scheme" content="">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#meta-color-scheme">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/compute-root-color-scheme.js"></script>
+<!--
+ NOTE: This test assumes that the browser's default color-scheme is "light",
+ see https://github.com/web-platform-tests/wpt/pull/31268 for reasoning
+-->
+<script>
+ assert_root_color_scheme("light", "Meta color-scheme with empty content attribute has no effect.");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-first-valid-applies.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-first-valid-applies.html
new file mode 100644
index 0000000000..095d0f360d
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-first-valid-applies.html
@@ -0,0 +1,16 @@
+<!doctype html>
+<title>Multiple color-scheme meta tags - first valid applies</title>
+<meta name="color-scheme">
+<meta name="color-scheme" content>
+<meta name="color-scheme" content="">
+<meta name="color-scheme" content="light,dark">
+<!-- This is first with a valid content value -->
+<meta name="color-scheme" content="dark">
+<meta name="color-scheme" content="light">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#meta-color-scheme">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/compute-root-color-scheme.js"></script>
+<script>
+ assert_root_color_scheme("dark", "Tree order decides which meta color-scheme applies.");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-insert.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-insert.html
new file mode 100644
index 0000000000..463c318105
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-insert.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<title>Insert color-scheme meta tags</title>
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#meta-color-scheme">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/compute-root-color-scheme.js"></script>
+<!--
+ NOTE: This test assumes that the browser's default color-scheme is "light",
+ see https://github.com/web-platform-tests/wpt/pull/31268 for reasoning
+-->
+<script>
+ function createMeta(content) {
+ const meta = document.createElement("meta");
+ meta.setAttribute("name", "color-scheme");
+ meta.setAttribute("content", content);
+ return meta;
+ }
+
+ assert_root_color_scheme("light", "Initial color-scheme");
+
+ document.head.appendChild(createMeta("dark"));
+ assert_root_color_scheme("dark", "Inserted meta color-scheme applies");
+
+ document.head.insertBefore(createMeta("light"), document.head.lastChild);
+ assert_root_color_scheme("light", "Inserted meta color-scheme before existing in head applies");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-no-content-value.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-no-content-value.html
new file mode 100644
index 0000000000..0d22e44b26
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-no-content-value.html
@@ -0,0 +1,14 @@
+<!doctype html>
+<title>Meta color-scheme - no content value</title>
+<meta name="color-scheme">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#meta-color-scheme">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/compute-root-color-scheme.js"></script>
+<!--
+ NOTE: This test assumes that the browser's default color-scheme is "light",
+ see https://github.com/web-platform-tests/wpt/pull/31268 for reasoning
+-->
+<script>
+ assert_root_color_scheme("light", "Meta color-scheme without content attribute has no effect.");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-normal-descendant-change.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-normal-descendant-change.html
new file mode 100644
index 0000000000..136f4c371b
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-normal-descendant-change.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<title>Change color-scheme meta tag affecting normal descendant</title>
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#meta-color-scheme">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<meta id="meta" name="color-scheme" content="dark">
+<div style="color-scheme: dark; color: CanvasText" id="dark">
+ <div style="color-scheme: normal; color: CanvasText" id="normal"></div>
+</div>
+<script>
+ test(() => {
+ assert_equals(getComputedStyle(dark).color, getComputedStyle(normal).color);
+ }, "Normal initially dark");
+
+ meta.content = "light";
+
+ test(() => {
+ assert_not_equals(getComputedStyle(dark).color, getComputedStyle(normal).color);
+ }, "Normal should change to light from page color schemes");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-remove-head.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-remove-head.html
new file mode 100644
index 0000000000..587e2fa596
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-remove-head.html
@@ -0,0 +1,17 @@
+<!doctype html>
+<title>Remove head with meta color-scheme</title>
+<meta name="color-scheme" content="dark">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#meta-color-scheme">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/compute-root-color-scheme.js"></script>
+<!--
+ NOTE: This test assumes that the browser's default color-scheme is "light",
+ see https://github.com/web-platform-tests/wpt/pull/31268 for reasoning
+-->
+<body></body>
+<script>
+ assert_root_color_scheme("dark", "Meta color-scheme applies.");
+ document.head.remove();
+ assert_root_color_scheme("light", "Initial value after removing head including meta color-scheme.");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-remove.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-remove.html
new file mode 100644
index 0000000000..a89a520791
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-remove.html
@@ -0,0 +1,19 @@
+<!doctype html>
+<title>Remove color-scheme meta tag</title>
+<meta id="dark" name="color-scheme" content="dark">
+<meta id="light" name="color-scheme" content="light">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#meta-color-scheme">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/compute-root-color-scheme.js"></script>
+<!--
+ NOTE: This test assumes that the browser's default color-scheme is "light",
+ see https://github.com/web-platform-tests/wpt/pull/31268 for reasoning
+-->
+<script>
+ assert_root_color_scheme("dark", "First meta applies.");
+ dark.remove();
+ assert_root_color_scheme("light", "Second meta applies after first one is removed.");
+ light.remove();
+ assert_root_color_scheme("light", "Initial color-scheme with both meta elements removed.");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-single-value-in-body.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-single-value-in-body.html
new file mode 100644
index 0000000000..19f8d53994
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-single-value-in-body.html
@@ -0,0 +1,12 @@
+<!doctype html>
+<title>Meta color-scheme in body should apply</title>
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#meta-color-scheme">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/compute-root-color-scheme.js"></script>
+<body>
+ <meta name="color-scheme" content="dark">
+</body>
+<script>
+ assert_root_color_scheme("dark", "Meta color-scheme in body should apply.");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-single-value-in-head.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-single-value-in-head.html
new file mode 100644
index 0000000000..b9fd2c4384
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-single-value-in-head.html
@@ -0,0 +1,10 @@
+<!doctype html>
+<title>Single meta color-scheme in head</title>
+<meta name="color-scheme" content="dark">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#meta-color-scheme">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/compute-root-color-scheme.js"></script>
+<script>
+ assert_root_color_scheme("dark", "Meta color-scheme in head applies.");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-single-value-in-shadow-tree.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-single-value-in-shadow-tree.html
new file mode 100644
index 0000000000..7ccafc8419
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/meta-color-scheme-single-value-in-shadow-tree.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<title>Meta color-scheme in shadow-tree should not apply</title>
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#meta-color-scheme">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/compute-root-color-scheme.js"></script>
+<!--
+ NOTE: This test assumes that the browser's default color-scheme is "light",
+ see https://github.com/web-platform-tests/wpt/pull/31268 for reasoning
+-->
+<script>
+ const host = document.createElement("div");
+ host.id = "host";
+ document.head.appendChild(host);
+ const root = host.attachShadow({mode:"open"});
+ const meta = document.createElement("meta");
+ meta.setAttribute("name", "color-scheme");
+ meta.setAttribute("content", "dark");
+ root.appendChild(meta);
+
+ assert_root_color_scheme("light", "Meta color-scheme in shadow tree does not apply.");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/support/compute-root-color-scheme.js b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/support/compute-root-color-scheme.js
new file mode 100644
index 0000000000..74cbf895ce
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/color-scheme/support/compute-root-color-scheme.js
@@ -0,0 +1,28 @@
+'use strict';
+
+function assert_root_color_scheme(expected_used_scheme, description) {
+ function get_used_root_color_scheme() {
+ let light = get_system_color("only light", "CanvasText");
+ let dark = get_system_color("only dark", "CanvasText");
+ assert_not_equals(light, dark, "CanvasText system color should be different with light and dark color schemes");
+ let root = getComputedStyle(document.documentElement).color;
+ assert_in_array(root, [light, dark], "Root color scheme should be either light or dark, or the text needs to be extended for newer color-schemes");
+ return root == light ? "light" : "dark";
+ }
+
+ function get_system_color(scheme, color) {
+ let div = document.createElement("div");
+ div.style.color = color;
+ div.style.colorScheme = scheme;
+
+ document.documentElement.appendChild(div);
+ let computed = getComputedStyle(div).color;
+ div.remove();
+ return computed;
+ }
+
+ test(() => {
+ assert_equals(get_used_root_color_scheme(), expected_used_scheme);
+ assert_equals(getComputedStyle(document.documentElement).colorScheme, "normal", "Root element's color-scheme should be 'normal'");
+ }, description);
+}
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/http-equiv-and-name-1.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/http-equiv-and-name-1.html
new file mode 100644
index 0000000000..ac82e3396d
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/http-equiv-and-name-1.html
@@ -0,0 +1,23 @@
+<!doctype html>
+<title>Setting both http-equiv and name attributes on a meta element</title>
+<meta http-equiv=content-language name=color-scheme content=dark>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="color-scheme/support/compute-root-color-scheme.js"></script>
+<!--
+ NOTE: This test assumes that the browser's default color-scheme is "light",
+ see https://github.com/web-platform-tests/wpt/pull/31268 for reasoning
+-->
+<script>
+ // This creates a test()
+ assert_root_color_scheme("dark", "<meta> set the color-scheme to dark");
+
+ // We can't test content-language against :lang(), because CSS Selectors 4
+ // references BCP 47 syntax and RFC4647 "Matching of Language Tags", but
+ // "dark" is not a well-formed BCP 47 tag and therefore cannot be matched.
+ // Therefore, the test that content-language gets set is split off to a
+ // separate testcase using a well-formed lang tag as the content.
+ // test(() => {
+ // assert_equals(document.querySelector(":root:lang(dark)"), document.documentElement);
+ // }, "<meta> set the content-language to dark");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/http-equiv-and-name-2.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/http-equiv-and-name-2.html
new file mode 100644
index 0000000000..b73013a341
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/http-equiv-and-name-2.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<title>Setting both http-equiv and name attributes on a meta element</title>
+<meta http-equiv=content-language name=color-scheme content=de-DE>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script>
+ // We don't attempt to test the color-scheme here because "de-DE" is not a valid
+ // value for it.
+
+ test(() => {
+ assert_equals(document.querySelector(":root:lang(de-DE)"), document.documentElement);
+ }, "<meta> set the content-language to de-DE");
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/allow-scripts-flag-changing-1.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/allow-scripts-flag-changing-1.html
new file mode 100644
index 0000000000..196f6d0409
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/allow-scripts-flag-changing-1.html
@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Meta refresh is blocked by the allow-scripts sandbox flag at its creation time, not when refresh comes due</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#attr-meta-http-equiv-refresh">
+
+<div id="log"></div>
+
+<script>
+"use strict";
+setup({ single_test: true });
+
+const sourceIFrame = document.createElement("iframe");
+sourceIFrame.setAttribute("sandbox", "allow-same-origin");
+
+const destIFrame = document.createElement("iframe");
+
+let sourceLoadCount = 0;
+let destLoadCount = 0;
+
+sourceIFrame.onload = () => {
+ ++sourceLoadCount;
+
+ if (sourceLoadCount === 2) {
+ assert_unreached("The iframe from which the meta came from must not refresh");
+ }
+
+ maybeStartTest();
+};
+
+destIFrame.onload = () => {
+ ++destLoadCount;
+
+ if (destLoadCount === 2) {
+ // destIFrame doesn't have the sandboxed automatic features browsing context
+ // flag sets, thus navigated.
+ assert_equals(destIFrame.contentDocument.body.textContent.trim(), "foo");
+ done();
+ }
+
+ maybeStartTest();
+};
+
+function maybeStartTest() {
+ if (sourceLoadCount === 1 && destLoadCount === 1) {
+ const meta = sourceIFrame.contentDocument.querySelector("meta");
+ destIFrame.contentDocument.body.appendChild(meta);
+ }
+}
+
+sourceIFrame.src = "support/refresh.sub.html?input=" + encodeURIComponent("1; url=foo");
+destIFrame.src = "support/ufoo";
+
+document.body.appendChild(sourceIFrame);
+document.body.appendChild(destIFrame);
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/allow-scripts-flag-changing-2.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/allow-scripts-flag-changing-2.html
new file mode 100644
index 0000000000..cc7eb5e5e0
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/allow-scripts-flag-changing-2.html
@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Meta refresh of the original iframe is not blocked if moved into a sandboxed iframe</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#attr-meta-http-equiv-refresh">
+
+<div id="log"></div>
+
+<script>
+"use strict";
+setup({ single_test: true });
+
+const sourceIFrame = document.createElement("iframe");
+
+const destIFrame = document.createElement("iframe");
+destIFrame.setAttribute("sandbox", "allow-same-origin");
+
+let sourceLoadCount = 0;
+let destLoadCount = 0;
+
+sourceIFrame.onload = () => {
+ ++sourceLoadCount;
+
+ if (sourceLoadCount === 2) {
+ assert_equals(sourceIFrame.contentDocument.body.textContent.trim(), "foo");
+ done();
+ }
+
+ maybeStartTest();
+};
+
+destIFrame.onload = () => {
+ ++destLoadCount;
+
+ if (destLoadCount === 2) {
+ assert_unreached("The iframe into which the meta was moved must not refresh");
+ }
+
+ maybeStartTest();
+};
+
+function maybeStartTest() {
+ if (sourceLoadCount === 1 && destLoadCount === 1) {
+ const meta = sourceIFrame.contentDocument.querySelector("meta");
+ destIFrame.contentDocument.body.appendChild(meta);
+ }
+}
+
+sourceIFrame.src = "support/refresh.sub.html?input=" + encodeURIComponent("1; url=foo");
+destIFrame.src = "support/ufoo";
+
+document.body.appendChild(sourceIFrame);
+document.body.appendChild(destIFrame);
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/dynamic-append.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/dynamic-append.html
new file mode 100644
index 0000000000..4d2fa78940
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/dynamic-append.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Meta refresh applies even when dynamically appended</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#pragma-directives">
+
+<div id="log"></div>
+
+<script>
+"use strict";
+setup({ single_test: true });
+
+const iframe = document.createElement("iframe");
+let loadCount = 0;
+
+iframe.onload = () => {
+ ++loadCount;
+ const iDocument = iframe.contentDocument;
+
+ if (loadCount === 1) {
+ iDocument.body.innerHTML = `<meta http-equiv="refresh" content="1; url=foo">`;
+ } else if (loadCount === 2) {
+ assert_equals(iDocument.body.textContent.trim(), "foo");
+ done();
+ }
+};
+
+iframe.src = "support/ufoo";
+document.body.appendChild(iframe);
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/not-in-shadow-tree.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/not-in-shadow-tree.html
new file mode 100644
index 0000000000..2a9f301fff
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/not-in-shadow-tree.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Meta refresh only applies while in the document tree, not in a shadow tree</title>
+<meta name="timeout" content="long" />
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#pragma-directives">
+
+<div id="log"></div>
+<script>
+"use strict";
+setup({ single_test: true });
+
+const iframe = document.createElement("iframe");
+iframe.src = "support/ufoo";
+
+let loadCount = 0;
+
+iframe.onload = () => {
+ ++loadCount;
+ const iDocument = iframe.contentDocument;
+
+ if (loadCount === 1) {
+ const div = iDocument.createElement("div");
+ assert_true('attachShadow' in div, 'attachShadow support');
+ const shadowRoot = div.attachShadow({ mode: "open" });
+ shadowRoot.innerHTML = `<meta http-equiv="refresh" content="1; url=foo">`;
+ iDocument.body.appendChild(div);
+
+ // Want to make sure no refreshes happen
+ step_timeout(done, 3000);
+ } else {
+ assert_unreached("Got more than 1 load event");
+ }
+};
+
+document.body.appendChild(iframe);
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/parsing.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/parsing.html
new file mode 100644
index 0000000000..73ac4bcc00
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/parsing.html
@@ -0,0 +1,147 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="variant" content="?1-10">
+<meta name="variant" content="?11-20">
+<meta name="variant" content="?21-30">
+<meta name="variant" content="?31-40">
+<meta name="variant" content="?41-50">
+<meta name="variant" content="?51-60">
+<meta name="variant" content="?61-70">
+<meta name="variant" content="?71-80">
+<meta name="variant" content="?81-90">
+<meta name="variant" content="?91-100">
+<meta name="variant" content="?101-110">
+<meta name="variant" content="?111-120">
+<meta name="variant" content="?121-130">
+<meta name="variant" content="?131-last">
+<title>Parsing of meta refresh</title>
+<meta name="timeout" content="long">
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src=/common/subset-tests.js></script>
+<style>
+iframe { display:none }
+</style>
+<body>
+<script>
+
+// failure to parse is []
+// success to parse is [time, url] where url is unresolved
+
+var tests_arr = [
+ {input: '', expected: []},
+ {input: '1', expected: [1, '__filename__']},
+ {input: '1 ', expected: [1, '__filename__']},
+ {input: '1\t', expected: [1, '__filename__']},
+ {input: '1\r', expected: [1, '__filename__']},
+ {input: '1\n', expected: [1, '__filename__']},
+ {input: '1\f', expected: [1, '__filename__']},
+ {input: '1;', expected: [1, '__filename__']},
+ {input: '1,', expected: [1, '__filename__']},
+ {input: '1; url=foo', expected: [1, 'foo']},
+ {input: '1, url=foo', expected: [1, 'foo']},
+ {input: '1 url=foo', expected: [1, 'foo']},
+ {input: '1;\turl=foo', expected: [1, 'foo']},
+ {input: '1,\turl=foo', expected: [1, 'foo']},
+ {input: '1\turl=foo', expected: [1, 'foo']},
+ {input: '1;\rurl=foo', expected: [1, 'foo']},
+ {input: '1,\rurl=foo', expected: [1, 'foo']},
+ {input: '1\rurl=foo', expected: [1, 'foo']},
+ {input: '1;\nurl=foo', expected: [1, 'foo']},
+ {input: '1,\nurl=foo', expected: [1, 'foo']},
+ {input: '1\nurl=foo', expected: [1, 'foo']},
+ {input: '1;\furl=foo', expected: [1, 'foo']},
+ {input: '1,\furl=foo', expected: [1, 'foo']},
+ {input: '1\furl=foo', expected: [1, 'foo']},
+ {input: '1url=foo', expected: []},
+ {input: '1x;url=foo', expected: []},
+ {input: '1 x;url=foo', expected: [1, 'x;url=foo']},
+ {input: '1;;url=foo', expected: [1, ';url=foo']},
+ {input: ' 1 ; url = foo', expected: [1, 'foo']},
+ {input: ' 1 , url = foo', expected: [1, 'foo']},
+ {input: ' 1 ; foo', expected: [1, 'foo']},
+ {input: ' 1 , foo', expected: [1, 'foo']},
+ {input: ' 1 url = foo', expected: [1, 'foo']},
+ {input: '1; url=foo ', expected: [1, 'foo']},
+ {input: '1; url=f\to\no', expected: [1, 'foo']},
+ {input: '1; url="foo"bar', expected: [1, 'foo']},
+ {input: '1; url=\'foo\'bar', expected: [1, 'foo']},
+ {input: '1; url="foo\'bar', expected: [1, 'foo\'bar']},
+ {input: '1; url foo', expected: [1, 'url foo']},
+ {input: '1; urlfoo', expected: [1, 'urlfoo']},
+ {input: '1; urfoo', expected: [1, 'urfoo']},
+ {input: '1; ufoo', expected: [1, 'ufoo']},
+ {input: '1; "foo"bar', expected: [1, 'foo']},
+ {input: '; foo', expected: []},
+ {input: ';foo', expected: []},
+ {input: ', foo', expected: []},
+ {input: ',foo', expected: []},
+ {input: 'foo', expected: []},
+ {input: '+1; url=foo', expected: []},
+ {input: '-1; url=foo', expected: []},
+ {input: '+0; url=foo', expected: []},
+ {input: '-0; url=foo', expected: []},
+ {input: '0; url=foo', expected: [0, 'foo']},
+ {input: '+1; foo', expected: []},
+ {input: '-1; foo', expected: []},
+ {input: '+0; foo', expected: []},
+ {input: '-0; foo', expected: []},
+ {input: '0; foo', expected: [0, 'foo']},
+ {input: '+1', expected: []},
+ {input: '-1', expected: []},
+ {input: '+0', expected: []},
+ {input: '-0', expected: []},
+ {input: '0', expected: [0, '__filename__']},
+ {input: '1.9; url=foo', expected: [1, 'foo']},
+ {input: '1.9..5.; url=foo', expected: [1, 'foo']},
+ {input: '.9; url=foo', expected: [0, 'foo']},
+ {input: '0.9; url=foo', expected: [0, 'foo']},
+ {input: '0...9; url=foo', expected: [0, 'foo']},
+ {input: '0...; url=foo', expected: [0, 'foo']},
+ {input: '1e0; url=foo', expected: []},
+ {input: '1e1; url=foo', expected: []},
+ {input: '10e-1; url=foo', expected: []},
+ {input: '-0.1; url=foo', expected: []},
+];
+
+tests_arr.forEach(function(test_obj) {
+ ["<meta>", "Refresh header"].forEach(type => {
+ if(type === "Refresh header" && test_obj.input.match("[\n\r\f]")) { // See https://github.com/web-platform-tests/wpt/issues/8372 for why \f as well
+ return;
+ }
+ const filename = type === "<meta>" ? "refresh.sub.html" : "refresh.py";
+ subsetTest(async_test, function(t) {
+ var iframe = document.createElement('iframe');
+ t.add_cleanup(function() {
+ document.body.removeChild(iframe);
+ });
+ iframe.src = "support/" + filename + "?input=" + encodeURIComponent(test_obj.input);
+ document.body.appendChild(iframe);
+ var loadCount = 0;
+ iframe.onload = t.step_func(function() {
+ loadCount++;
+ var got = iframe.contentDocument.body.textContent.trim();
+ if (test_obj.expected.length === 0) {
+ assert_equals(got, filename);
+ if (loadCount === 1) {
+ t.step_timeout(function() {
+ t.done();
+ }, 3000); // want to make sure it doesn't redirect when it shouldn't
+ } else {
+ assert_unreached('Got > 1 load events');
+ }
+ } else {
+ if (loadCount === 2) {
+ if(test_obj.expected[1] === "__filename__") {
+ assert_equals(got, filename);
+ } else {
+ assert_equals(got, test_obj.expected[1]);
+ }
+ t.done();
+ }
+ }
+ });
+ }, type + ": " + format_value(test_obj.input));
+ });
+});
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/remove-from-document.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/remove-from-document.html
new file mode 100644
index 0000000000..1e608a3456
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/remove-from-document.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>A meta must refresh the original document even if it was removed.</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#attr-meta-http-equiv-refresh">
+
+<div id="log"></div>
+
+<script>
+"use strict";
+setup({ single_test: true });
+
+const sourceIFrame = document.createElement("iframe");
+let sourceLoadCount = 0;
+
+sourceIFrame.onload = () => {
+ ++sourceLoadCount;
+
+ if (sourceLoadCount === 2) {
+ assert_equals(sourceIFrame.contentDocument.body.textContent.trim(), "foo");
+ done();
+ }
+
+ maybeStartTest();
+};
+
+function maybeStartTest() {
+ if (sourceLoadCount === 1) {
+ sourceIFrame.contentDocument.querySelector("meta").remove();
+ }
+}
+
+sourceIFrame.src = "support/refresh.sub.html?input=" + encodeURIComponent("1; url=foo");
+
+document.body.appendChild(sourceIFrame);
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/;url=foo b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/;url=foo
new file mode 100644
index 0000000000..622ff110d3
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/;url=foo
@@ -0,0 +1 @@
+;url=foo
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/__dir__.headers b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/__dir__.headers
new file mode 100644
index 0000000000..156209f9c8
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/__dir__.headers
@@ -0,0 +1 @@
+Content-Type: text/html
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/foo b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/foo
new file mode 100644
index 0000000000..257cc5642c
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/foo
@@ -0,0 +1 @@
+foo
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/foo'bar b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/foo'bar
new file mode 100644
index 0000000000..80e7410879
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/foo'bar
@@ -0,0 +1 @@
+foo'bar
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/refresh.py b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/refresh.py
new file mode 100644
index 0000000000..797c7b9412
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/refresh.py
@@ -0,0 +1,4 @@
+def main(request, response):
+ response.headers.set(b"Content-Type", b"text/html")
+ response.headers.set(b"Refresh", request.GET.first(b"input"))
+ response.content = u"<!doctype html>refresh.py\n"
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/refresh.sub.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/refresh.sub.html
new file mode 100644
index 0000000000..bc97f29c62
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/refresh.sub.html
@@ -0,0 +1 @@
+<!doctype html><meta http-equiv=refresh content="{{GET[input]}}">refresh.sub.html
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/ufoo b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/ufoo
new file mode 100644
index 0000000000..8fff3cf4fb
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/ufoo
@@ -0,0 +1 @@
+ufoo
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/urfoo b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/urfoo
new file mode 100644
index 0000000000..7d7373f4b7
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/urfoo
@@ -0,0 +1 @@
+urfoo
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/url foo b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/url foo
new file mode 100644
index 0000000000..a1e6a92290
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/url foo
@@ -0,0 +1 @@
+url foo
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/urlfoo b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/urlfoo
new file mode 100644
index 0000000000..3e67b2f7ca
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/urlfoo
@@ -0,0 +1 @@
+urlfoo
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/x;url=foo b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/x;url=foo
new file mode 100644
index 0000000000..f10371aa7b
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/attr-meta-http-equiv-refresh/support/x;url=foo
@@ -0,0 +1 @@
+x;url=foo
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-lower.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-lower.html
new file mode 100644
index 0000000000..026e61c2ca
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-lower.html
@@ -0,0 +1,5 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<meta http-equiv="content-security-policy" content="script-src 'self'">
+<script>inline = true;</script>
+<script src="http-equiv-enumerated-ascii-case-insensitive-message.js"></script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-message.js b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-message.js
new file mode 100644
index 0000000000..1dc218a0a5
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-message.js
@@ -0,0 +1 @@
+parent.postMessage(null, "*");
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-mixed.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-mixed.html
new file mode 100644
index 0000000000..b4c547d342
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-mixed.html
@@ -0,0 +1,5 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<meta http-equiv="CoNtEnT-sEcUrItY-pOlIcY" content="script-src 'self'">
+<script>inline = true;</script>
+<script src="http-equiv-enumerated-ascii-case-insensitive-message.js"></script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-other.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-other.html
new file mode 100644
index 0000000000..5c89a5e8bc
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive-other.html
@@ -0,0 +1,5 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<meta http-equiv="content-ſecurity-policy" content="script-src 'self'">
+<script>inline = true;</script>
+<script src="http-equiv-enumerated-ascii-case-insensitive-message.js"></script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive.html
new file mode 100644
index 0000000000..6d19be4149
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/pragma-directives/http-equiv-enumerated-ascii-case-insensitive.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="help" href="https://html.spec.whatwg.org/#attr-meta-http-equiv">
+<link rel="help" href="https://html.spec.whatwg.org/#enumerated-attribute">
+<meta name="assert" content="meta@http-equiv values are ASCII case-insensitive">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script>
+async_test(function() {
+ let loaded = 0;
+
+ // we use a message rather than the iframe’s load event to avoid dealing with
+ // spurious load events that some browsers dispatch on the initial about:blank
+ addEventListener("message", this.step_func(event => {
+ if (++loaded == 3) {
+ const iframe = document.querySelectorAll("iframe");
+
+ assert_equals(iframe[0].contentWindow.inline,
+ undefined, "lowercase valid");
+ assert_equals(iframe[1].contentWindow.inline,
+ undefined, "mixed case valid");
+ assert_equals(iframe[2].contentWindow.inline,
+ true, "non-ASCII invalid");
+
+ this.done();
+ }
+ }));
+}, "keyword content-security-policy");
+</script>
+<iframe src="http-equiv-enumerated-ascii-case-insensitive-lower.html"></iframe>
+<iframe src="http-equiv-enumerated-ascii-case-insensitive-mixed.html"></iframe>
+<iframe src="http-equiv-enumerated-ascii-case-insensitive-other.html"></iframe>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/the-lang-attribute-012.html b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/the-lang-attribute-012.html
new file mode 100644
index 0000000000..af872d6e3a
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-meta-element/the-lang-attribute-012.html
@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<html >
+<head>
+<meta charset="utf-8"/>
+ <meta http-equiv="Content-Language" content="ko,zh,ja" >
+<title>Multiple languages in Content-Language meta element</title>
+<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'>
+<link rel='help' href='https://html.spec.whatwg.org/multipage/#pragma-directives'>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<meta name='flags' content='dom'>
+<style type='text/css'>
+ #colonlangcontroltest { color: red; font-weight: bold; width: 400px; }
+ #colonlangcontroltest:lang(xx) { display:none; }
+.test div { width: 50px; }
+
+#box:lang(ko) { width: 100px; }
+#box:lang(zh) { width: 100px; }
+#box:lang(ja) { width: 100px; }
+
+ /* styling for debugging related notes */
+ .notes span:lang(ko) { background-color: #0000FF; color: white; padding: 0 5px; }
+ .notes span:lang(zh) { background-color: #0000FF; color: white; padding: 0 5px; }
+ .notes span:lang(ja) { background-color: #0000FF; color: white; padding: 0 5px; }
+
+</style>
+</head>
+<body>
+
+
+
+<div class="test"><div id="box">&#xA0;</div></div>
+<p lang='xx' id='colonlangcontroltest'>This test failed because it relies on :lang for results, but :lang is not supported by this browser.</p>
+
+
+<!--Notes:
+
+This test uses :lang to detect whether the language has been set. If :lang is not supported, a message will appear and the test will fail.
+
+-->
+<script>
+test(function() {
+assert_equals(document.getElementById('colonlangcontroltest').offsetWidth, 0)
+assert_equals(document.getElementById('box').offsetWidth, 50);
+}, "The UA will not recognize a language declaration in the Content-Language meta element when more than one language is declared.");
+</script>
+
+<div id='log'></div>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/historical.html b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/historical.html
new file mode 100644
index 0000000000..d475f5b3c8
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/historical.html
@@ -0,0 +1,14 @@
+<!doctype html>
+<title>Historical style element features should not be supported</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script>
+function t(property) {
+ test(function() {
+ assert_false(property in document.createElement('style'));
+ }, 'style.' + property + ' should not be supported');
+}
+// added in https://github.com/whatwg/html/commit/29cf39d2163cfc85b67409f4e10390619ffb2b40
+// removed in https://github.com/whatwg/html/commit/c2a3b2a2e3db49c14b486a5e99acf7d10cfe8443
+t('scoped');
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/html_style_in_comment-ref.html b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/html_style_in_comment-ref.html
new file mode 100644
index 0000000000..999383c769
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/html_style_in_comment-ref.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>[style] Reference file</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<style>
+ h4 {
+ color: green;
+ }
+</style>
+<body>
+ <p>
+ This page tests that Style written inside HTML comment is not applied
+ </p>
+ This test passes if the text below is <b>Green. NOT Red.</b>
+ <h4>
+ This is some text.
+ </h4>
+</body>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/html_style_in_comment.xhtml b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/html_style_in_comment.xhtml
new file mode 100644
index 0000000000..839548f01c
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/html_style_in_comment.xhtml
@@ -0,0 +1,18 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<link rel="match" href="html_style_in_comment-ref.html"/>
+<style type="text/css">
+h4 {color: green}
+<!--
+h4 {color: red}
+-->
+</style>
+</head>
+<body>
+<p> This page tests that Style written inside HTML comment is not applied</p>
+This test passes if the text below is <b>Green. NOT Red.</b>
+<h4>
+This is some text.
+</h4>
+</body>
+</html>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/mutations.window.js b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/mutations.window.js
new file mode 100644
index 0000000000..1c93b40394
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/mutations.window.js
@@ -0,0 +1,48 @@
+test(t => {
+ const style = document.body.appendChild(document.createElement("style"));
+ const sheet = style.sheet;
+ t.add_cleanup(() => style.remove());
+ assert_not_equals(sheet, null);
+ style.appendChild(new Comment());
+ assert_not_equals(sheet, style.sheet);
+}, "Mutating the style element: inserting a Comment node");
+
+test(t => {
+ const style = document.body.appendChild(document.createElement("style"));
+ t.add_cleanup(() => style.remove());
+ const comment = style.appendChild(new Comment());
+ const sheet = style.sheet;
+ comment.appendData("x");
+ assert_not_equals(sheet, style.sheet);
+}, "Mutating the style element: mutating a Comment node");
+
+test(t => {
+ const style = document.body.appendChild(document.createElement("style"));
+ t.add_cleanup(() => style.remove());
+ const text1 = style.appendChild(new Text("1"));
+ const text2 = style.appendChild(new Text("2"));
+ assert_equals(style.textContent, "12");
+ assert_equals(style.childNodes.length, 2);
+ const sheet = style.sheet;
+ style.normalize();
+ assert_equals(style.childNodes.length, 1);
+ assert_not_equals(sheet, style.sheet);
+}, "Mutating the style element: using normalize()");
+
+test(t => {
+ const style = document.body.appendChild(document.createElement("style"));
+ t.add_cleanup(() => style.remove());
+ const comment = style.appendChild(new Comment());
+ const sheet = style.sheet;
+ comment.remove();
+ assert_not_equals(sheet, style.sheet);
+}, "Mutating the style element: removing a Comment node");
+
+test(t => {
+ const style = document.body.appendChild(document.createElement("style"));
+ const sheet = style.sheet;
+ t.add_cleanup(() => style.remove());
+ assert_not_equals(sheet, null);
+ style.appendChild(new DocumentFragment());
+ assert_equals(sheet, style.sheet);
+}, "Mutating the style element: inserting an empty DocumentFragment node");
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style-error-01.html b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style-error-01.html
new file mode 100644
index 0000000000..0bdef0e175
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style-error-01.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<title>style: error events</title>
+<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-style-element">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<div id="log"></div>
+<div id="test">
+<script>
+//var t404 = async_test("Should get an error event for a 404 error.")
+//t404.step(function() {
+// var elt = document.createElement("style");
+// elt.onerror = t404.step_func(function() {
+// assert_true(true, "Got error event for 404 error.")
+// t404.done()
+// })
+// elt.appendChild(
+// document.createTextNode('@import 404 error;'));
+// document.getElementsByTagName("head")[0].appendChild(elt);
+//})
+var tText = async_test("Should get an error event for a text/plain response.")
+tText.step(function() {
+ var elt = document.createElement("style");
+ elt.onerror = tText.step_func(function() {
+ assert_true(true, "Got error event for 404 error.")
+ tText.done()
+ })
+ elt.appendChild(
+ document.createTextNode('@import "support/css-red.txt";'));
+ document.getElementsByTagName("head")[0].appendChild(elt);
+})
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style-load-after-mutate.html b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style-load-after-mutate.html
new file mode 100644
index 0000000000..901c5c1ac2
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style-load-after-mutate.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<title>The 'load' event on the style element should still fire after mutation</title>
+<link rel="help" href="https://crbug.com/1323319">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script>
+promise_test(async () => {
+ const style = document.createElement('style');
+ document.head.appendChild(style);
+ style.appendChild(document.createTextNode('@import url(/support/css-red.txt);'));
+ style.appendChild(document.createTextNode('body {color: green; }'));
+
+ // The 'load' event should fire.
+ await new Promise(resolve => style.onload = resolve);
+});
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_disabled.html b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_disabled.html
new file mode 100644
index 0000000000..1a88bf1305
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_disabled.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <title>HTML Test: The style should not be applied if it is disabled</title>
+ <link rel="author" title="Intel" href="http://www.intel.com/">
+ <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-style-element">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <style>
+ #test {
+ width: 100px;
+ }
+ </style>
+ <style id="style">
+ #test {
+ width: 50px;
+ }
+ </style>
+ </head>
+ <body>
+ <div id="log"></div>
+ <div id="test"></div>
+ <script>
+ test(function() {
+ var testElement = document.getElementById("test");
+ var style = document.getElementById("style");
+ var width1, width2;
+
+ width1 = window.getComputedStyle(testElement)["width"];
+ assert_equals(width1, "50px", "The style should be applied.");
+
+ style.disabled = true;
+ width2 = window.getComputedStyle(testElement)["width"];
+ assert_equals(width2, "100px", "The style should not be applied.");
+ }, "The style is not applied when it is disabled");
+ </script>
+ </body>
+</html>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_events.html b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_events.html
new file mode 100644
index 0000000000..5e07e50882
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_events.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <title>HTML Test: The style events</title>
+ <link rel="author" title="Intel" href="http://www.intel.com/">
+ <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-style-element">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script>
+ var tLoad = async_test("If the style is loaded successfully, the 'load' event must be fired");
+ var tError = async_test("If the style is loaded unsuccessfully, the 'error' event must be fired");
+
+ function onstyleload(e) {
+ tLoad.done();
+ }
+
+ function onstyleerror(e) {
+ tError.done();
+ }
+ </script>
+ <style onload="onstyleload()">
+ #test {
+ height: 100px;
+ width: 100px;
+ }
+ </style>
+ <style onerror="onstyleerror()">
+ @import url(nonexistent.css);
+ </style>
+ </head>
+ <body>
+ <div id="log"></div>
+ <div id="test"></div>
+ </body>
+</html>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_load_async.html b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_load_async.html
new file mode 100644
index 0000000000..ef8ac89c46
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_load_async.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<html>
+<meta charset="utf-8">
+<title>Style load event should be async</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script>
+ var t = async_test("style load should be async");
+ var sync = true;
+ function check() {
+ assert_false(sync);
+ t.done();
+ }
+</script>
+<style onload="t.step(check)">
+</style>
+<script>
+ sync = false
+</script>
+
+<body>
+ <div id="log"></div>
+ <div id="test"></div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_load_event.html b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_load_event.html
new file mode 100644
index 0000000000..d852661791
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_load_event.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<title>HTML Test: The style load event should fire when textContent is changed</title>
+<link rel="author" href="mailto:masonf@chromium.org">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#update-a-style-block">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+
+<script>
+ var loadCount = 0;
+ function load() { loadCount++; }
+</script>
+
+<style id=target onload="load()">
+ .box { color:red; }
+</style>
+<div class='box'>Box</div>
+
+<script>
+window.onload = () => {
+ const target = document.getElementById('target');
+ promise_test(async t => {
+ assert_equals(loadCount,1,"Style element should have loaded once by now");
+ target.textContent = `.box { color: green; }`;
+ await new Promise(resolve => target.addEventListener('load', resolve));
+ assert_equals(loadCount,2,"Style element should fire the load event when textContent changes");
+ },"style load event should fire when textContent changed");
+};
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_media.html b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_media.html
new file mode 100644
index 0000000000..04bcbc53ef
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_media.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <title>HTML Test: The style information must be applied to the environment specified by the media attribute</title>
+ <link rel="author" title="Intel" href="http://www.intel.com/">
+ <link rel="help" href="https://html.spec.whatwg.org/multipage/#attr-style-media">
+ <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-style-element">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <style>
+ #test {
+ width: 100px;
+ }
+ </style>
+ <style id="style">
+ #test {
+ width: 50px;
+ }
+ </style>
+ </head>
+ <body>
+ <div id="log"></div>
+ <div id="test"></div>
+ <script>
+ test(function() {
+ var testElement = document.getElementById("test");
+ var style = document.getElementById("style");
+ var width1, width2;
+
+ width1 = window.getComputedStyle(testElement)["width"];
+ assert_equals(width1, "50px", "The style should be applied.");
+
+ style.media = "print";
+ width2 = window.getComputedStyle(testElement)["width"];
+ assert_equals(width2, "100px", "The style should not be applied.");
+ }, "The style information must be applied to the environment specified by the media attribute");
+ </script>
+ </body>
+</html>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_media_change.html b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_media_change.html
new file mode 100644
index 0000000000..8b7e8440d5
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_media_change.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <title>Dynamically changing HTMLStyleElement.media should change the rendering accordingly</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-style-element">
+ <style>
+ span {
+ color: red;
+ }
+ </style>
+ <style id="text-style" media="none">
+ span {
+ color: green;
+ }
+ </style>
+ <style id="body-style" media="aural">
+ body {
+ color: green;
+ }
+ </style>
+ </head>
+ <body>
+ <span>text</span>
+ <script>
+ test(function() {
+ var element = document.querySelector("span");
+ assert_equals(getComputedStyle(element).color, "rgb(255, 0, 0)");
+ document.getElementById("text-style").media = 'all';
+ assert_equals(getComputedStyle(element).color, "rgb(0, 128, 0)");
+ }, "change media value dynamically");
+
+ test(function() {
+ var style = document.getElementById("body-style");
+ assert_not_equals(getComputedStyle(document.querySelector("body")).color, "rgb(0, 128, 0)");
+ style.removeAttribute("media");
+ assert_equals(getComputedStyle(document.querySelector("body")).color, "rgb(0, 128, 0)");
+ }, "removing media attribute");
+ </script>
+ </body>
+</html> \ No newline at end of file
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_non_matching_media.html b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_non_matching_media.html
new file mode 100644
index 0000000000..74d3554b13
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_non_matching_media.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <title>HTML Test: Non-matching media type should have stylesheet</title>
+ <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-style-element">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <style media="unknown">
+ body { color: green }
+ </style>
+ </head>
+ <body>
+ <script>
+ test(function() {
+ assert_equals(document.styleSheets.length, 1);
+ });
+ </script>
+ </body>
+</html>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_type_change.html b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_type_change.html
new file mode 100644
index 0000000000..a19b3c86d7
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_type_change.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <title>Dynamically changing HTMLStyleElement.type should change the rendering accordingly</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-style-element">
+ <style type="no/mime">
+ body { color: green }
+ </style>
+ </head>
+ <body>
+ Text content.
+ <script>
+ var style = document.querySelector("style");
+ test(function() {
+ assert_equals(document.styleSheets.length, 0);
+ }, "Check initial styleSheets length type");
+
+ test(function() {
+ assert_not_equals(getComputedStyle(document.querySelector("body")).color, "rgb(0, 128, 0)");
+ assert_equals(document.styleSheets.length, 0);
+ style.type = "text/css";
+ assert_equals(getComputedStyle(document.querySelector("body")).color, "rgb(0, 128, 0)");
+ assert_equals(document.styleSheets.length, 1);
+ }, "Change type from invalid type to valid type");
+
+ test(function() {
+ assert_equals(getComputedStyle(document.querySelector("body")).color, "rgb(0, 128, 0)");
+ assert_equals(document.styleSheets.length, 1);
+ style.type = "no/mime";
+ assert_not_equals(getComputedStyle(document.querySelector("body")).color, "rgb(0, 128, 0)");
+ assert_equals(document.styleSheets.length, 0);
+ }, "Change type from valid type to invalid type");
+
+ </script>
+ </body>
+</html> \ No newline at end of file
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_type_html.html b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_type_html.html
new file mode 100644
index 0000000000..cc48868bd7
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_type_html.html
@@ -0,0 +1,71 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>&lt;style> type="" edge cases</title>
+<link rel="author" title="Domenic Denicola" href="mailto:d@domenic.me">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#update-a-style-block">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+
+<style>
+#test1 { color: rgb(0, 128, 0); }
+</style>
+
+<style type="">
+#test2 { color: rgb(0, 128, 0); }
+</style>
+
+<style type="TEXT/CsS">
+#test3 { color: rgb(0, 128, 0); }
+</style>
+
+<style type=" text/css ">
+#test4 { color: rgb(0, 128, 0); }
+</style>
+
+<style type="text/css; charset=utf-8">
+#test5 { color: rgb(0, 128, 0); }
+</style>
+
+<body>
+
+<div id="test1"></div>
+<div id="test2"></div>
+<div id="test3"></div>
+<div id="test4"></div>
+<div id="test5"></div>
+
+<script>
+"use strict";
+
+test(() => {
+ assertApplied("test1");
+}, "With no type attribute, the style should apply");
+
+test(() => {
+ assertApplied("test2");
+}, "With an empty type attribute, the style should apply");
+
+test(() => {
+ assertApplied("test3");
+}, "With a mixed-case type attribute, the style should apply");
+
+test(() => {
+ assertNotApplied("test4");
+}, "With a whitespace-surrounded type attribute, the style should not apply");
+
+test(() => {
+ assertNotApplied("test5");
+}, "With a charset parameter in the type attribute, the style should not apply");
+
+function getColor(id) {
+ return window.getComputedStyle(document.getElementById(id)).color;
+}
+
+function assertApplied(id) {
+ assert_equals(getColor(id), "rgb(0, 128, 0)");
+}
+
+function assertNotApplied(id) {
+ assert_not_equals(getColor(id), "rgb(0, 128, 0)");
+}
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_type_svg.svg b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_type_svg.svg
new file mode 100644
index 0000000000..6b0d1e874e
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_type_svg.svg
@@ -0,0 +1,75 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg"
+ xmlns:h="http://www.w3.org/1999/xhtml"
+ width="800px" height="8000px">
+ <title>&lt;style&gt; type="" edge cases</title>
+ <metadata>
+ <h:link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#update-a-style-block"/>
+ </metadata>
+ <h:script src="/resources/testharness.js"/>
+ <h:script src="/resources/testharnessreport.js"/>
+
+ <style>
+ #test1 { color: rgb(0, 128, 0); }
+ </style>
+
+ <style type="">
+ #test2 { color: rgb(0, 128, 0); }
+ </style>
+
+ <style type="TEXT/CsS">
+ #test3 { color: rgb(0, 128, 0); }
+ </style>
+
+ <style type=" text/css ">
+ #test4 { color: rgb(0, 128, 0); }
+ </style>
+
+ <style type="text/css; charset=utf-8">
+ #test5 { color: rgb(0, 128, 0); }
+ </style>
+
+ <h:body>
+ <h:div id="test1"/>
+ <h:div id="test2"/>
+ <h:div id="test3"/>
+ <h:div id="test4"/>
+ <h:div id="test5"/>
+
+ <h:script><![CDATA[
+ "use strict";
+
+ test(() => {
+ assertApplied("test1");
+ }, "With no type attribute, the style should apply");
+
+ test(() => {
+ assertApplied("test2");
+ }, "With an empty type attribute, the style should apply");
+
+ test(() => {
+ assertApplied("test3");
+ }, "With a mixed-case type attribute, the style should apply");
+
+ test(() => {
+ assertNotApplied("test4");
+ }, "With a whitespace-surrounded type attribute, the style should not apply");
+
+ test(() => {
+ assertNotApplied("test5");
+ }, "With a charset parameter in the type attribute, the style should not apply");
+
+ function getColor(id) {
+ return window.getComputedStyle(document.getElementById(id)).color;
+ }
+
+ function assertApplied(id) {
+ assert_equals(getColor(id), "rgb(0, 128, 0)");
+ }
+
+ function assertNotApplied(id) {
+ assert_not_equals(getColor(id), "rgb(0, 128, 0)");
+ }
+ ]]></h:script>
+ </h:body>
+</svg>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/support/css-red.txt b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/support/css-red.txt
new file mode 100644
index 0000000000..9ef04cbd12
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/support/css-red.txt
@@ -0,0 +1 @@
+html { color: red; }
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/update-style-block-ascii-case-insensitive-ref.html b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/update-style-block-ascii-case-insensitive-ref.html
new file mode 100644
index 0000000000..5ac2432547
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/update-style-block-ascii-case-insensitive-ref.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<style>
+p:after { font-weight: bold; }
+p:after { content: "PASS"; color: green; }
+</style>
+<p>text/css treated as CSS?
+<p>TeXt/CsS treated as CSS?
+<p>text/cſs ignored?
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/update-style-block-ascii-case-insensitive.html b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/update-style-block-ascii-case-insensitive.html
new file mode 100644
index 0000000000..3c5cd152d6
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/update-style-block-ascii-case-insensitive.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="help" href="https://html.spec.whatwg.org/#update-a-style-block">
+<link rel="match" href="update-style-block-ascii-case-insensitive-ref.html">
+<meta name="assert" content="style@type values are ASCII case-insensitive">
+<style>
+p:after { font-weight: bold; }
+p:after { content: "FAIL"; color: red; }
+#c:after { content: "PASS"; color: green; }
+</style>
+<style type="text/css">#a:after { content: "PASS"; color: green; }</style>
+<style type="TeXt/CsS">#b:after { content: "PASS"; color: green; }</style>
+<style type="text/cſs">#c:after { content: "FAIL"; color: red; }</style>
+<p id="a">text/css treated as CSS?
+<p id="b">TeXt/CsS treated as CSS?
+<p id="c">text/cſs ignored?
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-01.html b/testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-01.html
new file mode 100644
index 0000000000..7f25400ea8
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-01.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<title>title.text with comment and element children.</title>
+<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#dom-title-text">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<div id="log"></div>
+<script>
+try {
+ var title = document.getElementsByTagName("title")[0];
+ while (title.childNodes.length)
+ title.removeChild(title.childNodes[0]);
+ title.appendChild(document.createComment("COMMENT"));
+ title.appendChild(document.createTextNode("TEXT"));
+ title.appendChild(document.createElement("a"))
+ .appendChild(document.createTextNode("ELEMENT"))
+} catch (e) {
+}
+</script>
+<script>
+test(function() {
+ assert_equals(title.text, "TEXT");
+ assert_equals(title.textContent, "TEXTELEMENT");
+})
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-02.xhtml b/testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-02.xhtml
new file mode 100644
index 0000000000..068b105046
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-02.xhtml
@@ -0,0 +1,30 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<title>title.text with comment and element children.</title>
+<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com"/>
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#dom-title-text"/>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+</head>
+<body>
+<div id="log"></div>
+<script>
+try {
+ var title = document.getElementsByTagName("title")[0];
+ while (title.childNodes.length)
+ title.removeChild(title.childNodes[0]);
+ title.appendChild(document.createComment("COMMENT"));
+ title.appendChild(document.createTextNode("TEXT"));
+ title.appendChild(document.createElement("a"))
+ .appendChild(document.createTextNode("ELEMENT"))
+} catch (e) {
+}
+</script>
+<script>
+test(function() {
+ assert_equals(title.text, "TEXT");
+ assert_equals(title.textContent, "TEXTELEMENT");
+})
+</script>
+</body>
+</html>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-03.html b/testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-03.html
new file mode 100644
index 0000000000..1c119a825c
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-03.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<title> title.text and space normalization </title>
+<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#dom-title-text">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<div id="log"></div>
+<script>
+test(function() {
+ assert_equals(document.getElementsByTagName("title")[0].text,
+ " title.text and space normalization ");
+ assert_equals(document.getElementsByTagName("title")[0].textContent,
+ " title.text and space normalization ");
+ assert_equals(document.getElementsByTagName("title")[0].firstChild.nodeValue,
+ " title.text and space normalization ");
+}, "title.text and space normalization (markup)");
+[
+ "one space", "two spaces",
+ "one\ttab", "two\t\ttabs",
+ "one\nnewline", "two\n\nnewlines",
+ "one\fform feed", "two\f\fform feeds",
+ "one\rcarriage return", "two\r\rcarriage returns"
+].forEach(function(str) {
+ test(function() {
+ document.title = str;
+ var title = document.getElementsByTagName("title")[0];
+ assert_equals(title.text, str);
+ assert_equals(title.textContent, str);
+ assert_equals(title.firstChild.nodeValue, str);
+ }, "title.text and space normalization: " + format_value(str))
+});
+</script>
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-04.xhtml b/testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-04.xhtml
new file mode 100644
index 0000000000..de382ab4d5
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-title-element/title.text-04.xhtml
@@ -0,0 +1,37 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<title> title.text and space normalization </title>
+<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com"/>
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#dom-title-text"/>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+</head>
+<body>
+<div id="log"></div>
+<script>
+test(function() {
+ assert_equals(document.getElementsByTagName("title")[0].text,
+ " title.text and space normalization ");
+ assert_equals(document.getElementsByTagName("title")[0].textContent,
+ " title.text and space normalization ");
+ assert_equals(document.getElementsByTagName("title")[0].firstChild.nodeValue,
+ " title.text and space normalization ");
+}, "title.text and space normalization (markup)");
+[
+ "one space", "two spaces",
+ "one\ttab", "two\t\ttabs",
+ "one\nnewline", "two\n\nnewlines",
+ "one\fform feed", "two\f\fform feeds",
+ "one\rcarriage return", "two\r\rcarriage returns"
+].forEach(function(str) {
+ test(function() {
+ document.title = str;
+ var title = document.getElementsByTagName("title")[0];
+ assert_equals(title.text, str);
+ assert_equals(title.textContent, str);
+ assert_equals(title.firstChild.nodeValue, str);
+ }, "title.text and space normalization: " + format_value(str))
+});
+</script>
+</body>
+</html>