src/third_party/WebKit/LayoutTests/inspector/sources/debugger/debugger-step-into-custom-element-callbacks.html

   1 <html>
   2 <head>
   3 <script src="../../../http/tests/inspector/inspector-test.js"></script>
   4 <script src="../../../http/tests/inspector/debugger-test.js"></script>
   5 <script>
   6
   7 function testFunction() {
   8     var proto = Object.create(HTMLElement.prototype);
   9     proto.createdCallback = function createdCallback() {
  10         output('Invoked createdCallback.');
  11     };
  12     proto.attachedCallback = function attachedCallback() {
  13         output('Invoked attachedCallback.');
  14     };
  15     proto.detachedCallback = function detachedCallback() {
  16         output('Invoked detachedCallback.');
  17     };
  18     proto.attributeChangedCallback = function attributeChangedCallback() {
  19         output('Invoked attributeChangedCallback.');
  20     };
  21     var FooElement = document.registerElement('x-foo', { prototype: proto });
  22     debugger;
  23     var foo = new FooElement();
  24     debugger;
  25     foo.setAttribute('a', 'b');
  26     debugger;
  27     document.body.appendChild(foo);
  28     debugger;
  29     foo.remove();
  30 }
  31
  32 var test = function() {
  33     InspectorTest.resumeExecution = function(callback) {
  34         if (WebInspector.panels.sources.paused)
  35             WebInspector.panels.sources._togglePause();
  36         InspectorTest.waitUntilResumed(callback);
  37     };
  38
  39     InspectorTest.startDebuggerTest(step1, true);
  40
  41     function step1() {
  42         InspectorTest.runTestFunctionAndWaitUntilPaused(step2);
  43     }
  44
  45     function checkTopFrameFunction(callFrames, expectedName) {
  46         var topFunctionName = callFrames[0].functionName;
  47         if (expectedName === topFunctionName)
  48             InspectorTest.addResult("PASS: Did step into event listener(" + expectedName + ").");
  49         else
  50             InspectorTest.addResult("FAIL: Unexpected top function: expected " + expectedName + ", found " + topFunctionName);
  51     }
  52
  53     function stepOverThenIn(name, callback) {
  54         InspectorTest.addResult("Stepping to " + name + "...");
  55         WebInspector.panels.sources._stepOverButton.element.click();
  56         InspectorTest.waitUntilResumed(InspectorTest.waitUntilPaused.bind(InspectorTest, function() {
  57             InspectorTest.addResult("Stepping into " + name + "...");
  58             WebInspector.panels.sources._stepIntoButton.element.click();
  59             InspectorTest.waitUntilResumed(InspectorTest.waitUntilPaused.bind(InspectorTest, callback));
  60         }));
  61     }
  62
  63     function step2() {
  64         stepOverThenIn('constructor', step3);
  65     }
  66
  67     function step3(callFrames) {
  68         checkTopFrameFunction(callFrames, 'createdCallback');
  69         InspectorTest.resumeExecution(InspectorTest.waitUntilPaused.bind(InspectorTest, step4));
  70     }
  71
  72     function step4() {
  73         stepOverThenIn('setAttribute', step5);
  74     }
  75
  76     function step5(callFrames) {
  77         checkTopFrameFunction(callFrames, 'attributeChangedCallback');
  78         InspectorTest.resumeExecution(InspectorTest.waitUntilPaused.bind(InspectorTest, step6));
  79     }
  80
  81     function step6() {
  82         stepOverThenIn('attachedCallback', step7);
  83     }
  84
  85     function step7(callFrames) {
  86         checkTopFrameFunction(callFrames, 'attachedCallback');
  87         InspectorTest.resumeExecution(InspectorTest.waitUntilPaused.bind(InspectorTest, step8));
  88     }
  89
  90     function step8() {
  91         stepOverThenIn('detachedCallback', step9);
  92     }
  93
  94     function step9(callFrames) {
  95         checkTopFrameFunction(callFrames, 'detachedCallback');
  96         InspectorTest.completeDebuggerTest();
  97     }
  98 }
  99
 100 </script>
 101 </head>
 102
 103 <body onload="runTest()">
 104 <p>
 105 Tests that stepping into custom element methods will lead to a pause in the callbacks.
 106 </p>
 107
 108 </body>
 109 </html>