tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

CSSAnimation-ready.tentative.html (3386B)

      1 <!doctype html>
      2 <meta charset=utf-8>
      3 <title>CSSAnimation.ready</title>
      4 <!-- TODO: Add a more specific link for this once it is specified. -->
      5 <link rel="help" href="https://drafts.csswg.org/css-animations-2/#cssanimation">
      6 <script src="/resources/testharness.js"></script>
      7 <script src="/resources/testharnessreport.js"></script>
      8 <script src="support/testcommon.js"></script>
      9 <style>
     10 @keyframes abc {
     11  to { transform: translate(10px) }
     12 }
     13 </style>
     14 <div id="log"></div>
     15 <script>
     16 'use strict';
     17 
     18 promise_test(async t => {
     19  const div = addDiv(t);
     20  div.style.animation = 'abc 100s paused';
     21  const animation = div.getAnimations()[0];
     22  const originalReadyPromise = animation.ready;
     23 
     24  await animation.ready;
     25 
     26  div.style.animationPlayState = 'running';
     27  assert_not_equals(animation.ready, originalReadyPromise,
     28                    'After updating animation-play-state a new ready promise'
     29                    + ' object is created');
     30 }, 'A new ready promise is created when setting animation-play-state: running');
     31 
     32 promise_test(async t => {
     33  const div = addDiv(t);
     34 
     35  // Set up pending animation
     36  div.style.animation = 'abc 100s';
     37  const animation = div.getAnimations()[0];
     38  assert_true(animation.pending, 'Animation is initially pending');
     39  const readyPromise = animation.ready;
     40 
     41  // Cancel the animation and flush styles
     42  div.style.animation = '';
     43  getComputedStyle(div).animation;
     44 
     45  await promise_rejects_dom(t, 'AbortError', readyPromise,
     46                        'ready promise is rejected with AbortError');
     47 }, 'ready promise is rejected when an animation is canceled by resetting'
     48   + ' the animation property');
     49 
     50 promise_test(async t => {
     51  const div = addDiv(t);
     52 
     53  // As before, but this time instead of removing all animations, simply update
     54  // the list of animations. At least for Firefox, updating is a different
     55  // code path.
     56 
     57  // Set up pending animation
     58  div.style.animation = 'abc 100s';
     59  const animation = div.getAnimations()[0];
     60  assert_true(animation.pending, 'Animation is initially pending');
     61  const readyPromise = animation.ready;
     62 
     63  // Update the animation and flush styles
     64  div.style.animation = 'def 100s';
     65  getComputedStyle(div).animation;
     66 
     67  await promise_rejects_dom(t, 'AbortError', readyPromise,
     68                        'ready promise is rejected with AbortError');
     69 }, 'ready promise is rejected when an animation is canceled by updating'
     70   + ' the animation property');
     71 
     72 promise_test(async t => {
     73  const div = addDiv(t, { style: 'animation: abc 100s' });
     74  const animation = div.getAnimations()[0];
     75  const originalReadyPromise = animation.ready;
     76 
     77  await animation.ready;
     78 
     79  div.style.animationPlayState = 'paused';
     80  assert_not_equals(animation.ready, originalReadyPromise,
     81                    'A new Promise object is generated when setting'
     82                    + ' animation-play-state: paused');
     83 }, 'A new ready promise is created when setting animation-play-state: paused');
     84 
     85 promise_test(async t => {
     86  const div = addDiv(t, { style: 'animation: abc 100s' });
     87  const animation = div.getAnimations()[0];
     88 
     89  await animation.ready;
     90 
     91  div.style.animationPlayState = 'paused';
     92  const firstReadyPromise = animation.ready;
     93  animation.pause();
     94  assert_equals(animation.ready, firstReadyPromise,
     95                'Ready promise objects are identical after redundant pause');
     96 }, 'Pausing twice re-uses the same Promise');
     97 
     98 </script>