src/third_party/WebKit/LayoutTests/inspector/elements/event-listener-sidebar.html

   1 <html>
   2 <head>
   3 <script src="../../http/tests/inspector/inspector-test.js"></script>
   4 <script src="../../http/tests/inspector/elements-test.js"></script>
   5 <script>
   6 function documentClickHandler(event) { console.log("click - document - attribute"); }
   7
   8 function setupEventListeners()
   9 {
  10     function f() {}
  11     var button = document.getElementById("node");
  12     function clickHandler(event) { console.log("click - button - bubbling (registered before attribute)"); }
  13     button.addEventListener("click", clickHandler, false);
  14     button.addEventListener("hover", function hoverHandler(event) { console.log("hover - button - bubbling"); }, false);
  15     button.addEventListener("click", function(event) { console.log("click - button - capturing"); }, true);
  16     button.onclick = function(event) { console.log("click - button - attribute"); }
  17     button.addEventListener("click", function(event) { console.log("click - button - bubbling (registered after attribute)"); }, false);
  18     document.onclick = documentClickHandler;
  19     document.addEventListener("click", function(event) { console.log("click - document - capturing"); }, true);
  20     document.addEventListener("mousedown", f, false);
  21     document.removeEventListener("mousedown", f, false);
  22
  23     document.body.addEventListener("custom event", f, true);
  24
  25     function ObjectHandler() { document.addEventListener("click", this, true); }
  26     ObjectHandler.prototype.toString = function() { return "ObjectHandler"; }
  27     new ObjectHandler();
  28
  29     function EventListenerImpl() { document.addEventListener("click", this, true); }
  30     EventListenerImpl.prototype.toString = function() { return "EventListenerImpl"; }
  31     EventListenerImpl.prototype.handleEvent = function() { console.log("click - document - handleEvent"); }
  32     new EventListenerImpl();
  33 }
  34
  35 function test()
  36 {
  37     var sidebarPane = WebInspector.panels.elements.sidebarPanes.eventListeners;
  38
  39     WebInspector.settings.eventListenersFilter.set("all");
  40     InspectorTest.selectNodeWithId("node", step1);
  41
  42     function step1()
  43     {
  44         InspectorTest.expandAndDumpSelectedElementEventListeners(step2);
  45     }
  46
  47     function step2()
  48     {
  49         InspectorTest.selectNodeWithId("node-without-listeners", step3);
  50     }
  51
  52     function step3()
  53     {
  54         var eventListenersPane = WebInspector.panels.elements.sidebarPanes.eventListeners;
  55         eventListenersPane.settingsSelectElement.selectedIndex = 1;
  56         eventListenersPane._changeSetting();
  57         InspectorTest.addResult("Listeners for selected node only(should be no listeners):");
  58         InspectorTest.expandAndDumpSelectedElementEventListeners(step4);
  59     }
  60
  61     function step4()
  62     {
  63         InspectorTest.completeTest();
  64     }
  65 }
  66
  67 function onloadHandler()
  68 {
  69     setupEventListeners();
  70     runTest();
  71 }
  72 </script>
  73 </head>
  74
  75 <body onload="onloadHandler()">
  76 <p>
  77 Tests event listeners output in the Elements sidebar panel.
  78 </p>
  79
  80 <button id="node">Inspect Me</button>
  81
  82 <div id="node-without-listeners"></div>
  83
  84 </body>
  85 </html>