LayoutTests/fast/events/simulated-click-coords.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <style>
   5
   6 .scroll {
   7     height: 100px;
   8     overflow: auto;
   9 }
  10
  11 .filler {
  12     height: 200px;
  13 }
  14
  15 </style>
  16 </head>
  17 <body>
  18 <p>Ensure that simulated click on label elements uses the original mouse coordinates.</p>
  19 <input type="checkbox" id="target" onclick="validateEventProperties(event)">
  20 <label for="target" onclick="storeEvent(event)">Click Me</label>
  21
  22 <div class="scroll">
  23     <div class="filler"></div>
  24     <input type="radio" id="target2" onclick="validateEventProperties(event)">
  25     <label for="target2" onclick="storeEvent(event)">Click Me</label>
  26 </div>
  27
  28 <pre id="out"></pre>
  29 <script>
  30
  31 if (window.layoutTestController)
  32     layoutTestController.dumpAsText();
  33
  34 function clickOn(element)
  35 {
  36     if (!window.eventSender)
  37         return;
  38     var rect = element.getBoundingClientRect();
  39     var x = rect.left + rect.width / 2;
  40     var y = rect.top + rect.height / 2;
  41     eventSender.mouseMoveTo(x, y);
  42     eventSender.mouseDown();
  43     eventSender.mouseUp();
  44 }
  45
  46 function print(s)
  47 {
  48     document.getElementById('out').textContent += s + '\n';
  49 }
  50
  51 var realClickEvent, simulatedEvent;
  52
  53 function storeEvent(event)
  54 {
  55     realClickEvent = event;
  56 }
  57
  58 function validateEventProperty(name)
  59 {
  60     if (realClickEvent[name] === simulatedEvent[name])
  61         print('PASS: event.' + name + ' is same for both real and simulated event.');
  62     else
  63         print('FAIL: event.' + name + ' is ' + simulatedEvent[name] + ', expected ' + realClickEvent[name]);
  64 }
  65
  66 function validateEventProperties(event)
  67 {
  68     simulatedEvent = event;
  69
  70     validateEventProperty('clientX');
  71     validateEventProperty('clientY');
  72     validateEventProperty('layerX');
  73     validateEventProperty('layerY');
  74     validateEventProperty('pageX');
  75     validateEventProperty('pageY');
  76     validateEventProperty('screenX');
  77     validateEventProperty('screenY');
  78     validateEventProperty('x');
  79     validateEventProperty('y');
  80 }
  81
  82 clickOn(document.querySelector('label'));
  83
  84 print('');
  85 document.querySelector('.scroll').scrollTop = 999;
  86 clickOn(document.querySelector('.scroll label'));
  87
  88 </script>
  89 </body>
  90 </html>