tor-browser

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

helper_html_tooltip.js (3519B)

      1 /* Any copyright is dedicated to the Public Domain.
      2   http://creativecommons.org/publicdomain/zero/1.0/ */
      3 /* eslint no-unused-vars: [2, {"vars": "local", "args": "none"}] */
      4 /* import-globals-from ../../shared/test/shared-head.js */
      5 
      6 "use strict";
      7 
      8 /**
      9 * Helper methods for the HTMLTooltip integration tests.
     10 */
     11 
     12 /**
     13 * Display an existing HTMLTooltip on an anchor and properly wait for the popup to be
     14 * repainted.
     15 *
     16 * @param {HTMLTooltip} tooltip
     17 *        The tooltip instance to display
     18 * @param {Node} anchor
     19 *        The anchor that should be used to display the tooltip
     20 * @param {object} see HTMLTooltip:show documentation
     21 * @return {Promise} promise that resolves when reflow and repaint are done.
     22 */
     23 async function showTooltip(tooltip, anchor, { position, x, y } = {}) {
     24  await tooltip.show(anchor, { position, x, y });
     25  await waitForReflow(tooltip);
     26 
     27  // Wait for next tick. Tooltip tests sometimes fail to successively hide and
     28  // show tooltips on Win32 debug.
     29  await waitForTick();
     30 }
     31 
     32 /**
     33 * Hide an existing HTMLTooltip. After the tooltip "hidden" event has been fired
     34 * a reflow will be triggered.
     35 *
     36 * @param {HTMLTooltip} tooltip
     37 *        The tooltip instance to hide
     38 * @return {Promise} promise that resolves when "hidden" has been fired, reflow
     39 *         and repaint done.
     40 */
     41 async function hideTooltip(tooltip) {
     42  const onPopupHidden = tooltip.once("hidden");
     43  tooltip.hide();
     44  await onPopupHidden;
     45  await waitForReflow(tooltip);
     46 
     47  // Wait for next tick. Tooltip tests sometimes fail to successively hide and
     48  // show tooltips on Win32 debug.
     49  await waitForTick();
     50 }
     51 
     52 /**
     53 * Forces the reflow of an HTMLTooltip document and waits for the next repaint.
     54 *
     55 * @param {HTMLTooltip} the tooltip to reflow
     56 * @return {Promise} a promise that will resolve after the reflow and repaint
     57 *         have been executed.
     58 */
     59 function waitForReflow(tooltip) {
     60  const { doc } = tooltip;
     61  return new Promise(resolve => {
     62    doc.documentElement.offsetWidth;
     63    doc.defaultView.requestAnimationFrame(resolve);
     64  });
     65 }
     66 
     67 /**
     68 * Test helper designed to check that a tooltip is displayed at the expected
     69 * position relative to an anchor, given a set of expectations.
     70 *
     71 * @param {HTMLTooltip} tooltip
     72 *        The HTMLTooltip instance to check
     73 * @param {Node} anchor
     74 *        The tooltip's anchor
     75 * @param {object} expected
     76 *        - {String} position : "top" or "bottom"
     77 *        - {Boolean} leftAligned
     78 *        - {Number} width: expected tooltip width
     79 *        - {Number} height: expected tooltip height
     80 */
     81 function checkTooltipGeometry(
     82  tooltip,
     83  anchor,
     84  { position, leftAligned = true, height, width } = {}
     85 ) {
     86  info("Check the tooltip geometry matches expected position and dimensions");
     87  const tooltipRect = tooltip.container.getBoundingClientRect();
     88  const anchorRect = anchor.getBoundingClientRect();
     89 
     90  if (position === "top") {
     91    is(
     92      tooltipRect.bottom,
     93      Math.round(anchorRect.top),
     94      "Tooltip is above the anchor"
     95    );
     96  } else if (position === "bottom") {
     97    is(
     98      tooltipRect.top,
     99      Math.round(anchorRect.bottom),
    100      "Tooltip is below the anchor"
    101    );
    102  } else {
    103    ok(false, "Invalid position provided to checkTooltipGeometry");
    104  }
    105 
    106  if (leftAligned) {
    107    is(
    108      tooltipRect.left,
    109      Math.round(anchorRect.left),
    110      "Tooltip left-aligned with the anchor"
    111    );
    112  }
    113 
    114  is(tooltipRect.height, height, "Tooltip has the expected height");
    115  is(tooltipRect.width, width, "Tooltip has the expected width");
    116 }