| <!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> |