tor-browser

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

canceling-an-animation.html (3988B)

      1 <!DOCTYPE html>
      2 <meta charset=utf-8>
      3 <title>Canceling an animation</title>
      4 <link rel="help"
      5    href="https://drafts.csswg.org/web-animations/#canceling-an-animation-section">
      6 <script src="/resources/testharness.js"></script>
      7 <script src="/resources/testharnessreport.js"></script>
      8 <script src="../../testcommon.js"></script>
      9 <body>
     10 <div id="log"></div>
     11 <script>
     12 'use strict';
     13 
     14 test(t => {
     15  const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
     16  animation.cancel();
     17 
     18  assert_equals(animation.startTime, null,
     19                'The start time of a canceled animation should be unresolved');
     20  assert_equals(animation.currentTime, null,
     21                'The hold time of a canceled animation should be unresolved');
     22 }, 'Canceling an animation should cause its start time and hold time to be'
     23   + ' unresolved');
     24 
     25 promise_test(t => {
     26  const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
     27  const retPromise = animation.ready.then(() => {
     28    assert_unreached('ready promise was fulfilled');
     29  }).catch(err => {
     30    assert_equals(err.name, 'AbortError',
     31                  'ready promise is rejected with AbortError');
     32  });
     33 
     34  animation.cancel();
     35 
     36  return retPromise;
     37 }, 'A play-pending ready promise should be rejected when the animation is'
     38   + ' canceled');
     39 
     40 promise_test(async t => {
     41  const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
     42  await animation.ready;
     43 
     44  // Make it pause-pending
     45  animation.pause();
     46 
     47  // We need to store the original ready promise since cancel() will
     48  // replace it
     49  const originalPromise = animation.ready;
     50  animation.cancel();
     51 
     52  await promise_rejects_dom(t, 'AbortError', originalPromise,
     53                        'Cancel should abort ready promise');
     54 }, 'A pause-pending ready promise should be rejected when the animation is'
     55   + ' canceled');
     56 
     57 promise_test(async t => {
     58  const animation = createDiv(t).animate(null);
     59  animation.cancel();
     60  const promiseResult = await animation.ready;
     61  assert_equals(promiseResult, animation);
     62 }, 'When an animation is canceled, it should create a resolved Promise');
     63 
     64 test(t => {
     65  const animation = createDiv(t).animate(null);
     66  const promise = animation.ready;
     67  animation.cancel();
     68  assert_not_equals(animation.ready, promise);
     69  promise_rejects_dom(t, 'AbortError', promise, 'Cancel should abort ready promise');
     70 }, 'The ready promise should be replaced when the animation is canceled');
     71 
     72 promise_test(t => {
     73  const animation = new Animation(
     74    new KeyframeEffect(null, null, { duration: 1000 }),
     75    null
     76  );
     77  assert_equals(animation.playState, 'idle',
     78                'The animation should be initially idle');
     79 
     80  animation.finished.then(t.step_func(() => {
     81    assert_unreached('Finished promise should not resolve');
     82  }), t.step_func(() => {
     83    assert_unreached('Finished promise should not reject');
     84  }));
     85 
     86  animation.cancel();
     87 
     88  return waitForAnimationFrames(3);
     89 }, 'The finished promise should NOT be rejected if the animation is already'
     90   + ' idle');
     91 
     92 promise_test(t => {
     93  const animation = new Animation(
     94    new KeyframeEffect(null, null, { duration: 1000 }),
     95    null
     96  );
     97  assert_equals(animation.playState, 'idle',
     98                'The animation should be initially idle');
     99 
    100  animation.oncancel = t.step_func(() => {
    101    assert_unreached('Cancel event should not be fired');
    102  });
    103 
    104  animation.cancel();
    105 
    106  return waitForAnimationFrames(3);
    107 }, 'The cancel event should NOT be fired if the animation is already'
    108   + ' idle');
    109 
    110 promise_test(async t => {
    111  const div = createDiv(t);
    112  const animation = div.animate({}, 100 * MS_PER_SEC);
    113  div.remove();
    114 
    115  const eventWatcher = new EventWatcher(t, animation, 'cancel');
    116 
    117  await animation.ready;
    118  animation.cancel();
    119 
    120  await eventWatcher.wait_for('cancel');
    121 
    122  assert_equals(animation.effect.target.parentNode, null,
    123    'cancel event should be fired for the animation on an orphaned element');
    124 }, 'Canceling an animation should fire cancel event on orphaned element');
    125 
    126 </script>
    127 </body>