tor-browser

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

browser_styleeditor_scroll.js (3387B)


      1 /* Any copyright is dedicated to the Public Domain.
      2   http://creativecommons.org/publicdomain/zero/1.0/ */
      3 "use strict";
      4 
      5 // Test that editor scrolls to correct line if it's selected with
      6 //  * selectStyleSheet (specified line)
      7 //  * click on the sidebar item (line before the editor was unselected)
      8 // See bug 1148086.
      9 
     10 const SIMPLE = TEST_BASE_HTTP + "simple.css";
     11 const LONG = TEST_BASE_HTTP + "doc_long.css";
     12 const DOCUMENT_WITH_LONG_SHEET =
     13  "data:text/html;charset=UTF-8," +
     14  encodeURIComponent(
     15    [
     16      "<!DOCTYPE html>",
     17      "<html>",
     18      " <head>",
     19      "  <title>Editor scroll test page</title>",
     20      '  <link rel="stylesheet" type="text/css" href="' + SIMPLE + '">',
     21      '  <link rel="stylesheet" type="text/css" href="' + LONG + '">',
     22      " </head>",
     23      " <body>Editor scroll test page</body>",
     24      "</html>",
     25    ].join("\n")
     26  );
     27 const LINE_TO_SELECT = 201;
     28 
     29 add_task(async function () {
     30  const { ui } = await openStyleEditorForURL(DOCUMENT_WITH_LONG_SHEET);
     31 
     32  is(ui.editors.length, 2, "Two editors present.");
     33 
     34  const simpleEditor = ui.editors[0];
     35  const longEditor = ui.editors[1];
     36 
     37  info(`Selecting doc_long.css and scrolling to line ${LINE_TO_SELECT}`);
     38 
     39  // We need to wait for editor-selected if we want to check the scroll
     40  // position as scrolling occurs after selectStyleSheet resolves but before the
     41  // event is emitted.
     42  let selectEventPromise = waitForEditorToBeSelected(longEditor, ui);
     43  await ui.selectStyleSheet(longEditor.styleSheet, LINE_TO_SELECT);
     44  await selectEventPromise;
     45 
     46  info("Checking that the correct line is visible after initial load");
     47 
     48  const { from, to } = longEditor.sourceEditor.getViewport();
     49  info(`Lines ${from}-${to} are visible (expected ${LINE_TO_SELECT}).`);
     50 
     51  Assert.lessOrEqual(from, LINE_TO_SELECT, "The editor scrolled too much.");
     52  Assert.greaterOrEqual(to, LINE_TO_SELECT, "The editor scrolled too little.");
     53 
     54  const initialScrollTop = longEditor.sourceEditor.getScrollInfo().top;
     55  info(`Storing scrollTop = ${initialScrollTop} for later comparison.`);
     56 
     57  info("Selecting the first editor (simple.css)");
     58  await ui.selectStyleSheet(simpleEditor.styleSheet);
     59 
     60  info("Selecting doc_long.css again.");
     61  selectEventPromise = waitForEditorToBeSelected(longEditor, ui);
     62 
     63  // Can't use ui.selectStyleSheet here as it will scroll the editor back to top
     64  // and we want to check that the previous scroll position is restored.
     65  const summary = await ui.getEditorSummary(longEditor);
     66  summary.click();
     67 
     68  info("Waiting for doc_long.css to be selected.");
     69  await selectEventPromise;
     70 
     71  const scrollTop = longEditor.sourceEditor.getScrollInfo().top;
     72  is(
     73    scrollTop,
     74    initialScrollTop,
     75    "Scroll top was restored after the sheet was selected again."
     76  );
     77 });
     78 
     79 /**
     80 * A helper that waits "editor-selected" event for given editor.
     81 *
     82 * @param {StyleSheetEditor} editor
     83 *        The editor to wait for.
     84 * @param {StyleEditorUI} ui
     85 *        The StyleEditorUI the editor belongs to.
     86 */
     87 var waitForEditorToBeSelected = async function (editor, ui) {
     88  info(`Waiting for ${editor.friendlyName} to be selected.`);
     89  let selected = await ui.once("editor-selected");
     90  while (selected != editor) {
     91    info(`Ignored editor-selected for editor ${editor.friendlyName}.`);
     92    selected = await ui.once("editor-selected");
     93  }
     94 
     95  info(`Got editor-selected for ${editor.friendlyName}.`);
     96 };