| <!doctype html> |
| <meta charset="utf-8"> |
| <title>CSSResourceValue normalization tests</title> |
| <link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#resourcevalue-normalization"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="../resources/testhelper.js"></script> |
| <body> |
| <script> |
| 'use strict'; |
| |
| const gTestUrl = '/media/1x1-green.png'; |
| const gBadTestUrl = document.location.href; |
| |
| async_test(t => { |
| const result = CSSStyleValue.parse('background-image', 'url("' + gTestUrl + '")'); |
| assert_equals(result.constructor.name, 'CSSURLImageValue'); |
| assert_equals(result.intrinsicWidth, null); |
| assert_equals(result.intrinsicHeight, null); |
| assert_equals(result.intrinsicRatio, null); |
| assert_equals(result.state, 'unloaded'); |
| |
| let image = loadImageResource(t, result); |
| image.addEventListener('load', t.step_func_done(() => { |
| assert_equals(result.url, gTestUrl); |
| assert_equals(result.state, 'loaded'); |
| assert_equals(result.intrinsicWidth, 1); |
| assert_equals(result.intrinsicHeight, 1); |
| assert_equals(result.intrinsicRatio, 1); |
| })); |
| }, 'Normalizing a valid <url> returns a CSSURLImageValue that eventually loads'); |
| |
| async_test(t => { |
| const result = CSSStyleValue.parse('background-image', 'url("' + gBadTestUrl + '")'); |
| assert_equals(result.constructor.name, 'CSSURLImageValue'); |
| |
| let image = loadImageResource(t, result); |
| image.addEventListener('error', t.step_func_done(() => { |
| assert_equals(result.url, gBadTestUrl); |
| assert_equals(result.state, 'error'); |
| assert_equals(result.intrinsicWidth, null); |
| assert_equals(result.intrinsicHeight, null); |
| assert_equals(result.intrinsicRatio, null); |
| })); |
| }, 'Normalizing a bad <url> returns a CSSURLImageValue in error state'); |
| |
| test(t => { |
| const result = CSSStyleValue.parse('background-image', 'linear-gradient(red, orange)'); |
| assert_equals(result.constructor.name, 'CSSImageValue'); |
| assert_equals(result.state, 'loaded'); |
| assert_equals(result.intrinsicWidth, null); |
| assert_equals(result.intrinsicHeight, null); |
| assert_equals(result.intrinsicRatio, null); |
| }, 'Normalizing a <gradient> returns a CSSImageValue'); |
| |
| </script> |