diff options
Diffstat (limited to 'testing/web-platform/tests/content-security-policy/style-src')
45 files changed, 1609 insertions, 0 deletions
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 "PASS" 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 "PASS" 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 "PASS" 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 "PASS" 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); |