tor-browser

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

browser_animation_logic_mutations_properties.js (3422B)

      1 /* Any copyright is dedicated to the Public Domain.
      2   http://creativecommons.org/publicdomain/zero/1.0/ */
      3 
      4 "use strict";
      5 
      6 // Test whether animation was changed after altering following properties.
      7 // * delay
      8 // * direction
      9 // * duration
     10 // * easing (animationTimingFunction in case of CSS Animationns)
     11 // * fill
     12 // * iterations
     13 // * endDelay (script animation only)
     14 // * iterationStart (script animation only)
     15 // * playbackRate (script animation only)
     16 
     17 const SEC = 1000;
     18 const TEST_EFFECT_TIMING = {
     19  delay: 20 * SEC,
     20  direction: "reverse",
     21  duration: 20 * SEC,
     22  easing: "steps(1)",
     23  endDelay: 20 * SEC,
     24  fill: "backwards",
     25  iterations: 20,
     26  iterationStart: 20 * SEC,
     27 };
     28 const TEST_PLAYBACK_RATE = 0.1;
     29 
     30 add_task(async function () {
     31  await addTab(URL_ROOT + "doc_simple_animation.html");
     32  await removeAnimatedElementsExcept([".animated", ".end-delay"]);
     33  const { animationInspector } = await openAnimationInspector();
     34  await setCSSAnimationProperties(animationInspector);
     35  await assertProperties(animationInspector.state.animations[0], false);
     36  await setScriptAnimationProperties(animationInspector);
     37  await assertProperties(animationInspector.state.animations[1], true);
     38 });
     39 
     40 async function setCSSAnimationProperties(animationInspector) {
     41  const properties = {
     42    animationDelay: `${TEST_EFFECT_TIMING.delay}ms`,
     43    animationDirection: TEST_EFFECT_TIMING.direction,
     44    animationDuration: `${TEST_EFFECT_TIMING.duration}ms`,
     45    animationFillMode: TEST_EFFECT_TIMING.fill,
     46    animationIterationCount: TEST_EFFECT_TIMING.iterations,
     47    animationTimingFunction: TEST_EFFECT_TIMING.easing,
     48  };
     49 
     50  await setStyles(animationInspector, ".animated", properties);
     51 }
     52 
     53 async function setScriptAnimationProperties(animationInspector) {
     54  await setEffectTimingAndPlayback(
     55    animationInspector,
     56    ".end-delay",
     57    TEST_EFFECT_TIMING,
     58    TEST_PLAYBACK_RATE
     59  );
     60 }
     61 
     62 async function assertProperties(animation, isScriptAnimation) {
     63  await waitUntil(() => animation.state.delay === TEST_EFFECT_TIMING.delay);
     64  ok(true, `Delay should be ${TEST_EFFECT_TIMING.delay}`);
     65 
     66  await waitUntil(
     67    () => animation.state.direction === TEST_EFFECT_TIMING.direction
     68  );
     69  ok(true, `Direction should be ${TEST_EFFECT_TIMING.direction}`);
     70 
     71  await waitUntil(
     72    () => animation.state.duration === TEST_EFFECT_TIMING.duration
     73  );
     74  ok(true, `Duration should be ${TEST_EFFECT_TIMING.duration}`);
     75 
     76  await waitUntil(() => animation.state.fill === TEST_EFFECT_TIMING.fill);
     77  ok(true, `Fill should be ${TEST_EFFECT_TIMING.fill}`);
     78 
     79  await waitUntil(
     80    () => animation.state.iterationCount === TEST_EFFECT_TIMING.iterations
     81  );
     82  ok(true, `Iterations should be ${TEST_EFFECT_TIMING.iterations}`);
     83 
     84  if (isScriptAnimation) {
     85    await waitUntil(() => animation.state.easing === TEST_EFFECT_TIMING.easing);
     86    ok(true, `Easing should be ${TEST_EFFECT_TIMING.easing}`);
     87 
     88    await waitUntil(
     89      () => animation.state.iterationStart === TEST_EFFECT_TIMING.iterationStart
     90    );
     91    ok(true, `IterationStart should be ${TEST_EFFECT_TIMING.iterationStart}`);
     92 
     93    await waitUntil(() => animation.state.playbackRate === TEST_PLAYBACK_RATE);
     94    ok(true, `PlaybackRate should be ${TEST_PLAYBACK_RATE}`);
     95  } else {
     96    await waitUntil(
     97      () =>
     98        animation.state.animationTimingFunction === TEST_EFFECT_TIMING.easing
     99    );
    100 
    101    ok(true, `AnimationTimingFunction should be ${TEST_EFFECT_TIMING.easing}`);
    102  }
    103 }