third_party/WebKit/LayoutTests/fast/forms/search-hide-cancel-on-cancel.html

   1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
   2 <html>
   3 <head>
   4 <script src="../../resources/js-test.js"></script>
   5 </head>
   6 <body>
   7 <p id="description"></p>
   8
   9 <input id=search type=search value=query>
  10
  11 <div id="console"></div>
  12 <script>
  13 description('Bug 46950: Search field cancel button keeps event capturing if the value is cleared in a focus event.');
  14
  15 var input = document.getElementById('search');
  16 var cancelX = input.offsetLeft + input.offsetWidth - 6;
  17 var middleX = input.offsetLeft + input.offsetWidth / 2
  18 var middleY = input.offsetTop + input.offsetHeight / 2;
  19 var mouseDownCount = 0;
  20 input.addEventListener('mousedown', function(event) {
  21     mouseDownCount++;
  22 }, false);
  23
  24 function clearValue(event) {
  25     this.value = '';
  26 }
  27 input.addEventListener('focus', clearValue, false);
  28 // Click the cancel button.
  29 eventSender.mouseMoveTo(cancelX, middleY);
  30 eventSender.mouseDown();
  31 eventSender.mouseUp();
  32 // Click the input element. The event should not be captured by the cancel button.
  33 eventSender.mouseMoveTo(middleX, middleY);
  34 eventSender.mouseDown();
  35 eventSender.mouseUp();
  36
  37 shouldBe('mouseDownCount', '2');
  38 input.removeEventListener('focus', clearValue, false);
  39 </script>
  40 </body>
  41 </html>