tor-browser

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

browser_markup_events-overflow.js (2969B)

      1 /* Any copyright is dedicated to the Public Domain.
      2 http://creativecommons.org/publicdomain/zero/1.0/ */
      3 "use strict";
      4 
      5 const TEST_URL = URL_ROOT + "doc_markup_events-overflow.html";
      6 const TEST_DATA = [
      7  {
      8    desc: "editor overflows container",
      9    // scroll to bottom
     10    initialScrollTop: -1,
     11    // last header
     12    headerToClick: 49,
     13    alignBottom: true,
     14    alignTop: false,
     15  },
     16  {
     17    desc: "header overflows the container",
     18    initialScrollTop: 2,
     19    headerToClick: 0,
     20    alignBottom: false,
     21    alignTop: true,
     22  },
     23  {
     24    desc: "neither header nor editor overflows the container",
     25    initialScrollTop: 2,
     26    headerToClick: 5,
     27    alignBottom: false,
     28    alignTop: false,
     29  },
     30 ];
     31 
     32 add_task(async function () {
     33  const { inspector } = await openInspectorForURL(TEST_URL);
     34 
     35  const markupContainer = await getContainerForSelector("#events", inspector);
     36  const evHolder = markupContainer.elt.querySelector(
     37    ".inspector-badge.interactive[data-event]"
     38  );
     39  const tooltip = inspector.markup.eventDetailsTooltip;
     40 
     41  info("Clicking to open event tooltip.");
     42  EventUtils.synthesizeMouseAtCenter(
     43    evHolder,
     44    {},
     45    inspector.markup.doc.defaultView
     46  );
     47  await tooltip.once("shown");
     48  info("EventTooltip visible.");
     49 
     50  const container = tooltip.panel;
     51  const containerRect = container.getBoundingClientRect();
     52  const headers = container.querySelectorAll(".event-header");
     53 
     54  for (const data of TEST_DATA) {
     55    info("Testing scrolling when " + data.desc);
     56 
     57    if (data.initialScrollTop < 0) {
     58      info("Scrolling container to the bottom.");
     59      const newScrollTop = container.scrollHeight - container.clientHeight;
     60      data.initialScrollTop = container.scrollTop = newScrollTop;
     61    } else {
     62      info("Scrolling container by " + data.initialScrollTop + "px");
     63      container.scrollTop = data.initialScrollTop;
     64    }
     65 
     66    is(container.scrollTop, data.initialScrollTop, "Container scrolled.");
     67 
     68    info("Clicking on header #" + data.headerToClick);
     69    const header = headers[data.headerToClick];
     70 
     71    const ready = tooltip.once("event-tooltip-ready");
     72    EventUtils.synthesizeMouseAtCenter(header, {}, header.ownerGlobal);
     73    await ready;
     74 
     75    info("Event handler expanded.");
     76 
     77    // Wait for any scrolling to finish.
     78    await promiseNextTick();
     79 
     80    if (data.alignTop) {
     81      const headerRect = header.getBoundingClientRect();
     82 
     83      is(
     84        Math.round(headerRect.top),
     85        Math.round(containerRect.top),
     86        "Clicked header is aligned with the container top."
     87      );
     88    } else if (data.alignBottom) {
     89      const editorRect = header.nextElementSibling.getBoundingClientRect();
     90 
     91      is(
     92        Math.round(editorRect.bottom),
     93        Math.round(containerRect.bottom),
     94        "Clicked event handler code is aligned with the container bottom."
     95      );
     96    } else {
     97      is(
     98        container.scrollTop,
     99        data.initialScrollTop,
    100        "Container did not scroll, as expected."
    101      );
    102    }
    103  }
    104 });