tor-browser

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

browser_animation_keyframes-progress-bar.js (3315B)

      1 /* Any copyright is dedicated to the Public Domain.
      2 http://creativecommons.org/publicdomain/zero/1.0/ */
      3 
      4 "use strict";
      5 
      6 // Test for following KeyframesProgressBar:
      7 // * element existence
      8 // * progress bar position in multi effect timings
      9 // * progress bar position after changing playback rate
     10 // * progress bar position when select another animation
     11 
     12 requestLongerTimeout(3);
     13 
     14 const TEST_DATA = [
     15  {
     16    targetClass: "cssanimation-linear",
     17    scrubberPositions: [0, 0.25, 0.5, 0.75, 1],
     18    expectedPositions: [0, 0.25, 0.5, 0.75, 0],
     19  },
     20  {
     21    targetClass: "easing-step",
     22    scrubberPositions: [0, 0.49, 0.5, 0.99],
     23    expectedPositions: [0, 0, 0.5, 0.5],
     24  },
     25  {
     26    targetClass: "delay-positive",
     27    scrubberPositions: [0, 0.33, 0.5],
     28    expectedPositions: [0, 0, 0.25],
     29  },
     30  {
     31    targetClass: "delay-negative",
     32    scrubberPositions: [0, 0.49, 0.5, 0.75],
     33    expectedPositions: [0, 0, 0.5, 0.75],
     34  },
     35  {
     36    targetClass: "enddelay-positive",
     37    scrubberPositions: [0, 0.66, 0.67, 0.99],
     38    expectedPositions: [0, 0.99, 0, 0],
     39  },
     40  {
     41    targetClass: "enddelay-negative",
     42    scrubberPositions: [0, 0.49, 0.5, 0.99],
     43    expectedPositions: [0, 0.49, 0, 0],
     44  },
     45  {
     46    targetClass: "direction-reverse-with-iterations-infinity",
     47    scrubberPositions: [0, 0.25, 0.5, 0.75, 1],
     48    expectedPositions: [1, 0.75, 0.5, 0.25, 1],
     49  },
     50  {
     51    targetClass: "fill-both-width-delay-iterationstart",
     52    scrubberPositions: [0, 0.33, 0.66, 0.833, 1],
     53    expectedPositions: [0.5, 0.5, 0.99, 0.25, 0.5],
     54  },
     55 ];
     56 
     57 add_task(async function () {
     58  await addTab(URL_ROOT + "doc_multi_timings.html");
     59  await removeAnimatedElementsExcept(TEST_DATA.map(t => `.${t.targetClass}`));
     60  const { animationInspector, inspector, panel } =
     61    await openAnimationInspector();
     62 
     63  info("Checking progress bar position in multi effect timings");
     64 
     65  for (const testdata of TEST_DATA) {
     66    const { targetClass, scrubberPositions, expectedPositions } = testdata;
     67 
     68    info(`Checking progress bar position for ${targetClass}`);
     69    const onDetailRendered = animationInspector.once(
     70      "animation-keyframes-rendered"
     71    );
     72    await selectNode(`.${targetClass}`, inspector);
     73    await onDetailRendered;
     74 
     75    info("Checking progress bar existence");
     76    const areaEl = panel.querySelector(".keyframes-progress-bar-area");
     77    ok(areaEl, "progress bar area should exist");
     78    const barEl = areaEl.querySelector(".keyframes-progress-bar");
     79    ok(barEl, "progress bar should exist");
     80 
     81    for (let i = 0; i < scrubberPositions.length; i++) {
     82      info(`Scrubber position is ${scrubberPositions[i]}`);
     83      clickOnCurrentTimeScrubberController(
     84        animationInspector,
     85        panel,
     86        scrubberPositions[i]
     87      );
     88      await waitUntilAnimationsPlayState(animationInspector, "paused");
     89      assertPosition(barEl, areaEl, expectedPositions[i], animationInspector);
     90    }
     91  }
     92 });
     93 
     94 function assertPosition(barEl, areaEl, expectedRate) {
     95  const controllerBounds = areaEl.getBoundingClientRect();
     96  const barBounds = barEl.getBoundingClientRect();
     97  const barX = barBounds.x + barBounds.width / 2 - controllerBounds.x;
     98  const expected = controllerBounds.width * expectedRate;
     99  ok(
    100    expected - 1 < barX && barX < expected + 1,
    101    `Position should apploximately be ${expected} (x of bar is ${barX})`
    102  );
    103 }