tor-browser

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

browser_animation_infinity-duration_summary-graph.js (3757B)

      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 summary graph with the animation which has infinity duration.
      7 // * Tooltips
      8 // * Graph path
      9 // * Delay sign
     10 
     11 const TEST_DATA = [
     12  {
     13    targetClass: "infinity",
     14    expectedIterationPath: [
     15      { x: 0, y: 0 },
     16      { x: 200000, y: 0 },
     17    ],
     18    expectedTooltip: {
     19      duration: "\u221E",
     20    },
     21  },
     22  {
     23    targetClass: "infinity-delay-iteration-start",
     24    expectedDelayPath: [
     25      { x: 0, y: 0 },
     26      { x: 100000, y: 0 },
     27    ],
     28    expectedDelaySign: {
     29      marginInlineStart: "0%",
     30      width: "50%",
     31    },
     32    expectedIterationPath: [
     33      { x: 100000, y: 50 },
     34      { x: 200000, y: 50 },
     35    ],
     36    expectedTooltip: {
     37      delay: "100s",
     38      duration: "\u221E",
     39      iterationStart: "0.5 (\u221E)",
     40    },
     41  },
     42  {
     43    targetClass: "limited",
     44    expectedIterationPath: [
     45      { x: 0, y: 0 },
     46      { x: 100000, y: 100 },
     47    ],
     48    expectedTooltip: {
     49      duration: "100s",
     50    },
     51  },
     52 ];
     53 
     54 add_task(async function () {
     55  await addTab(URL_ROOT + "doc_infinity_duration.html");
     56  const { panel } = await openAnimationInspector();
     57 
     58  for (const testData of TEST_DATA) {
     59    const {
     60      targetClass,
     61      expectedDelayPath,
     62      expectedDelaySign,
     63      expectedIterationPath,
     64      expectedTooltip,
     65    } = testData;
     66 
     67    const animationItemEl = await findAnimationItemByTargetSelector(
     68      panel,
     69      `.${targetClass}`
     70    );
     71    const summaryGraphEl = animationItemEl.querySelector(
     72      ".animation-summary-graph"
     73    );
     74 
     75    info(`Check tooltip for the animation of .${targetClass}`);
     76    assertTooltip(summaryGraphEl, expectedTooltip);
     77 
     78    if (expectedDelayPath) {
     79      info(`Check delay path for the animation of .${targetClass}`);
     80      assertDelayPath(summaryGraphEl, expectedDelayPath);
     81    }
     82 
     83    if (expectedDelaySign) {
     84      info(`Check delay sign for the animation of .${targetClass}`);
     85      assertDelaySign(summaryGraphEl, expectedDelaySign);
     86    }
     87 
     88    info(`Check iteration path for the animation of .${targetClass}`);
     89    assertIterationPath(summaryGraphEl, expectedIterationPath);
     90  }
     91 });
     92 
     93 function assertDelayPath(summaryGraphEl, expectedPath) {
     94  assertPath(
     95    summaryGraphEl,
     96    ".animation-computed-timing-path .animation-delay-path",
     97    expectedPath
     98  );
     99 }
    100 
    101 function assertDelaySign(summaryGraphEl, expectedSign) {
    102  const signEl = summaryGraphEl.querySelector(".animation-delay-sign");
    103 
    104  is(
    105    signEl.style.marginInlineStart,
    106    expectedSign.marginInlineStart,
    107    `marginInlineStart position should be ${expectedSign.marginInlineStart}`
    108  );
    109  is(
    110    signEl.style.width,
    111    expectedSign.width,
    112    `Width should be ${expectedSign.width}`
    113  );
    114 }
    115 
    116 function assertIterationPath(summaryGraphEl, expectedPath) {
    117  assertPath(
    118    summaryGraphEl,
    119    ".animation-computed-timing-path .animation-iteration-path",
    120    expectedPath
    121  );
    122 }
    123 
    124 function assertPath(summaryGraphEl, pathSelector, expectedPath) {
    125  const pathEl = summaryGraphEl.querySelector(pathSelector);
    126  assertPathSegments(pathEl, true, expectedPath);
    127 }
    128 
    129 function assertTooltip(summaryGraphEl, expectedTooltip) {
    130  const tooltip = summaryGraphEl.getAttribute("title");
    131  const { delay, duration, iterationStart } = expectedTooltip;
    132 
    133  if (delay) {
    134    const expected = `Delay: ${delay}`;
    135    ok(tooltip.includes(expected), `Tooltip should include '${expected}'`);
    136  }
    137 
    138  if (duration) {
    139    const expected = `Duration: ${duration}`;
    140    ok(tooltip.includes(expected), `Tooltip should include '${expected}'`);
    141  }
    142 
    143  if (iterationStart) {
    144    const expected = `Iteration start: ${iterationStart}`;
    145    ok(tooltip.includes(expected), `Tooltip should include '${expected}'`);
    146  }
    147 }