third_party/WebKit/LayoutTests/compositing/overflow/resources/update-widget-positions-on-nested-frames-and-scrollers-inner-frame.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4   <script src="../../../fast/forms/resources/picker-common.js"></script>
   5   <style>
   6     select {
   7       display: block;
   8       margin: 5px;
   9     }
  10   </style>
  11   <script>
  12     // We need to 'click' the select element by sending an actual event
  13     // through internals, since the regular javascript click() method
  14     // won't trigger the right events for this test.
  15     function clickSelect(callback) {
  16       if (!window.eventSender)
  17         return;
  18
  19       var select = document.getElementById('select');
  20       // FIXME: it would be really nice to use getBoundingClientRect() and not
  21       // hard-code pixel coordinates here, but since it's in an iframe, the
  22       // coordinates are translated anyway.
  23       clickToOpenPicker(50, 120, callback, function () {
  24           setTimeout(callback, 0);
  25       });
  26     }
  27
  28     // We'll get a message from the outer frame when it's done scrolling,
  29     // so we know it's time to click on a select element.
  30     window.onmessage = function() {
  31       clickSelect(function () {
  32         if (window.testRunner)
  33           window.testRunner.notifyDone();
  34       });
  35     };
  36
  37     // This function just saves us from hard-coding 30 select elements
  38     // (each with a few option elements) in the body. One of the
  39     // select elements near the bottom is given an id so we can click
  40     // on it later.
  41     function populateDom() {
  42       for (var x = 0; x < 30; x++) {
  43         var select = document.createElement('select');
  44         for (var y = 0; y < 4; ++y) {
  45           var option = document.createElement('option');
  46           option.innerText = y;
  47           select.appendChild(option);
  48         }
  49
  50         if (x == 24) {
  51           select.id = 'select';
  52         }
  53
  54         document.body.appendChild(select);
  55       }
  56     }
  57
  58     // Javascript execution starts here. This will populate the iframe
  59     // with a bunch of select elements, then post a message to the
  60     // outer iframe to tell it to scroll.
  61     window.onload = function() {
  62       populateDom();
  63       parent.postMessage('', '*');
  64     };
  65   </script>
  66 </head>
  67
  68 <body>
  69 </body>