<!
DOCTYPE HTML>
<!-- Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ -->
<
html>
<
head>
<
script src=
"/tests/SimpleTest/SimpleTest.js"></
script>
<
link rel=
"stylesheet" type=
"text/css" href=
"/tests/SimpleTest/test.css"/>
<
script type=
"application/javascript">
function check_styles() {
var redText = document.getElementById(
'red-text');
var greenText = document.getElementById(
'green-text');
var blueText = document.getElementById(
'blue-text');
var redTextColor = window.getComputedStyle(redText).getPropertyValue(
'color');
var greenTextColor = window.getComputedStyle(greenText).getPropertyValue(
'color');
var blueTextColor = window.getComputedStyle(blueText).getPropertyValue(
'color');
ok(redTextColor ==
'rgb(255, 0, 0)',
"The first part should be red.");
ok(greenTextColor ==
'rgb(0, 255, 0)',
"The second part should be green.");
ok(blueTextColor ==
'rgb(0, 0, 255)',
"The third part should be blue.");
}
SimpleTest.waitForExplicitFinish();
window.onload = function() {
check_styles();
SimpleTest.finish();
}
</
script>
<
script>
function good_correctHashCORSLoaded() {
ok(true,
"A CORS cross-domain stylesheet with correct hash was correctly loaded.");
}
function bad_correctHashCORSBlocked() {
ok(false,
"We should load CORS cross-domain stylesheets with hashes that match!");
}
function good_correctHashBlocked() {
ok(true,
"A non-CORS cross-domain stylesheet with correct hash was correctly blocked.");
}
function bad_correctHashLoaded() {
ok(false,
"We should block non-CORS cross-domain stylesheets with hashes that match!");
}
function good_incorrectHashBlocked() {
ok(true,
"A non-CORS cross-domain stylesheet with incorrect hash was correctly blocked.");
}
function bad_incorrectHashLoaded() {
ok(false,
"We should load non-CORS cross-domain stylesheets with incorrect hashes!");
}
function bad_correctDataBlocked() {
ok(false,
"We should not block non-CORS cross-domain stylesheets in data: URI!");
}
function good_correctDataLoaded() {
ok(true,
"A non-CORS cross-domain stylesheet with data: URI was correctly loaded.");
}
function bad_correctDataCORSBlocked() {
ok(false,
"We should not block CORS stylesheets in data: URI!");
}
function good_correctDataCORSLoaded() {
ok(true,
"A CORS stylesheet with data: URI was correctly loaded.");
}
function good_correctHashOpaqueBlocked() {
ok(true,
"A non-CORS(Opaque) cross-domain stylesheet with correct hash was correctly blocked.");
}
function bad_correctHashOpaqueLoaded() {
ok(false,
"We should not load non-CORS(Opaque) cross-domain stylesheets with correct hashes!");
}
</
script>
<!-- valid CORS sha256 hash -->
<
link rel=
"stylesheet" href=
"http://example.com/tests/dom/security/test/sri/style1.css"
crossorigin=
"anonymous"
integrity=
"sha256-qs8lnkunWoVldk5d5E+652yth4VTSHohlBKQvvgGwa8="
onerror=
"bad_correctHashCORSBlocked()"
onload=
"good_correctHashCORSLoaded()">
<!-- valid non-CORS sha256 hash -->
<
link rel=
"stylesheet" href=
"style_301.css"
integrity=
"sha256-qs8lnkunWoVldk5d5E+652yth4VTSHohlBKQvvgGwa8="
onerror=
"good_correctHashBlocked()"
onload=
"bad_correctHashLoaded()">
<!-- invalid non-CORS sha256 hash -->
<
link rel=
"stylesheet" href=
"style_301.css?again"
integrity=
"sha256-bogus"
onerror=
"good_incorrectHashBlocked()"
onload=
"bad_incorrectHashLoaded()">
<!-- valid non-CORS sha256 hash in a data: URL -->
<
link rel=
"stylesheet" href=
"data:text/css,.green-text{color:rgb(0, 255, 0)}"
integrity=
"sha256-EhVtGGyovvffvYdhyqJxUJ/ekam7zlxxo46iM13cwP0="
onerror=
"bad_correctDataBlocked()"
onload=
"good_correctDataLoaded()">
<!-- valid CORS sha256 hash in a data: URL -->
<
link rel=
"stylesheet" href=
"data:text/css,.blue-text{color:rgb(0, 0, 255)}"
crossorigin=
"anonymous"
integrity=
"sha256-m0Fs2hNSyPOn1030Dp+c8pJFHNmwpeTbB+8J/DcqLss="
onerror=
"bad_correctDataCORSBlocked()"
onload=
"good_correctDataCORSLoaded()">
<!-- valid non-CORS sha256 hash -->
<
link rel=
"stylesheet" href=
"http://example.com/tests/dom/security/test/sri/style1.css"
integrity=
"sha256-qs8lnkunWoVldk5d5E+652yth4VTSHohlBKQvvgGwa8="
onerror=
"good_correctHashOpaqueBlocked()"
onload=
"bad_correctHashOpaqueLoaded()">
</
head>
<
body>
<p><
span id=
"red-text">This should be red</
span> but
<
span id=
"green-text" class=
"green-text">this should be green</
span> and
<
span id=
"blue-text" class=
"blue-text">this should be blue</
span></p>
<p id=
"display"></p>
<
div id=
"content" style=
"display: none">
</
div>
<
pre id=
"test">
</
pre>
</
body>
</
html>
