tor-browser

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

focus-contenteditable-element-in-iframe-scroll-into-view.html (2259B)


      1 <!DOCTYPE html>
      2 <html>
      3 <head>
      4 <meta charset=utf-8>
      5 <meta name="viewport" content="width=device-width,initial-scale=1">
      6 <title>focus contenteditable element in iframe scroll into view</title>
      7 <script src=/resources/testharness.js></script>
      8 <script src=/resources/testharnessreport.js></script>
      9 <style>
     10 
     11 iframe {
     12  position: absolute;
     13  left: 250vw;
     14 }
     15 
     16 .spacer {
     17  width: 100vw;
     18  height: 250vh;
     19 }
     20 
     21 </style>
     22 </head>
     23 <body>
     24  <div id="focusable-1" class="editor" contenteditable="true">focusable 1</div>
     25  <div class="spacer"></div>
     26  <iframe srcdoc="<div id='focusable-2' contenteditable='true'>focusable 2</div>"></iframe>
     27  <div class="spacer"></div>
     28 </body>
     29 <script>
     30 
     31 function waitForLoad(w) {
     32  return new Promise(resolve => w.addEventListener('load', resolve));
     33 }
     34 
     35 function waitForFrame() {
     36  return new Promise(resolve => {
     37    requestAnimationFrame(() => requestAnimationFrame(() => resolve()));
     38  });
     39 }
     40 
     41 promise_test(async (t) => {
     42  await waitForLoad(window);
     43  const focusable_1 = document.getElementById("focusable-1");
     44  const iframeDocument = document.querySelector("iframe").contentDocument;
     45  const focusable_2 = iframeDocument.getElementById("focusable-2");
     46 
     47  focusable_1.focus();
     48  focusable_2.focus();
     49  await waitForFrame();
     50  const firstScrollX = window.scrollX;
     51  const firstScrollY = window.scrollY;
     52 
     53  assert_greater_than(firstScrollX, window.innerWidth, "scroll X is greater than window.innerWidth");
     54  assert_greater_than(firstScrollY, window.innerHeight, "scroll Y is greater than window.innerHeight");
     55 
     56  window.scroll(0, 0);
     57  assert_equals(window.scrollX, 0, "scroll X is reset to 0");
     58  assert_equals(window.scrollY, 0, "scroll Y is reset to 0");
     59 
     60  focusable_1.focus();
     61  focusable_2.focus();
     62  await waitForFrame();
     63  const secondScrollX = window.scrollX;
     64  const secondScrollY = window.scrollY;
     65 
     66  // Ensure that both scroll positions are within +/- 1
     67  assert_approx_equals(firstScrollX, secondScrollX, 1.0,
     68                       "scroll X is within +/- 1 of a element in an iframe");
     69  assert_approx_equals(firstScrollY, secondScrollY, 1.0,
     70                       "scroll Y is within +/- 1 of a element in an iframe");
     71 }, "Check contenteditable element in an iframe scroll into view on second focusing");
     72 
     73 </script>
     74 </html>