<!DOCTYPE html>
<meta charset=utf-8>
<title>Test for handling of 'crossorigin' attribute on CSS link with data: URL</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<div id="log"></div>
<div id="someuniqueidhere"></div>
<img id="testimg" crossorigin src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAADElEQVR42mP4z8AAAAMBAQD3A0FDAAAAAElFTkSuQmCC">
<script>
var t = async_test("img@crossorigin with data: src");
window.addEventListener("load", t.step_func_done(function() {
var img = document.getElementById("testimg");
assert_equals(img.naturalWidth, 1, "Should have 1px width");
assert_equals(img.naturalHeight, 1, "Should have 1px height");
var c = document.createElement("canvas");
c.width = c.height = 1;
var ctx = c.getContext("2d");
ctx.drawImage(img, 0, 0);
var data = ctx.getImageData(0, 0, 1, 1);
assert_equals(data.width, 1, "Should have 1px data width");
assert_equals(data.height, 1, "Should have 1px data height");
assert_equals(data.data[0], 255, "Should have lots of red");
assert_equals(data.data[1], 0, "Should have no green");
assert_equals(data.data[2], 0, "Should have no blue");
assert_equals(data.data[3], 255, "Should have no translucency");
}));
</script>