tor-browser

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

browser_toolbox_hosts_size.js (4951B)

      1 /* Any copyright is dedicated to the Public Domain.
      2 * http://creativecommons.org/publicdomain/zero/1.0/ */
      3 
      4 // Tests that getPanelWhenReady returns the correct panel in promise
      5 // resolutions regardless of whether it has opened first.
      6 
      7 const URL = "data:text/html;charset=utf8,test for host sizes";
      8 
      9 const { Toolbox } = require("resource://devtools/client/framework/toolbox.js");
     10 
     11 add_task(async function () {
     12  // Set size prefs to make the hosts way too big, so that the size has
     13  // to be clamped to fit into the browser window.
     14  Services.prefs.setIntPref("devtools.toolbox.footer.height", 10000);
     15  Services.prefs.setIntPref("devtools.toolbox.sidebar.width", 10000);
     16 
     17  const tab = await addTab(URL);
     18  const panel = gBrowser.getPanel();
     19  const { clientHeight: panelHeight, clientWidth: panelWidth } = panel;
     20  const toolbox = await gDevTools.showToolboxForTab(tab);
     21 
     22  is(
     23    panel.clientHeight,
     24    panelHeight,
     25    "Opening the toolbox hasn't changed the height of the panel"
     26  );
     27  is(
     28    panel.clientWidth,
     29    panelWidth,
     30    "Opening the toolbox hasn't changed the width of the panel"
     31  );
     32 
     33  let iframe = panel.querySelector(".devtools-toolbox-bottom-iframe");
     34  is(
     35    iframe.clientHeight,
     36    panelHeight - 25,
     37    "The iframe fits within the available space"
     38  );
     39 
     40  iframe.style.height = "10000px"; // Set height to something unreasonably large.
     41  Assert.less(
     42    iframe.clientHeight,
     43    panelHeight,
     44    `The iframe fits within the available space (${iframe.clientHeight} < ${panelHeight})`
     45  );
     46 
     47  await toolbox.switchHost(Toolbox.HostType.RIGHT);
     48  iframe = panel.querySelector(".devtools-toolbox-side-iframe");
     49  iframe.style.minWidth = "1px"; // Disable the min width set in css
     50  is(
     51    iframe.clientWidth,
     52    panelWidth - 25,
     53    "The iframe fits within the available space"
     54  );
     55 
     56  const oldWidth = iframe.style.width;
     57  iframe.style.width = "10000px"; // Set width to something unreasonably large.
     58  Assert.less(
     59    iframe.clientWidth,
     60    panelWidth,
     61    `The iframe fits within the available space (${iframe.clientWidth} < ${panelWidth})`
     62  );
     63  iframe.style.width = oldWidth;
     64 
     65  // on shutdown, the sidebar width will be set to the clientWidth of the iframe
     66  const expectedWidth = iframe.clientWidth;
     67 
     68  info("waiting for cleanup");
     69  await cleanup(toolbox);
     70  // Wait until the toolbox-host-manager was destroyed and updated the preferences
     71  // to avoid side effects in the next test.
     72  await waitUntil(() => {
     73    const savedWidth = Services.prefs.getIntPref(
     74      "devtools.toolbox.sidebar.width"
     75    );
     76    info(`waiting for saved pref: ${savedWidth}, ${expectedWidth}`);
     77    return savedWidth === expectedWidth;
     78  });
     79 });
     80 
     81 add_task(async function () {
     82  // Set size prefs to something reasonable, so we can check to make sure
     83  // they are being set properly.
     84  Services.prefs.setIntPref("devtools.toolbox.footer.height", 100);
     85  Services.prefs.setIntPref("devtools.toolbox.sidebar.width", 100);
     86 
     87  const tab = await addTab(URL);
     88  const panel = gBrowser.getPanel();
     89  const { clientHeight: panelHeight, clientWidth: panelWidth } = panel;
     90  const toolbox = await gDevTools.showToolboxForTab(tab);
     91 
     92  is(
     93    panel.clientHeight,
     94    panelHeight,
     95    "Opening the toolbox hasn't changed the height of the panel"
     96  );
     97  is(
     98    panel.clientWidth,
     99    panelWidth,
    100    "Opening the toolbox hasn't changed the width of the panel"
    101  );
    102 
    103  let iframe = panel.querySelector(".devtools-toolbox-bottom-iframe");
    104  is(iframe.clientHeight, 100, "The iframe is resized properly");
    105  const horzSplitter = panel.querySelector(".devtools-horizontal-splitter");
    106  dragElement(horzSplitter, { startX: 1, startY: 1, deltaX: 0, deltaY: -50 });
    107  is(iframe.clientHeight, 150, "The iframe was resized by the splitter");
    108 
    109  await toolbox.switchHost(Toolbox.HostType.RIGHT);
    110  iframe = panel.querySelector(".devtools-toolbox-side-iframe");
    111  iframe.style.minWidth = "1px"; // Disable the min width set in css
    112  is(iframe.clientWidth, 100, "The iframe is resized properly");
    113 
    114  info("Resize the toolbox manually by 50 pixels");
    115  const sideSplitter = panel.querySelector(".devtools-side-splitter");
    116  dragElement(sideSplitter, { startX: 1, startY: 1, deltaX: -50, deltaY: 0 });
    117  is(iframe.clientWidth, 150, "The iframe was resized by the splitter");
    118 
    119  await cleanup(toolbox);
    120 });
    121 
    122 function dragElement(el, { startX, startY, deltaX, deltaY }) {
    123  const endX = startX + deltaX;
    124  const endY = startY + deltaY;
    125  EventUtils.synthesizeMouse(el, startX, startY, { type: "mousedown" }, window);
    126  EventUtils.synthesizeMouse(el, endX, endY, { type: "mousemove" }, window);
    127  EventUtils.synthesizeMouse(el, endX, endY, { type: "mouseup" }, window);
    128 }
    129 
    130 async function cleanup(toolbox) {
    131  Services.prefs.clearUserPref("devtools.toolbox.host");
    132  Services.prefs.clearUserPref("devtools.toolbox.footer.height");
    133  Services.prefs.clearUserPref("devtools.toolbox.sidebar.width");
    134  await toolbox.destroy();
    135  gBrowser.removeCurrentTab();
    136 }