tor-browser

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

browser_markup_dragdrop_reorder.js (3955B)

      1 /* Any copyright is dedicated to the Public Domain.
      2 http://creativecommons.org/publicdomain/zero/1.0/ */
      3 
      4 "use strict";
      5 
      6 requestLongerTimeout(2);
      7 
      8 // Test different kinds of drag and drop node re-ordering.
      9 
     10 const TEST_URL = URL_ROOT + "doc_markup_dragdrop.html";
     11 
     12 add_task(async function () {
     13  const { inspector } = await openInspectorForURL(TEST_URL);
     14  let ids;
     15 
     16  info("Expand #test node");
     17  const parentFront = await getNodeFront("#test", inspector);
     18  await inspector.markup.expandNode(parentFront);
     19  await waitForMultipleChildrenUpdates(inspector);
     20 
     21  info("Scroll #test into view");
     22  const parentContainer = await getContainerForNodeFront(
     23    parentFront,
     24    inspector
     25  );
     26  parentContainer.elt.scrollIntoView(true);
     27 
     28  info("Test putting an element back at its original place");
     29  await dragElementToOriginalLocation("#firstChild", inspector);
     30  ids = await getChildrenIDsOf(parentFront, inspector);
     31  is(ids[0], "firstChild", "#firstChild is still the first child of #test");
     32  is(ids[1], "middleChild", "#middleChild is still the second child of #test");
     33 
     34  info("Testing switching elements inside their parent");
     35  await moveElementDown("#firstChild", "#middleChild", inspector);
     36  ids = await getChildrenIDsOf(parentFront, inspector);
     37  is(ids[0], "middleChild", "#firstChild is now the second child of #test");
     38  is(ids[1], "firstChild", "#middleChild is now the first child of #test");
     39 
     40  info("Testing switching elements with a last child");
     41  await moveElementDown("#firstChild", "#lastChild", inspector);
     42  ids = await getChildrenIDsOf(parentFront, inspector);
     43  is(ids[1], "lastChild", "#lastChild is now the second child of #test");
     44  is(ids[2], "firstChild", "#firstChild is now the last child of #test");
     45 
     46  info("Testing appending element to a parent");
     47  await moveElementDown("#before", "#test", inspector);
     48  ids = await getChildrenIDsOf(parentFront, inspector);
     49  is(ids.length, 4, "New element appended to #test");
     50  is(
     51    ids[0],
     52    "before",
     53    "New element is appended at the right place (currently first child)"
     54  );
     55 
     56  info("Testing moving element to after it's parent");
     57  await moveElementDown("#firstChild", "#test", inspector);
     58  ids = await getChildrenIDsOf(parentFront, inspector);
     59  is(ids.length, 3, "#firstChild is no longer #test's child");
     60  const siblingFront = await inspector.walker.nextSibling(parentFront);
     61  is(
     62    siblingFront.id,
     63    "firstChild",
     64    "#firstChild is now #test's nextElementSibling"
     65  );
     66 });
     67 
     68 async function dragElementToOriginalLocation(selector, inspector) {
     69  info("Picking up and putting back down " + selector);
     70 
     71  function onMutation() {
     72    ok(false, "Mutation received from dragging a node back to its location");
     73  }
     74  inspector.on("markupmutation", onMutation);
     75  await simulateNodeDragAndDrop(inspector, selector, 0, 0);
     76 
     77  // Wait a bit to make sure the event never fires.
     78  // This doesn't need to catch *all* cases, since the mutation
     79  // will cause failure later in the test when it checks element ordering.
     80  await wait(500);
     81  inspector.off("markupmutation", onMutation);
     82 }
     83 
     84 async function moveElementDown(selector, next, inspector) {
     85  info("Switching " + selector + " with " + next);
     86 
     87  const container = await getContainerForSelector(next, inspector);
     88  const height = container.tagLine.getBoundingClientRect().height;
     89 
     90  const onMutated = inspector.once("markupmutation");
     91  const uiUpdate = inspector.once("inspector-updated");
     92 
     93  await simulateNodeDragAndDrop(inspector, selector, 0, Math.round(height) + 2);
     94 
     95  const mutations = await onMutated;
     96  await uiUpdate;
     97 
     98  is(mutations.length, 2, "2 mutations were received");
     99 }
    100 
    101 async function getChildrenIDsOf(parentFront, { walker }) {
    102  const { nodes } = await walker.children(parentFront);
    103  // Filter out non-element nodes since children also returns pseudo-elements.
    104  return nodes
    105    .filter(node => {
    106      return !node.isPseudoElement;
    107    })
    108    .map(node => {
    109      return node.id;
    110    });
    111 }