| <!doctype html> |
| <meta charset="utf-8"> |
| <title>CSSOM base URI is the document's base URI</title> |
| <link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io"> |
| <link rel="author" title="Mozilla" href="https://mozilla.org"> |
| <link rel="help" href="https://html.spec.whatwg.org/#document-base-url"> |
| <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1343919"> |
| <base href="/non-existent-base/"> |
| <script src='/resources/testharness.js'></script> |
| <script src='/resources/testharnessreport.js'></script> |
| <div id="target"></div> |
| <script> |
| const target = document.getElementById("target"); |
| const kRelativeURI = "url(something.png)"; |
| const kKeyframes = [ |
| { backgroundImage: kRelativeURI }, |
| { backgroundImage: kRelativeURI }, |
| ]; |
| function assertBackground() { |
| const image = getComputedStyle(target).backgroundImage; |
| assert_true(image.includes("non-existent-base"), image); |
| } |
| function assertNoBackground() { |
| const image = getComputedStyle(target).backgroundImage; |
| assert_equals(image, "none"); |
| } |
| |
| promise_test(async function() { |
| target.style.backgroundImage = kRelativeURI; |
| assertBackground(); |
| target.style.backgroundImage = ""; |
| assertNoBackground(); |
| }, "setProperty"); |
| |
| promise_test(async function() { |
| const keyframe = new KeyframeEffect(target, kKeyframes, 10000); |
| const animation = new Animation(keyframe, document.timeline); |
| animation.play(); |
| await animation.ready; |
| assertBackground(); |
| animation.cancel(); |
| assertNoBackground(); |
| }, "KeyframeEffect constructor"); |
| |
| promise_test(async function() { |
| const keyframe = new KeyframeEffect(target, [], 10000); |
| keyframe.setKeyframes(kKeyframes); |
| const animation = new Animation(keyframe, document.timeline); |
| animation.play(); |
| await animation.ready; |
| assertBackground(); |
| animation.cancel(); |
| assertNoBackground(); |
| }, "KeyframeEffect.setKeyframes"); |
| </script> |
