blob: abc944fcfb021eb99b4dbc2e29acd98f79bceaec [file] [log] [blame]
<!doctype html>
<meta charset="utf-8">
<title>CSSURLImageValue</title>
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#imagevalue-objects">
<meta name="assert" content="Test CSSURLImageValue constructor and attributes" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../resources/testhelper.js"></script>
<body>
<div id="log">
<script>
'use strict';
const gTestUrl = '/media/1x1-green.png';
const gBase64TestUrl = 'data:image/gif;base64,R0lGODlhAQABAAAAACwAAAAAAQABAAA=';
const gBadTestUrl = document.location.href;
test(() => {
const result = new CSSURLImageValue(gTestUrl);
assert_not_equals(result, null,
'A CSSURLImageValue should be created');
assert_equals(result.url, gTestUrl,
'url member should be same as passed in the constructor');
assert_equals(result.intrinsicWidth, null, 'intrinsicWidth');
assert_equals(result.intrinsicHeight, null, 'intrinsicHeight');
assert_equals(result.intrinsicRatio, null, 'intrinsicRatio');
assert_equals(result.state, 'unloaded', 'state');
}, 'Constructing a CSSURLImageValue with a valid URL puts it in an ' +
'unloaded state');
async_test(t => {
const result = new CSSURLImageValue(gTestUrl);
let image = loadImageResource(t, result);
image.addEventListener('load', t.step_func_done(() => {
assert_equals(result.url, gTestUrl,
'url member should be same as passed in the constructor');
assert_equals(result.state, 'loaded', 'state');
assert_equals(result.intrinsicWidth, 1,
'intrinsicWidth member should be width of loaded image');
assert_equals(result.intrinsicHeight, 1,
'intrinsicHeight member should be height of loaded image');
assert_equals(result.intrinsicRatio, 1,
'intrinsicRatio member should be ratio of loaded image');
}));
}, 'Constructing a CSSURLImageValue from a URL sets its state to loaded');
async_test(t => {
const result = new CSSURLImageValue(gBase64TestUrl);
let image = loadImageResource(t, result);
image.addEventListener('load', t.step_func_done(() => {
assert_equals(result.url, gBase64TestUrl,
'url member should be same as passed in the constructor');
assert_equals(result.state, 'loaded', 'state');
assert_equals(result.intrinsicWidth, 1,
'intrinsicWidth member should be width of loaded image');
assert_equals(result.intrinsicHeight, 1,
'intrinsicHeight member should be height of loaded image');
assert_equals(result.intrinsicRatio, 1,
'intrinsicRatio member should be ratio of loaded image');
}));
}, 'Constructing a CSSURLImageValue from a base64 URL sets its state to loaded');
async_test(t => {
const result = new CSSURLImageValue(gBadTestUrl);
let image = loadImageResource(t, result);
image.addEventListener('error', t.step_func_done(() => {
assert_equals(result.url, gBadTestUrl,
'url member should be same as passed in the constructor');
assert_equals(result.state, 'error', 'state');
assert_equals(result.intrinsicWidth, null, 'intrinsicWidth');
assert_equals(result.intrinsicHeight, null, 'intrinsicHeight');
assert_equals(result.intrinsicRatio, null, 'intrinsicRatio');
}));
}, 'Constructing a CSSURLImageValue from a URL to an invalid image sets ' +
'its state to error');
</script>