summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/content-security-policy/style-src
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 17:32:43 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 17:32:43 +0000
commit6bf0a5cb5034a7e684dcc3500e841785237ce2dd (patch)
treea68f146d7fa01f0134297619fbe7e33db084e0aa /testing/web-platform/tests/content-security-policy/style-src
parentInitial commit. (diff)
downloadthunderbird-6bf0a5cb5034a7e684dcc3500e841785237ce2dd.tar.xz
thunderbird-6bf0a5cb5034a7e684dcc3500e841785237ce2dd.zip
Adding upstream version 1:115.7.0.upstream/1%115.7.0upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to '')
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-attr-allowed-src-blocked.html24
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-attr-blocked-src-allowed.html27
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-allowed-attr-blocked.html33
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-allowed-src-blocked.html27
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-blocked-attr-allowed.html33
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-blocked-src-allowed.html30
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/injected-inline-style-allowed.sub.html40
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/injected-inline-style-blocked.sub.html36
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/inline-style-allowed-while-cloning-objects.sub.html146
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/inline-style-allowed.sub.html34
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/inline-style-attribute-allowed.sub.html28
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/inline-style-attribute-blocked.sub.html27
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/inline-style-attribute-on-html.sub.html28
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/inline-style-blocked.sub.html33
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/resources/allowed.css3
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/resources/style-src-import.sub.css1
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/resources/style-src-inject-style.js5
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/resources/style-src.css1
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-allowed.sub.html28
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-blocked.html25
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-error-event-fires.html34
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-hash-allowed.html42
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-hash-blocked.html48
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-hash-case-insensitive.html55
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-hash-default-src-allowed.html42
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-imported-style-allowed.sub.html30
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-imported-style-blocked.html38
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-injected-inline-style-allowed-with-content-hash.html46
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-injected-inline-style-allowed.html34
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-injected-inline-style-blocked.html40
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-injected-stylesheet-allowed.sub.html35
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-injected-stylesheet-blocked.sub.html39
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-allowed.html34
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-attribute-allowed.html24
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-attribute-blocked.html28
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-blocked.html38
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-nonce-allowed.html34
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-nonce-blocked-error-event.html71
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-nonce-blocked.html37
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-multiple-policies-multiple-hashing-algorithms.html20
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-multiple-policies-multiple-hashing-algorithms.html.sub.headers7
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-none-blocked.html33
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-star-allowed.html29
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-stylesheet-nonce-allowed.html30
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/style-src-stylesheet-nonce-blocked.html33
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/stylehash-allowed.sub.html81
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/stylehash-basic-blocked.sub.html62
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/stylehash-default-src.sub.html27
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/stylenonce-allowed.sub.html58
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/stylenonce-blocked.sub.html40
-rw-r--r--testing/web-platform/tests/content-security-policy/style-src/support/inject-style.js5
51 files changed, 1783 insertions, 0 deletions
diff --git a/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-attr-allowed-src-blocked.html b/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-attr-allowed-src-blocked.html
new file mode 100644
index 0000000000..567e22496c
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-attr-allowed-src-blocked.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src-attr 'unsafe-inline';
+ style-src 'none';">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script>
+ var t = async_test("Should apply the style attribute");
+ window.addEventListener('securitypolicyviolation', t.unreached_func("Should not have fired a spv event"));
+ </script>
+</head>
+
+<body style="background: green">
+ <script>
+ t.step(function() {
+ assert_true(document.body.style.length > 0);
+ t.done();
+ });
+ </script>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-attr-blocked-src-allowed.html b/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-attr-blocked-src-allowed.html
new file mode 100644
index 0000000000..622c3bf764
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-attr-blocked-src-allowed.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src-attr 'none';
+ style-src 'unsafe-inline';">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script>
+ var t = async_test("Should fire a security policy violation event");
+ window.addEventListener('securitypolicyviolation', t.step_func_done(function(e) {
+ assert_equals(e.violatedDirective, 'style-src-attr');
+ assert_equals(e.blockedURI, 'inline');
+ }));
+ </script>
+</head>
+
+<body style="background: green">
+ <script>
+ async_test(function(test) {
+ assert_equals(document.body.style.length, 0);
+ test.done();
+ }, "The attribute style should not be applied");
+ </script>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-allowed-attr-blocked.html b/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-allowed-attr-blocked.html
new file mode 100644
index 0000000000..279600ea2e
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-allowed-attr-blocked.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src-elem 'unsafe-inline';
+ style-src-attr 'none';">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script>
+ var t = async_test("Should fire a security policy violation for the attribute");
+ window.addEventListener('securitypolicyviolation', t.step_func_done(function(e) {
+ assert_equals(e.violatedDirective, 'style-src-attr');
+ assert_equals(e.blockedURI, 'inline');
+ }));
+ </script>
+</head>
+
+<body style="background: green">
+ <style>
+ body {background: blue;}
+ </style>
+
+ <script>
+ async_test(function(test) {
+ assert_equals(document.body.style.length, 0);
+ assert_equals(document.styleSheets.length, 1);
+ test.done();
+ }, "The attribute style should not be applied and the inline style should be applied");
+ </script>
+
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-allowed-src-blocked.html b/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-allowed-src-blocked.html
new file mode 100644
index 0000000000..c15cf0bcf6
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-allowed-src-blocked.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src-elem 'unsafe-inline';
+ style-src 'none';">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script>
+ var t = async_test("Inline style should be applied");
+ window.addEventListener('securitypolicyviolation', t.unreached_func("Should not have fired a spv event"));
+ </script>
+</head>
+
+<body>
+ <style>
+ body {background: green;}
+ </style>
+ <script>
+ t.step(function() {
+ assert_equals(document.styleSheets.length, 1);
+ t.done();
+ });
+ </script>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-blocked-attr-allowed.html b/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-blocked-attr-allowed.html
new file mode 100644
index 0000000000..a42c9de9b8
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-blocked-attr-allowed.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src-elem 'none';
+ script-src-attr 'unsafe-inline'">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script>
+ var t = async_test("Should fire a security policy violation for the inline block");
+ window.addEventListener('securitypolicyviolation', t.step_func_done(function(e) {
+ assert_equals(e.violatedDirective, 'style-src-elem');
+ assert_equals(e.blockedURI, 'inline');
+ }));
+ </script>
+</head>
+
+<body style="background: green">
+ <style>
+ body {background: blue;}
+ </style>
+
+ <script>
+ async_test(function(test) {
+ assert_true(document.body.style.length > 0);
+ assert_equals(document.styleSheets.length, 0);
+ test.done();
+ }, "The inline style should not be applied and the attribute style should be applied");
+ </script>
+
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-blocked-src-allowed.html b/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-blocked-src-allowed.html
new file mode 100644
index 0000000000..bf5014a458
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src-attr-elem/style-src-elem-blocked-src-allowed.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src-elem 'none';
+ style-src 'unsafe-inline';">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script>
+ var t = async_test("Should fire a security policy violation event");
+ window.addEventListener('securitypolicyviolation', t.step_func_done(function(e) {
+ assert_equals(e.violatedDirective, 'style-src-elem');
+ assert_equals(e.blockedURI, 'inline');
+ }));
+ </script>
+</head>
+
+<body>
+ <style>
+ body {background: green;}
+ </style>
+ <script>
+ async_test(function(test) {
+ assert_equals(document.styleSheets.length, 0);
+ test.done();
+ }, "The inline style should not be applied");
+ </script>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/injected-inline-style-allowed.sub.html b/testing/web-platform/tests/content-security-policy/style-src/injected-inline-style-allowed.sub.html
new file mode 100644
index 0000000000..276f946728
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/injected-inline-style-allowed.sub.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <!-- Programmatically converted from a WebKit Reftest, please forgive resulting idiosyncracies.-->
+ <meta http-equiv="Content-Security-Policy" content="style-src 'unsafe-inline'; script-src 'self' 'unsafe-inline'; connect-src 'self';">
+ <title>injected-inline-style-allowed</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script src='../support/logTest.sub.js?logs=["PASS: 2 stylesheets on the page."]'></script>
+ <script src="../support/alertAssert.sub.js?alerts=[]"></script>
+</head>
+
+<body>
+ <script>
+ window.addEventListener('securitypolicyviolation', function(e) {
+ log("Fail");
+ });
+ </script>
+
+ <div id="test1">
+ FAIL 1/2
+ </div>
+
+ <div id="test2">
+ FAIL 2/2
+ </div>
+
+ <script src="support/inject-style.js"></script>
+ <script>
+ if (document.styleSheets.length === 2)
+ log("PASS: 2 stylesheets on the page.");
+ else
+ log("FAIL: " + document.styleSheets.length + " stylesheets on the page (should be 2).");
+
+ </script>
+ <div id="log"></div>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/injected-inline-style-blocked.sub.html b/testing/web-platform/tests/content-security-policy/style-src/injected-inline-style-blocked.sub.html
new file mode 100644
index 0000000000..9477a95978
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/injected-inline-style-blocked.sub.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <!-- Programmatically converted from a WebKit Reftest, please forgive resulting idiosyncracies.-->
+ <meta http-equiv="Content-Security-Policy" content="style-src 'none'; script-src 'self' 'unsafe-inline'; connect-src 'self';">
+ <title>injected-inline-style-blocked</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script src='../support/logTest.sub.js?logs=["violated-directive=style-src-elem","violated-directive=style-src-elem","PASS"]'></script>
+ <script src="../support/alertAssert.sub.js?alerts=[]"></script>
+</head>
+
+<body>
+ <script>
+ window.addEventListener('securitypolicyviolation', function(e) {
+ log("violated-directive=" + e.violatedDirective);
+ });
+ </script>
+
+ <div id="test1">
+ PASS 1/2
+ </div>
+ <div id="test2">
+ PASS 2/2
+ </div>
+
+ <script src="support/inject-style.js"></script>
+ <script>
+ log(document.styleSheets.length == 0 ? "PASS" : "FAIL");
+
+ </script>
+ <div id="log"></div>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/inline-style-allowed-while-cloning-objects.sub.html b/testing/web-platform/tests/content-security-policy/style-src/inline-style-allowed-while-cloning-objects.sub.html
new file mode 100644
index 0000000000..e99699410e
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/inline-style-allowed-while-cloning-objects.sub.html
@@ -0,0 +1,146 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <!-- Programmatically converted from a WebKit Reftest, please forgive resulting idiosyncracies.-->
+ <meta http-equiv="Content-Security-Policy" content="style-src 'self'; script-src 'self' 'unsafe-inline'; connect-src 'self';">
+ <title>inline-style-allowed-while-cloning-objects</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script>
+ setup({ explicit_done: true });
+
+ var t = async_test("Test that violation report event was fired");
+ window.addEventListener("securitypolicyviolation", t.step_func_done(function(e) {
+ assert_equals(e.violatedDirective, "style-src-attr");
+ }));
+ window.onload = function() {
+ try {
+ runTests();
+ } finally {
+ done();
+ }
+ };
+
+ function runTests() {
+ window.nodes = document.getElementById('nodes');
+ window.node1 = document.getElementById('node1');
+ window.node1.style.background = "yellow";
+ window.node1.style.color = "red";
+ window.node2 = document.getElementById('node1').cloneNode(true);
+ window.node2.id = "node2";
+ window.node3 = document.getElementById('node3');
+ window.node3.style.background = "blue";
+ window.node3.style.color = "green";
+ window.node4 = document.getElementById('node3').cloneNode(false);
+ window.node4.id = "node4";
+ window.node4.innerHTML = "Node #4";
+ nodes.appendChild(node1);
+ nodes.appendChild(node2);
+ nodes.appendChild(node3);
+ nodes.appendChild(node4);
+ test(function() {
+ assert_equals(node1.style.background.match(/yellow/)[0], "yellow")
+ });
+ test(function() {
+ assert_equals(node2.style.background.match(/yellow/)[0], "yellow")
+ });
+ test(function() {
+ assert_equals(node3.style.background.match(/blue/)[0], "blue")
+ });
+ test(function() {
+ assert_equals(node4.style.background.match(/blue/)[0], "blue")
+ });
+ test(function() {
+ assert_equals(node1.style.color, "red")
+ });
+ test(function() {
+ assert_equals(node2.style.color, "red")
+ });
+ test(function() {
+ assert_equals(node3.style.color, "green")
+ });
+ test(function() {
+ assert_equals(node4.style.color, "green")
+ });
+ test(function() {
+ assert_equals(window.getComputedStyle(node1).background, window.getComputedStyle(node2).background)
+ });
+ test(function() {
+ assert_equals(window.getComputedStyle(node3).background, window.getComputedStyle(node4).background)
+ });
+ test(function() {
+ assert_equals(window.getComputedStyle(node1).color, window.getComputedStyle(node2).color)
+ });
+ test(function() {
+ assert_equals(window.getComputedStyle(node3).color, window.getComputedStyle(node4).color)
+ });
+ window.ops = document.getElementById('ops');
+ ops.style.color = 'red';
+ window.clonedOps = ops.cloneNode(true);
+ window.violetOps = document.getElementById('violetOps');
+ violetOps.style.background = 'rgb(238, 130, 238)';
+ document.getElementsByTagName('body')[0].appendChild(clonedOps);
+ test(function() {
+ assert_equals(ops.style.background, "")
+ });
+ test(function() {
+ assert_equals(ops.style.color, "red")
+ });
+ test(function() {
+ assert_equals(clonedOps.style.background, "")
+ });
+ test(function() {
+ assert_equals(violetOps.style.background.match(/rgb\(238, 130, 238\)/)[0], "rgb(238, 130, 238)")
+ });
+ test(function() {
+ assert_equals(window.getComputedStyle(clonedOps).background, window.getComputedStyle(ops).background)
+ });
+ test(function() {
+ assert_equals(window.getComputedStyle(clonedOps).color, window.getComputedStyle(ops).color)
+ });
+ test(function() {
+ assert_equals(window.getComputedStyle(ops).background, window.getComputedStyle(violetOps).background)
+ });
+ test(function() {
+ assert_equals(window.getComputedStyle(clonedOps).background, window.getComputedStyle(violetOps).background)
+ });
+ test(function() {
+ assert_equals(ops.id, "ops")
+ });
+ test(function() {
+ assert_equals(ops.id, clonedOps.id)
+ });
+ test(function() {
+ let el = document.getElementById("svg");
+ assert_equals(el.getAttribute("style"), "");
+ el.style.background = violetOps.style.background;
+ assert_not_equals(el.style.background, "");
+ let clone = el.cloneNode(true);
+ assert_equals(el.style.background, clone.style.background)
+ }, "non-HTML namespace");
+ }
+
+ </script>
+</head>
+
+<body>
+ <p>
+ This test ensures that styles can be set by object.cloneNode()
+ </p>
+ <div id="nodes">
+ This is a div (nodes)
+ <div id="node1"> This is a div. (node 1 or 2)</div>
+ <div id="node3"> This is a div. (node 3 or 4)</div>
+ </div>
+ <div id="ops" style="background: rgb(238, 130, 238)">
+ Yet another div.
+ </div>
+ <div id="violetOps">
+ Yet another div.
+ </div>
+ <svg id="svg" style="background: rgb(238, 130, 238)"></svg>
+ <div id="log"></div>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/inline-style-allowed.sub.html b/testing/web-platform/tests/content-security-policy/style-src/inline-style-allowed.sub.html
new file mode 100644
index 0000000000..a0fbbb2c13
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/inline-style-allowed.sub.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <!-- Programmatically converted from a WebKit Reftest, please forgive resulting idiosyncracies.-->
+ <meta http-equiv="Content-Security-Policy" content="style-src 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-inline'; connect-src 'self';">
+ <title>inline-style-allowed</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script src='../support/logTest.sub.js?logs=["PASS"]'></script>
+ <script src="../support/alertAssert.sub.js?alerts=[]"></script>
+ <script>
+ window.addEventListener('securitypolicyviolation', function(e) {
+ log("Fail");
+ });
+ </script>
+
+ <style>
+ .target {
+ background-color: blue;
+ }
+
+ </style>
+</head>
+
+<body class="target">
+ <script>
+ log(document.styleSheets.length > 0 ? 'PASS' : 'FAIL');
+
+ </script>
+ <div id="log"></div>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/inline-style-attribute-allowed.sub.html b/testing/web-platform/tests/content-security-policy/style-src/inline-style-attribute-allowed.sub.html
new file mode 100644
index 0000000000..048e4067c5
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/inline-style-attribute-allowed.sub.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <!-- Programmatically converted from a WebKit Reftest, please forgive resulting idiosyncracies.-->
+ <meta http-equiv="Content-Security-Policy" content="style-src 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-inline'; connect-src 'self';">
+ <title>inline-style-attribute-allowed</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script src='../support/logTest.sub.js?logs=["PASS"]'></script>
+ <script src="../support/alertAssert.sub.js?alerts=[]"></script>
+</head>
+
+<body style="background-color: blue;">
+ <script>
+ window.addEventListener('securitypolicyviolation', function(e) {
+ log("Fail");
+ });
+ </script>
+
+ <script>
+ log(document.body.style.length > 0 ? 'PASS' : 'FAIL');
+
+ </script>
+ <div id="log"></div>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/inline-style-attribute-blocked.sub.html b/testing/web-platform/tests/content-security-policy/style-src/inline-style-attribute-blocked.sub.html
new file mode 100644
index 0000000000..71e5a88b7a
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/inline-style-attribute-blocked.sub.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <!-- Programmatically converted from a WebKit Reftest, please forgive resulting idiosyncracies.-->
+ <meta http-equiv="Content-Security-Policy" content="style-src 'none'; script-src 'self' 'unsafe-inline' 'unsafe-inline'; connect-src 'self';">
+ <title>inline-style-attribute-blocked</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script src='../support/logTest.sub.js?logs=["violated-directive=style-src-attr","PASS"]'></script>
+ <script src="../support/alertAssert.sub.js?alerts=[]"></script>
+ <script>
+ window.addEventListener('securitypolicyviolation', function(e) {
+ log("violated-directive=" + e.violatedDirective);
+ });
+ </script>
+</head>
+<body style="background-color: blue;">
+
+ <script>
+ log(document.body.style.length > 0 ? 'FAIL' : 'PASS');
+
+ </script>
+ <div id="log"></div>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/inline-style-attribute-on-html.sub.html b/testing/web-platform/tests/content-security-policy/style-src/inline-style-attribute-on-html.sub.html
new file mode 100644
index 0000000000..91faf09166
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/inline-style-attribute-on-html.sub.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<script>
+ window.addEventListener('securitypolicyviolation', function(e) {
+ log("Fail");
+ });
+</script>
+<html style="background-color: blue;">
+<head>
+ <!-- Programmatically converted from a WebKit Reftest, please forgive resulting idiosyncracies.-->
+ <meta http-equiv="Content-Security-Policy" content="style-src 'none'; script-src 'self' 'unsafe-inline'; connect-src 'self'">
+ <title>inline-style-attribute-on-html</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script src='../support/logTest.sub.js?logs=["PASS"]'></script>
+ <script src="../support/alertAssert.sub.js?alerts=[]"></script>
+</head>
+
+<body>
+ <p>Even though this page has a CSP policy the blocks inline style, the style attribute on the HTML element still takes effect because it preceeds the meta element.
+ </p>
+ <script>
+ log(document.documentElement.style.length > 0 ? 'PASS' : 'FAIL');
+
+ </script>
+ <div id="log"></div>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/inline-style-blocked.sub.html b/testing/web-platform/tests/content-security-policy/style-src/inline-style-blocked.sub.html
new file mode 100644
index 0000000000..3f34437dff
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/inline-style-blocked.sub.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <!-- Programmatically converted from a WebKit Reftest, please forgive resulting idiosyncracies.-->
+ <meta http-equiv="Content-Security-Policy" content="style-src 'none'; script-src 'self' 'unsafe-inline' 'unsafe-inline'; connect-src 'self';">
+ <title>inline-style-blocked</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script src='../support/logTest.sub.js?logs=["PASS"]'></script>
+ <script src="../support/alertAssert.sub.js?alerts=[]"></script>
+ <script>
+ window.addEventListener('securitypolicyviolation', function(e) {
+ log("violated-directive=" + e.violatedDirective);
+ });
+ </script>
+ <style>
+ .target {
+ background-color: blue;
+ }
+
+ </style>
+</head>
+
+<body class="target">
+ <script>
+ log(document.styleSheets.length > 0 ? 'FAIL' : 'PASS');
+
+ </script>
+ <div id="log"></div>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/resources/allowed.css b/testing/web-platform/tests/content-security-policy/style-src/resources/allowed.css
new file mode 100644
index 0000000000..35a8998217
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/resources/allowed.css
@@ -0,0 +1,3 @@
+#test {
+ color: green;
+}
diff --git a/testing/web-platform/tests/content-security-policy/style-src/resources/style-src-import.sub.css b/testing/web-platform/tests/content-security-policy/style-src/resources/style-src-import.sub.css
new file mode 100644
index 0000000000..bd1d6ac7ea
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/resources/style-src-import.sub.css
@@ -0,0 +1 @@
+@import "http://{{domains[www1]}}:{{ports[http][0]}}/content-security-policy/style-src/style-src.css";
diff --git a/testing/web-platform/tests/content-security-policy/style-src/resources/style-src-inject-style.js b/testing/web-platform/tests/content-security-policy/style-src/resources/style-src-inject-style.js
new file mode 100644
index 0000000000..99a9c2a464
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/resources/style-src-inject-style.js
@@ -0,0 +1,5 @@
+document.write("<style>#content { margin-left: 2px; }</style>");
+
+var s = document.createElement('style');
+s.innerText = "#content { margin-right: 2px; }";
+document.getElementsByTagName('body')[0].appendChild(s);
diff --git a/testing/web-platform/tests/content-security-policy/style-src/resources/style-src.css b/testing/web-platform/tests/content-security-policy/style-src/resources/style-src.css
new file mode 100644
index 0000000000..d76606eb6d
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/resources/style-src.css
@@ -0,0 +1 @@
+#content { margin-left: 2px; }
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-allowed.sub.html b/testing/web-platform/tests/content-security-policy/style-src/style-allowed.sub.html
new file mode 100644
index 0000000000..9ca9d8b387
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-allowed.sub.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <!-- Programmatically converted from a WebKit Reftest, please forgive resulting idiosyncracies.-->
+ <meta http-equiv="Content-Security-Policy" content="style-src *; script-src 'self' 'unsafe-inline' 'unsafe-inline'; connect-src 'self';">
+ <title>style-allowed</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script src='../support/logTest.sub.js?logs=["PASS"]'></script>
+ <script src="../support/alertAssert.sub.js?alerts=[]"></script>
+ <script>
+ window.addEventListener('securitypolicyviolation', function(e) {
+ log("Fail");
+ });
+ </script>
+ <link rel="stylesheet" href="resources/blue.css">
+</head>
+
+<body>
+ <script>
+ log(document.styleSheets.length > 0 ? 'PASS' : 'FAIL');
+
+ </script>
+ <div id="log"></div>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-blocked.html b/testing/web-platform/tests/content-security-policy/style-src/style-blocked.html
new file mode 100644
index 0000000000..07ec8d35aa
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-blocked.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src 'none'">
+ <title>style-blocked</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script>
+ async_test(t => {
+ window.addEventListener('securitypolicyviolation',
+ t.step_func_done(e => {
+ assert_equals(e.violatedDirective, "style-src-elem");
+ }));
+ }, "Violated directive is script-src-elem.");
+ </script>
+ <link rel="stylesheet" href="resources/blue.css">
+</head>
+<body>
+ <script>
+ test(t => {
+ assert_equals(document.styleSheets.length, 1);
+ }, "document.styleSheets should contain an item for the blocked CSS.");
+ </script>
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-error-event-fires.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-error-event-fires.html
new file mode 100644
index 0000000000..2c788b550c
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-error-event-fires.html
@@ -0,0 +1,34 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src 'none';">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ function styleError(t) {
+ t.done();
+ }
+
+ function styleLoad(t) {
+ t.unreached_func("Should not be able to load style");
+ }
+
+ var t1 = async_test("Test error event fires on stylesheet link");
+ var t2 = async_test("Test error event fires on inline style")
+ </script>
+
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+ <link onerror="styleError(t1)" onload="styleLoad(t1)" href="/content-security-policy/style-src/resources/style-src.css" rel=stylesheet type=text/css>
+
+ <style onerror="styleError(t2)" onload="styleLoad(t2)">
+ #content { margin-left: 2px; }
+ </style>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-hash-allowed.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-hash-allowed.html
new file mode 100644
index 0000000000..720edaf2ce
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-hash-allowed.html
@@ -0,0 +1,42 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src
+ 'sha256-7kQ1KhZCpEzWtsa0RSpbIL7FU3kPNhE3IJMaNeTclMU='
+ 'sha384-OliBBQtittDq3qDaEttMlHG1viNf50PLjSlvXirHZHpeKApMClrTJz+7VB5RTWdN'
+ 'sha512-4/SpqCV0WGbb2QZXBViFlnms4M0I+aUGg9/tIhr10twU89nlMSBLOhi3cVli39kyBZbUAlzk9xcVTMy+JDY+VA=='">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t = async_test("All style elements should load because they have proper hashes");
+ document.addEventListener("securitypolicyviolation", t.unreached_func("Should not trigger a security policy violation"));
+ </script>
+
+ <style>#content1 { margin-left: 2px; }</style>
+ <style>#content2 { margin-left: 2px; }</style>
+ <style>#content3 { margin-left: 2px; }</style>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content1">Lorem ipsum</div>
+ <div id="content2">Lorem ipsum</div>
+ <div id="content3">Lorem ipsum</div>
+
+ <script>
+ function make_assert(contentId) {
+ var contentEl = document.getElementById(contentId);
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_equals(marginLeftVal, "2px")
+ }
+ t.step(function() {
+ make_assert("content1");
+ make_assert("content2");
+ make_assert("content3");
+ t.done();
+ });
+ </script>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-hash-blocked.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-hash-blocked.html
new file mode 100644
index 0000000000..c49e85b603
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-hash-blocked.html
@@ -0,0 +1,48 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src
+ 'sha256-7kQ1KhZCpEzWtsa0RSpbIL7FU3kPNhE3IJMaNeTclMU='">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t1 = async_test("Should load the style with a correct hash");
+ var t2 = async_test("Should not load style that does not match hash");
+ var t_spv = async_test("Should fire a securitypolicyviolation event");
+
+ document.addEventListener("securitypolicyviolation", t_spv.step_func_done(function(e) {
+ assert_equals("style-src-elem", e.violatedDirective);
+ }));
+ </script>
+
+ <style>#content1 { margin-left: 2px; }</style>
+ <style>#content2 { margin-left: 2px; }</style>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content1">Lorem ipsum</div>
+ <div id="content2">Lorem ipsum</div>
+
+ <script>
+ function make_assert(contentId, assertTrue) {
+ var contentEl = document.getElementById(contentId);
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ if (assertTrue) assert_equals(marginLeftVal, "2px");
+ else assert_not_equals(marginLeftVal, "2px");
+ }
+
+ t1.step(function() {
+ make_assert("content1", true);
+ t1.done();
+ });
+
+ t2.step(function() {
+ make_assert("content2", false);
+ t2.done();
+ });
+
+ </script>
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-hash-case-insensitive.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-hash-case-insensitive.html
new file mode 100644
index 0000000000..4dcdc9f1e8
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-hash-case-insensitive.html
@@ -0,0 +1,55 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src
+ 'SHA256-7kQ1KhZCpEzWtsa0RSpbIL7FU3kPNhE3IJMaNeTclMU='
+ 'SHA384-OliBBQtittDq3qDaEttMlHG1viNf50PLjSlvXirHZHpeKApMClrTJz+7VB5RTWdN'
+ 'SHA512-4/SpqCV0WGbb2QZXBViFlnms4M0I+aUGg9/tIhr10twU89nlMSBLOhi3cVli39kyBZbUAlzk9xcVTMy+JDY+VA=='
+ 'sHa256-7+4S4EQgq4w2e2BwX1xnE3sW12GIuGqtQRYDLLhOyaE='
+ 'shA384-YmZjKJCd/pjU8gq/sFCON/NHfkHLAZqI0a4JxyX67Ark36qJAvPnEWACZrZlhR62'
+ 'Sha512-/fwXanQOq033J+QFjepcRHT0DDD6fsQJGvoeBjpEM2PBV9ETzYYGXdkwH+TMqfiRnYsHAa/sPqQd2W4FoYYlOw=='
+ ">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t = async_test("All style elements should load because they have proper hashes");
+ document.addEventListener("securitypolicyviolation", t.unreached_func("Should not trigger a security policy violation"));
+ </script>
+
+ <style>#content1 { margin-left: 2px; }</style>
+ <style>#content2 { margin-left: 2px; }</style>
+ <style>#content3 { margin-left: 2px; }</style>
+ <style>#content4 { margin-left: 2px; }</style>
+ <style>#content5 { margin-left: 2px; }</style>
+ <style>#content6 { margin-left: 2px; }</style>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content1">Lorem ipsum</div>
+ <div id="content2">Lorem ipsum</div>
+ <div id="content3">Lorem ipsum</div>
+ <div id="content4">Lorem ipsum</div>
+ <div id="content5">Lorem ipsum</div>
+ <div id="content6">Lorem ipsum</div>
+
+ <script>
+ function make_assert(contentId) {
+ var contentEl = document.getElementById(contentId);
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_equals(marginLeftVal, "2px")
+ }
+ t.step(function() {
+ make_assert("content1");
+ make_assert("content2");
+ make_assert("content3");
+ make_assert("content4");
+ make_assert("content5");
+ make_assert("content6");
+ t.done();
+ });
+ </script>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-hash-default-src-allowed.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-hash-default-src-allowed.html
new file mode 100644
index 0000000000..d8a1c17183
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-hash-default-src-allowed.html
@@ -0,0 +1,42 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline'; default-src
+ 'sha256-7kQ1KhZCpEzWtsa0RSpbIL7FU3kPNhE3IJMaNeTclMU='
+ 'sha384-OliBBQtittDq3qDaEttMlHG1viNf50PLjSlvXirHZHpeKApMClrTJz+7VB5RTWdN'
+ 'sha512-4/SpqCV0WGbb2QZXBViFlnms4M0I+aUGg9/tIhr10twU89nlMSBLOhi3cVli39kyBZbUAlzk9xcVTMy+JDY+VA=='">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t = async_test("All style elements should load because they have proper hashes")
+ document.addEventListener("securitypolicyviolation", t.unreached_func("Should not trigger a security policy violation"));
+ </script>
+
+ <style>#content1 { margin-left: 2px; }</style>
+ <style>#content2 { margin-left: 2px; }</style>
+ <style>#content3 { margin-left: 2px; }</style>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content1">Lorem ipsum</div>
+ <div id="content2">Lorem ipsum</div>
+ <div id="content3">Lorem ipsum</div>
+
+ <script>
+ function make_assert(contentId) {
+ var contentEl = document.getElementById(contentId);
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_equals(marginLeftVal, "2px")
+ }
+ t.step(function() {
+ make_assert("content1");
+ make_assert("content2");
+ make_assert("content3");
+ t.done();
+ });
+ </script>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-imported-style-allowed.sub.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-imported-style-allowed.sub.html
new file mode 100644
index 0000000000..5bc0dfdf83
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-imported-style-allowed.sub.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src 'self' http://{{domains[www1]}}:{{ports[http][0]}}">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t = async_test("Imported style that violates policy should not load");
+ document.addEventListener("securitypolicyviolation", t.unreached_func("Should not trigger a security policy violation"));
+ </script>
+
+ <link href="/content-security-policy/style-src/resources/style-src-import.sub.css" rel=stylesheet type=text/css>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+ <script>
+ t.step(function() {
+ var contentEl = document.getElementById("content");
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_not_equals(marginLeftVal, "2px")
+ t.done();
+ });
+ </script>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-imported-style-blocked.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-imported-style-blocked.html
new file mode 100644
index 0000000000..75c71a263d
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-imported-style-blocked.html
@@ -0,0 +1,38 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src 'self';">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t = async_test("@import stylesheet should not load because it does not match style-src");
+ var t_spv = async_test("Should fire a securitypolicyviolation event");
+
+ document.addEventListener("securitypolicyviolation", t_spv.step_func_done(function(e) {
+ assert_equals("style-src-elem", e.violatedDirective);
+ }));
+
+ var l = document.createElement("link");
+ l.setAttribute("href", "/content-security-policy/style-src/resources/style-src-import.sub.css");
+ l.setAttribute("rel", "stylesheet");
+ l.setAttribute("type", "text/css");
+ document.head.appendChild(l);
+ </script>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+ <script>
+ t.step(function() {
+ var contentEl = document.getElementById("content");
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_not_equals(marginLeftVal, "2px");
+ t.done();
+ });
+ </script>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-injected-inline-style-allowed-with-content-hash.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-injected-inline-style-allowed-with-content-hash.html
new file mode 100644
index 0000000000..c7b482b580
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-injected-inline-style-allowed-with-content-hash.html
@@ -0,0 +1,46 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src 'self' 'sha256-47DEQpj8HBSa+/TImW+5JCeuQeRkm5NMpJWZG3hSuFU='; script-src 'self' 'unsafe-inline'">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t = async_test("Inline injected style without text content should be allowed");
+ document.addEventListener("securitypolicyviolation", t.unreached_func("Should not trigger a security policy violation"));
+ t.done();
+
+ const style_null_child = document.createElement("style");
+ document.head.appendChild(style_null_child);
+ test(function() {
+ assert_not_equals(style_null_child.sheet, undefined, "style_null_child should have a stylesheet");
+ assert_class_string(style_null_child.sheet, "CSSStyleSheet");
+ }, "Inline style sheet should be created with null child node");
+
+ const style_empty_child = document.createElement("style");
+ style_empty_child.appendChild(document.createTextNode(""));
+ document.head.appendChild(style_empty_child);
+ test(function() {
+ assert_not_equals(style_empty_child.sheet, undefined, "style_empty_child should have a stylesheet");
+ assert_class_string(style_empty_child.sheet, "CSSStyleSheet");
+ }, "Inline style should be created with empty-string child node");
+
+ const { sheet } = style_empty_child;
+ sheet.insertRule("#content { margin-left: 2px; }");
+ </script>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+ <script>
+ test(function() {
+ var contentEl = document.getElementById("content");
+ var background_color = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_equals(background_color, "2px");
+ }, "Inline style should be applied");
+ </script>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-injected-inline-style-allowed.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-injected-inline-style-allowed.html
new file mode 100644
index 0000000000..0a691f683c
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-injected-inline-style-allowed.html
@@ -0,0 +1,34 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline'; style-src 'unsafe-inline'">
+ <script src='/resources/testharness.js'></script>
+ <script src='/resources/testharnessreport.js'></script>
+
+ <script>
+ var t = async_test("Injected inline style should load with 'unsafe-inline'");
+ document.addEventListener("securitypolicyviolation", t.unreached_func("Should not trigger a security policy violation"));
+ </script>
+
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+ <script src='/content-security-policy/style-src/resources/style-src-inject-style.js'></script>
+
+ <script>
+ t.step(function() {
+ onload = t.step_func_done(function(e) {
+ var contentEl = document.getElementById("content");
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_equals(marginLeftVal, "2px");
+ var marginRightVal = getComputedStyle(contentEl).getPropertyValue('margin-right');
+ assert_equals(marginRightVal, "2px");
+ });
+ });
+ </script>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-injected-inline-style-blocked.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-injected-inline-style-blocked.html
new file mode 100644
index 0000000000..d601fab125
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-injected-inline-style-blocked.html
@@ -0,0 +1,40 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline'; style-src 'self'">
+ <script src='/resources/testharness.js'></script>
+ <script src='/resources/testharnessreport.js'></script>
+
+ <script>
+ var t = async_test("Injected style attributes should not be applied");
+ var t_spv = async_test("Should fire a securitypolicyviolation event");
+
+ document.addEventListener("securitypolicyviolation", t_spv.step_func_done(function(e) {
+ assert_equals("style-src-elem", e.violatedDirective);
+ }));
+ </script>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+ <script src='/content-security-policy/style-src/resources/style-src-inject-style.js'></script>
+
+ <script>
+ onload = t.step_func_done(function(e) {
+ var contentEl = document.getElementById("content");
+
+ // the 'style-src-inject-style.js' script attempts to set attributes in two ways,
+ // once the left and once the right margin
+ // this is why in this test we check both to make sure neither way worked
+
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_not_equals(marginLeftVal, "2px");
+ var marginRightVal = getComputedStyle(contentEl).getPropertyValue('margin-right');
+ assert_not_equals(marginRightVal, "2px");
+ });
+ </script>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-injected-stylesheet-allowed.sub.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-injected-stylesheet-allowed.sub.html
new file mode 100644
index 0000000000..8611e83f39
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-injected-stylesheet-allowed.sub.html
@@ -0,0 +1,35 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline'; style-src http://{{domains[www1]}}:{{ports[http][0]}};">
+ <script src='/resources/testharness.js'></script>
+ <script src='/resources/testharnessreport.js'></script>
+
+ <script>
+ var t = async_test("Programatically injected stylesheet should load");
+ document.addEventListener("securitypolicyviolation", t.unreached_func("Should not trigger a security policy violation"));
+ </script>
+
+ <script>
+ var head = document.getElementsByTagName('head')[0];
+ var link = document.createElement('link');
+ link.setAttribute('rel', 'stylesheet');
+ link.setAttribute('type', 'text/css');
+ link.setAttribute('href', 'http://{{domains[www1]}}:{{ports[http][0]}}/content-security-policy/style-src/resources/style-src.css');
+
+ onload = t.step_func_done(function(e) {
+ var contentEl = document.getElementById("content");
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_equals(marginLeftVal, "2px");
+ });
+
+ head.appendChild(link);
+ </script>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-injected-stylesheet-blocked.sub.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-injected-stylesheet-blocked.sub.html
new file mode 100644
index 0000000000..2c60efed26
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-injected-stylesheet-blocked.sub.html
@@ -0,0 +1,39 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline'; style-src 'self';">
+ <script src='/resources/testharness.js'></script>
+ <script src='/resources/testharnessreport.js'></script>
+
+ <script>
+ var t = async_test("Programatically injected stylesheet should not load");
+ var t_spv = async_test("Should fire a securitypolicyviolation event");
+
+ document.addEventListener("securitypolicyviolation", t_spv.step_func_done(function(e) {
+ assert_equals("style-src-elem", e.violatedDirective);
+ }));
+ </script>
+
+ <script>
+ var head = document.getElementsByTagName('head')[0];
+ var link = document.createElement('link');
+ link.setAttribute('rel', 'stylesheet');
+ link.setAttribute('type', 'text/css');
+ link.setAttribute('href', 'http://{{domains[www1]}}:{{ports[http][0]}}/content-security-policy/style-src/resources/style-src.css');
+
+ onload = t.step_func_done(function(e) {
+ var contentEl = document.getElementById("content");
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_not_equals(marginLeftVal, "2px");
+ });
+
+ head.appendChild(link);
+ </script>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-allowed.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-allowed.html
new file mode 100644
index 0000000000..ead8d24c94
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-allowed.html
@@ -0,0 +1,34 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src 'unsafe-inline';">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t = async_test("Inline style should apply with 'unsafe-inline'");
+ document.addEventListener("securitypolicyviolation", t.unreached_func("Should not trigger a security policy violation"));
+ </script>
+
+ <style>
+ #content {
+ margin-left: 2px;
+ }
+ </style>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+ <script>
+ t.step(function() {
+ var contentEl = document.getElementById("content");
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_equals(marginLeftVal, "2px");
+ t.done();
+ }, "Inline style should not be applied");
+ </script>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-attribute-allowed.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-attribute-allowed.html
new file mode 100644
index 0000000000..aad6465d55
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-attribute-allowed.html
@@ -0,0 +1,24 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline';">
+ <script src='/resources/testharness.js'></script>
+ <script src='/resources/testharnessreport.js'></script>
+
+ <script>
+ var t = async_test("Inline style attribute should apply with 'unsafe-inline'");
+ document.addEventListener("securitypolicyviolation", t.unreached_func("Should not trigger a security policy violation"));
+ onload = t.step_func_done(function(e) {
+ var contentEl = document.getElementById("content");
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_equals(marginLeftVal, "2px");
+ });
+ </script>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content" style="margin-left: 2px">Lorem ipsum</div>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-attribute-blocked.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-attribute-blocked.html
new file mode 100644
index 0000000000..ef43ae4172
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-attribute-blocked.html
@@ -0,0 +1,28 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline'; style-src 'self';">
+ <script src='/resources/testharness.js'></script>
+ <script src='/resources/testharnessreport.js'></script>
+
+ <script>
+ var t = async_test("Inline style attribute should not be applied without 'unsafe-inline'");
+ var t_spv = async_test("Should fire a securitypolicyviolation event");
+
+ document.addEventListener("securitypolicyviolation", t_spv.step_func_done(function(e) {
+ assert_equals("style-src-attr", e.violatedDirective);
+ }));
+ onload = t.step_func_done(function(e) {
+ var contentEl = document.getElementById("content");
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_not_equals(marginLeftVal, "2px");
+ });
+ </script>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content" style="margin-left: 2px">Lorem ipsum</div>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-blocked.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-blocked.html
new file mode 100644
index 0000000000..889ec31e92
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-blocked.html
@@ -0,0 +1,38 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src 'self';">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t = async_test("Inline style element should not load without 'unsafe-inline'");
+ var t_spv = async_test("Should fire a securitypolicyviolation event");
+
+ document.addEventListener("securitypolicyviolation", t_spv.step_func_done(function(e) {
+ assert_equals("style-src-elem", e.violatedDirective);
+ }));
+ </script>
+ <style>
+ /* none of this should be applied */
+ #content {
+ margin-left: 2px;
+ }
+ </style>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+ <script>
+ t.step(function() {
+ var contentEl = document.getElementById("content");
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_not_equals(marginLeftVal, "2px");
+ t.done();
+ });
+ </script>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-nonce-allowed.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-nonce-allowed.html
new file mode 100644
index 0000000000..91e1997065
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-nonce-allowed.html
@@ -0,0 +1,34 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src 'nonce-nonceynonce';">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t = async_test("Style with correct nonce should load");
+ document.addEventListener("securitypolicyviolation", t.unreached_func("Should not trigger a security policy violation"));
+ </script>
+
+ <style nonce="nonceynonce">
+ #content {
+ margin-left: 2px;
+ }
+ </style>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+ <script>
+ t.step(function() {
+ var contentEl = document.getElementById("content");
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_equals(marginLeftVal, "2px");
+ t.done();
+ });
+ </script>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-nonce-blocked-error-event.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-nonce-blocked-error-event.html
new file mode 100644
index 0000000000..e5c0174f6f
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-nonce-blocked-error-event.html
@@ -0,0 +1,71 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src 'nonce-nonceynonce';">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t_spv = async_test("Should fire a securitypolicyviolation event");
+
+ document.addEventListener("securitypolicyviolation", t_spv.step_func_done(function(e) {
+ assert_equals("style-src-elem", e.violatedDirective);
+ }));
+ </script>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+ <script>
+ function verifyStep1() {
+ var marginLeft = getComputedStyle(document.querySelector("#content")).getPropertyValue('margin-left');
+ assert_not_equals(marginLeft, '2px', "Content still does not have a 2px margin-left after initial style.");
+ }
+
+ function setupStep2() {
+ var sty = document.createElement("style");
+ sty.nonce = "not-nonceynonce";
+ sty.innerHTML = "#content { margin-left: 2px; }";
+ sty.onerror = styleError;
+ document.body.appendChild(sty);
+ }
+ function verifyStep2() {
+ var marginLeft = getComputedStyle(document.querySelector("#content")).getPropertyValue('margin-left');
+ assert_not_equals(marginLeft, '2px', "Content still does not have a 2px margin-left after inserted style.");
+ }
+
+ function setupStep3() {
+ var e = document.getElementById('style1');
+ e.innerHTML = "#content { margin-left: 2px; }";
+ }
+ function verifyStep3() {
+ var marginLeft = getComputedStyle(document.querySelector("#content")).getPropertyValue('margin-left');
+ assert_not_equals(marginLeft, '2px', "Content still does not have a 2px margin-left after changing style.");
+ test.done();
+ }
+
+ var verifySteps = [ verifyStep1, verifyStep2, verifyStep3 ];
+ var setupSteps = [ setupStep2, setupStep3 ];
+
+ var test = async_test("Test that paragraph remains unmodified and error events received.");
+
+ function styleError() {
+ test.step(function() {
+ verifySteps.shift()();
+ var nextSetup = setupSteps.shift();
+ if (nextSetup)
+ nextSetup();
+ });
+ }
+ </script>
+
+ <style id="style1" nonce="not-nonceynonce"
+ onerror="styleError();">
+ #content {
+ margin-left: 2px;
+ }
+ </style>
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-nonce-blocked.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-nonce-blocked.html
new file mode 100644
index 0000000000..0d9eee8c62
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-inline-style-nonce-blocked.html
@@ -0,0 +1,37 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src 'self' 'nonce-nonceynonce'">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t = async_test("Should not load inline style element with invalid nonce");
+ var t_spv = async_test("Should fire a securitypolicyviolation event");
+
+ document.addEventListener("securitypolicyviolation", t_spv.step_func_done(function(e) {
+ assert_equals("style-src-elem", e.violatedDirective);
+ }));
+ </script>
+ <style nonce="not-nonceynonce">
+ #content {
+ margin-left: 2px;
+ }
+ </style>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+ <script>
+ t.step(function() {
+ var contentEl = document.getElementById("content");
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_not_equals(marginLeftVal, "2px");
+ t.done();
+ });
+ </script>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-multiple-policies-multiple-hashing-algorithms.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-multiple-policies-multiple-hashing-algorithms.html
new file mode 100644
index 0000000000..027c61d8c6
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-multiple-policies-multiple-hashing-algorithms.html
@@ -0,0 +1,20 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+ <title>Multiple policies with different hashing algorithms still work.</title>
+ <meta name="timeout" content="long">
+ <script src='/resources/testharness.js'></script>
+ <script src='/resources/testharnessreport.js'></script>
+</head>
+<body>
+ <script>
+ var t = async_test("Test that style loads if allowed by proper hash values");
+ document.addEventListener("securitypolicyviolation", t.unreached_func("Should not have triggered a security event"));
+ </script>
+
+ <!-- test will time out if this style is not allowed to load -->
+ <style onload="t.done();" onerror="t.unreached_func('Should have loaded the style');">p {color:blue;}</style>
+
+ <script async defer src='../support/checkReport.sub.js?reportExists=false'></script>
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-multiple-policies-multiple-hashing-algorithms.html.sub.headers b/testing/web-platform/tests/content-security-policy/style-src/style-src-multiple-policies-multiple-hashing-algorithms.html.sub.headers
new file mode 100644
index 0000000000..e31aa5aa27
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-multiple-policies-multiple-hashing-algorithms.html.sub.headers
@@ -0,0 +1,7 @@
+Expires: Mon, 26 Jul 1997 05:00:00 GMT
+Cache-Control: no-store, no-cache, must-revalidate
+Cache-Control: post-check=0, pre-check=0, false
+Pragma: no-cache
+Set-Cookie: style-src-multiple-policies-multiple-hashing-algorithms={{$id:uuid()}}; Path=/content-security-policy/style-src/
+Content-Security-Policy: style-src 'sha256-rB6kiow2O3eFUeTNyyLeK3wV0+l7vNB90J1aqllKvjg='; script-src 'unsafe-inline' 'self'; report-uri /reporting/resources/report.py?op=put&reportID={{$id}}
+Content-Security-Policy: style-src 'sha384-DAShdG5sejEaOdWfT+TQMRP5mHssKiUNjFggNnElIvIoj048XQlacVRs+za2AM1a'; script-src 'unsafe-inline' 'self'; report-uri /reporting/resources/report.py?op=put&reportID={{$id}}
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-none-blocked.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-none-blocked.html
new file mode 100644
index 0000000000..481da87d58
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-none-blocked.html
@@ -0,0 +1,33 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src 'none';">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t = async_test("Should not stylesheet when style-src is 'none'");
+ var t_spv = async_test("Should fire a securitypolicyviolation event");
+
+ document.addEventListener("securitypolicyviolation", t_spv.step_func_done(function(e) {
+ assert_equals("style-src-elem", e.violatedDirective);
+ }));
+ </script>
+ <link href="/content-security-policy/style-src/resources/style-src.css" rel=stylesheet type=text/css>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+ <script>
+ t.step(function() {
+ var contentEl = document.getElementById("content");
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_not_equals(marginLeftVal, "2px");
+ t.done();
+ });
+ </script>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-star-allowed.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-star-allowed.html
new file mode 100644
index 0000000000..11d7e2c717
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-star-allowed.html
@@ -0,0 +1,29 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src *;">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t = async_test("* should allow any style");
+ document.addEventListener("securitypolicyviolation", t.unreached_func("Should not trigger a security policy violation"));
+ </script>
+
+ <link href="/content-security-policy/style-src/resources/style-src.css" rel=stylesheet type=text/css>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+ <script>
+ t.step(function() {
+ var contentEl = document.getElementById("content");
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_equals(marginLeftVal, "2px");
+ t.done();
+ });
+ </script>
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-stylesheet-nonce-allowed.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-stylesheet-nonce-allowed.html
new file mode 100644
index 0000000000..a65b8561fe
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-stylesheet-nonce-allowed.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src 'nonce-nonceynonce';">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t = async_test("Stylesheet link should load with correct nonce");
+ document.addEventListener("securitypolicyviolation", t.unreached_func("Should not trigger a security policy violation"));
+ </script>
+
+ <link nonce="nonceynonce" href="/content-security-policy/style-src/resources/style-src.css" rel=stylesheet type=text/css>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+ <script>
+ t.step(function() {
+ var contentEl = document.getElementById("content");
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_equals(marginLeftVal, "2px");
+ t.done();
+ });
+ </script>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/style-src-stylesheet-nonce-blocked.html b/testing/web-platform/tests/content-security-policy/style-src/style-src-stylesheet-nonce-blocked.html
new file mode 100644
index 0000000000..ad6860e648
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/style-src-stylesheet-nonce-blocked.html
@@ -0,0 +1,33 @@
+<!doctype html>
+<html>
+<head>
+ <meta http-equiv="Content-Security-Policy" content="style-src 'nonce-nonceynonce';">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <script>
+ var t = async_test("Should not load stylesheet without correct nonce");
+ var t_spv = async_test("Should fire a securitypolicyviolation event");
+
+ document.addEventListener("securitypolicyviolation", t_spv.step_func_done(function(e) {
+ assert_equals("style-src-elem", e.violatedDirective);
+ }));
+ </script>
+ <link nonce="not-nonceynonce" href="/content-security-policy/style-src/resources/style-src.css" rel=stylesheet type=text/css>
+</head>
+<body>
+ <div id='log'></div>
+
+ <div id="content">Lorem ipsum</div>
+
+ <script>
+ t.step(function() {
+ var contentEl = document.getElementById("content");
+ var marginLeftVal = getComputedStyle(contentEl).getPropertyValue('margin-left');
+ assert_not_equals(marginLeftVal, "2px");
+ t.done();
+ });
+ </script>
+
+</body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/stylehash-allowed.sub.html b/testing/web-platform/tests/content-security-policy/style-src/stylehash-allowed.sub.html
new file mode 100644
index 0000000000..f192b5bf48
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/stylehash-allowed.sub.html
@@ -0,0 +1,81 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <!-- Programmatically converted from a WebKit Reftest, please forgive resulting idiosyncracies.-->
+ <meta http-equiv="Content-Security-Policy" content="style-src 'self' 'sha256-pAKi9r4/WB7fHydbE3F3t8i8602ij2JN8zHJpL2T5BM=' 'sha256-hndjYvzUzy2Ykuad81Cwsl1FOXX/qYs/aDVyUyNZwBw=' 'sha384-bSVm1i3sjPBRM4TwZtYTDjk9JxZMExYHWbFmP1SxDhJH4ue0Wu9OPOkY5hcqRcSt' 'sha512-440MmBLtj9Kp5Bqloogn9BqGDylY8vFsv5/zXL1zH2fJVssCoskRig4gyM+9KqwvCSapSz5CVoUGHQcxv43UQg=='; script-src 'self' 'unsafe-inline'; connect-src 'self';">
+ <title>stylehash-allowed</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script src="../support/logTest.sub.js?logs=[]"></script>
+ <script>
+ window.addEventListener('securitypolicyviolation', function(e) {
+ alert_assert("Fail");
+ });
+
+ var t_alert = async_test('Expecting alerts: ["PASS (1/4): The \'#p1\' element\'s text is green, which means the style was correctly applied.","PASS (2/4): The \'#p2\' element\'s text is green, which means the style was correctly applied.","PASS (3/4): The \'#p3\' element\'s text is green, which means the style was correctly applied.","PASS (4/4): The \'#p4\' element\'s text is green, which means the style was correctly applied."]');
+ var expected_alerts = ["PASS (1/4): The '#p1' element's text is green, which means the style was correctly applied.", "PASS (2/4): The '#p2' element's text is green, which means the style was correctly applied.", "PASS (3/4): The '#p3' element's text is green, which means the style was correctly applied.", "PASS (4/4): The '#p4' element's text is green, which means the style was correctly applied."];
+
+ function alert_assert(msg) {
+ t_alert.step(function() {
+ if (msg.match(/^FAIL/i)) {
+ assert_unreached(msg);
+ t_alert.done();
+ }
+ for (var i = 0; i < expected_alerts.length; i++) {
+ if (expected_alerts[i] == msg) {
+ assert_equals(expected_alerts[i], msg);
+ expected_alerts.splice(i, 1);
+ if (expected_alerts.length == 0) {
+ t_alert.done();
+ }
+ return;
+ }
+ }
+ assert_unreached('unexpected alert: ' + msg);
+ t_log.done();
+ });
+ }
+
+ </script>
+ <!-- enforcing policy:
+style-src 'sha256-pAKi9r4/WB7fHydbE3F3t8i8602ij2JN8zHJpL2T5BM=' 'sha256-hndjYvzUzy2Ykuad81Cwsl1FOXX/qYs/aDVyUyNZwBw=' 'sha384-bSVm1i3sjPBRM4TwZtYTDjk9JxZMExYHWbFmP1SxDhJH4ue0Wu9OPOkY5hcqRcSt' 'sha512-440MmBLtj9Kp5Bqloogn9BqGDylY8vFsv5/zXL1zH2fJVssCoskRig4gyM+9KqwvCSapSz5CVoUGHQcxv43UQg=='; script-src 'self' 'unsafe-inline'; connect-src 'self';
+-->
+</head>
+
+<body>
+ <p id="p1">This tests the result of a valid style hash. It passes if this text is green, and a &quot;PASS&quot; alert for p1 is fired.</p>
+ <p id="p2">This tests the result of a valid style hash. It passes if this text is green, and a &quot;PASS&quot; alert for p2 is fired.</p>
+ <p id="p3">This tests the result of a valid style hash. It passes if this text is green, and a &quot;PASS&quot; alert for p3 is fired.</p>
+ <p id="p4">This tests the result of a valid style hash. It passes if this text is green, and a &quot;PASS&quot; alert for p4 is fired.</p>
+ <style>p#p1 { color: green; }</style>
+ <style>p#p2 { color: green; }</style>
+ <style>p#p3 { color: green; }</style>
+ <style>p#p4 { color: green; }</style>
+ <script>
+ var color = window.getComputedStyle(document.querySelector('#p1')).color;
+ if (color === "rgb(0, 128, 0)")
+ alert_assert("PASS (1/4): The '#p1' element's text is green, which means the style was correctly applied.");
+ else
+ alert_assert("FAIL (1/4): The '#p1' element's text is " + color + ", which means the style was incorrectly applied.");
+ var color = window.getComputedStyle(document.querySelector('#p2')).color;
+ if (color === "rgb(0, 128, 0)")
+ alert_assert("PASS (2/4): The '#p2' element's text is green, which means the style was correctly applied.");
+ else
+ alert_assert("FAIL (2/4): The '#p2' element's text is " + color + ", which means the style was incorrectly applied.");
+ var color = window.getComputedStyle(document.querySelector('#p3')).color;
+ if (color === "rgb(0, 128, 0)")
+ alert_assert("PASS (3/4): The '#p3' element's text is green, which means the style was correctly applied.");
+ else
+ alert_assert("FAIL (3/4): The '#p3' element's text is " + color + ", which means the style was incorrectly applied.");
+ var color = window.getComputedStyle(document.querySelector('#p4')).color;
+ if (color === "rgb(0, 128, 0)")
+ alert_assert("PASS (4/4): The '#p4' element's text is green, which means the style was correctly applied.");
+ else
+ alert_assert("FAIL (4/4): The '#p4' element's text is " + color + ", which means the style was incorrectly applied.");
+
+ </script>
+ <div id="log"></div>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/stylehash-basic-blocked.sub.html b/testing/web-platform/tests/content-security-policy/style-src/stylehash-basic-blocked.sub.html
new file mode 100644
index 0000000000..927fa330bf
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/stylehash-basic-blocked.sub.html
@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <!-- Programmatically converted from a WebKit Reftest, please forgive resulting idiosyncracies.-->
+ <meta http-equiv="Content-Security-Policy" content="style-src 'self' 'sha256-FSRZotz4y83Ib8ZaoVj9eXKaeWXVUawM8zAPfYeYySs='; script-src 'self' 'unsafe-inline'; connect-src 'self';">
+ <title>stylehash-basic-blocked</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script src="../support/logTest.sub.js?logs=[]"></script>
+ <script>
+ window.addEventListener('securitypolicyviolation', function(e) {
+ alert_assert("violated-directive=" + e.violatedDirective);
+ });
+
+ var t_alert = async_test('Expecting alerts: ["PASS: The \'p\' element\'s text is green, which means the style was correctly applied.", "violated-directive=style-src-elem"]');
+ var expected_alerts = ["PASS: The 'p' element's text is green, which means the style was correctly applied.", "violated-directive=style-src-elem"];
+
+ function alert_assert(msg) {
+ t_alert.step(function() {
+ if (msg.match(/^FAIL/i)) {
+ assert_unreached(msg);
+ t_alert.done();
+ }
+ for (var i = 0; i < expected_alerts.length; i++) {
+ if (expected_alerts[i] == msg) {
+ assert_equals(expected_alerts[i], msg);
+ expected_alerts.splice(i, 1);
+ if (expected_alerts.length == 0) {
+ t_alert.done();
+ }
+ return;
+ }
+ }
+ assert_unreached('unexpected alert: ' + msg);
+ t_log.done();
+ });
+ }
+
+ </script>
+ <style>p { color: green; }</style>
+ <style>p { color: red; }</style>
+ <style>p { color: purple; }</style>
+ <style>p { color: blue; }</style>
+</head>
+
+<body>
+ <p>
+ This tests the effect of a valid style-hash value, with one valid style and several invalid ones. It passes if the valid style is applied and a CSP violation is generated.
+ </p>
+ <script>
+ var color = window.getComputedStyle(document.querySelector('p')).color;
+ if (color === "rgb(0, 128, 0)")
+ alert_assert("PASS: The 'p' element's text is green, which means the style was correctly applied.");
+ else
+ alert_assert("FAIL: The 'p' element's text is " + color + ", which means the style was incorrectly applied.");
+
+ </script>
+ <div id="log"></div>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/stylehash-default-src.sub.html b/testing/web-platform/tests/content-security-policy/style-src/stylehash-default-src.sub.html
new file mode 100644
index 0000000000..236fbdd060
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/stylehash-default-src.sub.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>stylehash allowed from default-src</title>
+ <meta http-equiv="Content-Security-Policy" content="default-src 'self' 'sha256-SXMrww9+PS7ymkxYbv91id+HfXeO7p1uCY0xhNb4MIw='; script-src 'self' 'unsafe-inline'; connect-src 'self';">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script>
+ setup({ single_test: true });
+ window.addEventListener('securitypolicyviolation', function(e) {
+ assert_unreached("securitypolicyviolat was fired");
+ });
+ </script>
+ </head>
+
+ <body>
+ <p id="p">Test</p>
+ <style>p#p { color: green; }</style>
+ <script>
+ var color = window.getComputedStyle(document.querySelector('#p')).color;
+ assert_equals(color, "rgb(0, 128, 0)");
+ done();
+ </script>
+
+ <div id="log"></div>
+ </body>
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/stylenonce-allowed.sub.html b/testing/web-platform/tests/content-security-policy/style-src/stylenonce-allowed.sub.html
new file mode 100644
index 0000000000..fcedc15ec6
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/stylenonce-allowed.sub.html
@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <!-- Programmatically converted from a WebKit Reftest, please forgive resulting idiosyncracies.-->
+ <meta http-equiv="Content-Security-Policy" content="style-src 'self' 'nonce-noncynonce' 'nonce-noncy+/nonce='; script-src 'self' 'unsafe-inline'; connect-src 'self';">
+ <title>stylenonce-allowed</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script src="../support/logTest.sub.js?logs=[]"></script>
+ <script src="../support/alertAssert.sub.js?alerts=[]"></script>
+ <script>
+ var t_spv = async_test("Should fire securitypolicyviolation");
+ window.addEventListener('securitypolicyviolation', t_spv.step_func_done(function(e) {
+ assert_equals(e.violatedDirective, "style-src-elem");
+ }));
+
+ </script>
+
+ <style nonce="noncynonce">
+ #test1 {
+ color: green;
+ }
+
+ </style>
+ <style>
+ #test1 {
+ color: red;
+ }
+
+ </style>
+ <style nonce="noncynonce">
+ #test2 {
+ color: green;
+ }
+
+ </style>
+</head>
+
+<body>
+ <p id="test1">This text should be green.</p>
+ <p id="test2">This text should also be green.</p>
+ <script>
+ var el = document.querySelector('#test1');
+ test(function() {
+ assert_equals(window.getComputedStyle(el).color, "rgb(0, 128, 0)")
+ });
+ var el = document.querySelector('#test2');
+ test(function() {
+ assert_equals(window.getComputedStyle(el).color, "rgb(0, 128, 0)")
+ });
+
+ </script>
+ <p>Style correctly allowed via a 'nonce-*' expression in 'style-src' should be applied to the page.</p>
+ <div id="log"></div>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/stylenonce-blocked.sub.html b/testing/web-platform/tests/content-security-policy/style-src/stylenonce-blocked.sub.html
new file mode 100644
index 0000000000..4b2381fc33
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/stylenonce-blocked.sub.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <!-- Programmatically converted from a WebKit Reftest, please forgive resulting idiosyncracies.-->
+ <meta http-equiv="Content-Security-Policy" content="style-src 'self'; script-src 'self' 'unsafe-inline'; connect-src 'self';">
+ <title>stylenonce-blocked</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <link rel="stylesheet" type="text/css" href="../style-src/resources/allowed.css">
+ <script src="../support/logTest.sub.js?logs=[]"></script>
+ <script src="../support/alertAssert.sub.js?alerts=[]"></script>
+ <script>
+ var t_spv = async_test("Should fire securitypolicyviolation");
+ window.addEventListener('securitypolicyviolation', t_spv.step_func_done(function(e) {
+ assert_equals(e.violatedDirective, "style-src-elem");
+ }));
+ </script>
+ <style nonce="noncynonce">
+ #test {
+ color: red;
+ }
+
+ </style>
+</head>
+
+<body>
+ <p id="test">This text should be green.</p>
+ <script>
+ var el = document.querySelector('#test');
+ test(function() {
+ assert_equals(window.getComputedStyle(el).color, "rgb(0, 128, 0)")
+ });
+
+ </script>
+ <p>Style that does not match a 'nonce-*' expression in 'style-src' should not be applied to the page.</p>
+ <div id="log"></div>
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/content-security-policy/style-src/support/inject-style.js b/testing/web-platform/tests/content-security-policy/style-src/support/inject-style.js
new file mode 100644
index 0000000000..532645a455
--- /dev/null
+++ b/testing/web-platform/tests/content-security-policy/style-src/support/inject-style.js
@@ -0,0 +1,5 @@
+document.write("<style>#test1 { display: none; }</style>");
+
+var s = document.createElement('style');
+s.textContent = "#test2 { display: none; }";
+document.body.appendChild(s);