Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(61)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/inspector/sources/debugger/dom-breakpoints.html

Issue 304563002: DevTools: Make frameworks work with "custom" breakpoints (DOM, XHR, Events). (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Created 6 years, 6 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
« no previous file with comments | « LayoutTests/inspector/sources/debugger/async-callstack-and-framework-black-box-expected.txt ('k') | LayoutTests/inspector/sources/debugger/frameworks-dom-xhr-event-breakpoints.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <html> 1 <html>
2 <head> 2 <head>
3 <script src="../../../http/tests/inspector/inspector-test.js"></script> 3 <script src="../../../http/tests/inspector/inspector-test.js"></script>
4 <script src="../../../http/tests/inspector/elements-test.js"></script> 4 <script src="../../../http/tests/inspector/elements-test.js"></script>
5 <script src="../../../http/tests/inspector/debugger-test.js"></script> 5 <script src="../../../http/tests/inspector/debugger-test.js"></script>
6 <script> 6 <script>
7 7
8 function appendElement(parentId, childId) 8 function appendElement(parentId, childId)
9 { 9 {
10 var child = document.createElement("div"); 10 var child = document.createElement("div");
(...skipping 82 matching lines...) Expand 10 before | Expand all | Expand 10 after
93 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint is hit when appending a child."); 93 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint is hit when appending a child.");
94 InspectorTest.nodeWithId("rootElement", step2); 94 InspectorTest.nodeWithId("rootElement", step2);
95 95
96 function step2(node) 96 function step2(node)
97 { 97 {
98 rootElement = node; 98 rootElement = node;
99 pane._setBreakpoint(node, pane._breakpointTypes.SubtreeModified, true); 99 pane._setBreakpoint(node, pane._breakpointTypes.SubtreeModified, true);
100 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n rootElement."); 100 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n rootElement.");
101 InspectorTest.evaluateInPageWithTimeout("appendElement('rootElem ent', 'childElement')"); 101 InspectorTest.evaluateInPageWithTimeout("appendElement('rootElem ent', 'childElement')");
102 InspectorTest.addResult("Append childElement to rootElement."); 102 InspectorTest.addResult("Append childElement to rootElement.");
103 waitUntilPausedAndDumpStack(next); 103 InspectorTest.waitUntilPausedAndDumpStackAndResume(next);
104 } 104 }
105 }, 105 },
106 106
107 function testInsertGrandchild(next) 107 function testInsertGrandchild(next)
108 { 108 {
109 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint is hit when appending a grandchild."); 109 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint is hit when appending a grandchild.");
110 InspectorTest.evaluateInPageWithTimeout("appendElement('childElement ', 'grandchildElement')"); 110 InspectorTest.evaluateInPageWithTimeout("appendElement('childElement ', 'grandchildElement')");
111 InspectorTest.addResult("Append grandchildElement to childElement.") ; 111 InspectorTest.addResult("Append grandchildElement to childElement.") ;
112 waitUntilPausedAndDumpStack(next); 112 InspectorTest.waitUntilPausedAndDumpStackAndResume(next);
113 }, 113 },
114 114
115 function testRemoveChild(next) 115 function testRemoveChild(next)
116 { 116 {
117 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint is hit when removing a child."); 117 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint is hit when removing a child.");
118 InspectorTest.evaluateInPageWithTimeout("removeElement('grandchildEl ement')"); 118 InspectorTest.evaluateInPageWithTimeout("removeElement('grandchildEl ement')");
119 InspectorTest.addResult("Remove grandchildElement."); 119 InspectorTest.addResult("Remove grandchildElement.");
120 waitUntilPausedAndDumpStack(next); 120 InspectorTest.waitUntilPausedAndDumpStackAndResume(next);
121 }, 121 },
122 122
123 function testInnerHTML(next) 123 function testInnerHTML(next)
124 { 124 {
125 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint is hit exactly once when setting innerHTML."); 125 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint is hit exactly once when setting innerHTML.");
126 InspectorTest.evaluateInPageWithTimeout("setInnerHTML('childElement' , '<br><br>')"); 126 InspectorTest.evaluateInPageWithTimeout("setInnerHTML('childElement' , '<br><br>')");
127 InspectorTest.addResult("Set childElement.innerHTML."); 127 InspectorTest.addResult("Set childElement.innerHTML.");
128 waitUntilPausedAndDumpStack(step2); 128 InspectorTest.waitUntilPausedAndDumpStackAndResume(step2);
129 129
130 function step2() 130 function step2()
131 { 131 {
132 InspectorTest.waitUntilPaused(step3); 132 InspectorTest.waitUntilPaused(step3);
133 InspectorTest.evaluateInPageWithTimeout("breakDebugger()"); 133 InspectorTest.evaluateInPageWithTimeout("breakDebugger()");
134 InspectorTest.addResult("Call breakDebugger, expect it to show u p in next stack trace."); 134 InspectorTest.addResult("Call breakDebugger, expect it to show u p in next stack trace.");
135 } 135 }
136 136
137 function step3(frames) 137 function step3(frames)
138 { 138 {
139 InspectorTest.captureStackTrace(frames); 139 InspectorTest.captureStackTrace(frames);
140 pane._removeBreakpoint(rootElement, pane._breakpointTypes.Subtre eModified); 140 pane._removeBreakpoint(rootElement, pane._breakpointTypes.Subtre eModified);
141 InspectorTest.resumeExecution(next); 141 InspectorTest.resumeExecution(next);
142 } 142 }
143 }, 143 },
144 144
145 function testModifyAttribute(next) 145 function testModifyAttribute(next)
146 { 146 {
147 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when modifying attribute."); 147 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when modifying attribute.");
148 pane._setBreakpoint(rootElement, pane._breakpointTypes.AttributeModi fied, true); 148 pane._setBreakpoint(rootElement, pane._breakpointTypes.AttributeModi fied, true);
149 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement."); 149 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement.");
150 InspectorTest.evaluateInPageWithTimeout("modifyAttribute('rootElemen t', 'data-test', 'foo')"); 150 InspectorTest.evaluateInPageWithTimeout("modifyAttribute('rootElemen t', 'data-test', 'foo')");
151 InspectorTest.addResult("Modify rootElement data-test attribute."); 151 InspectorTest.addResult("Modify rootElement data-test attribute.");
152 waitUntilPausedAndDumpStack(step2); 152 InspectorTest.waitUntilPausedAndDumpStackAndResume(step2);
153 153
154 function step2(callFrames) 154 function step2(callFrames)
155 { 155 {
156 pane._removeBreakpoint(rootElement, pane._breakpointTypes.Attrib uteModified); 156 pane._removeBreakpoint(rootElement, pane._breakpointTypes.Attrib uteModified);
157 next(); 157 next();
158 } 158 }
159 }, 159 },
160 160
161 function testModifyAttrNode(next) 161 function testModifyAttrNode(next)
162 { 162 {
163 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when modifying Attr node."); 163 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when modifying Attr node.");
164 pane._setBreakpoint(rootElement, pane._breakpointTypes.AttributeModi fied, true); 164 pane._setBreakpoint(rootElement, pane._breakpointTypes.AttributeModi fied, true);
165 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement."); 165 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement.");
166 InspectorTest.evaluateInPageWithTimeout("modifyAttrNode('rootElement ', 'data-test', 'bar')"); 166 InspectorTest.evaluateInPageWithTimeout("modifyAttrNode('rootElement ', 'data-test', 'bar')");
167 InspectorTest.addResult("Modify rootElement data-test attribute."); 167 InspectorTest.addResult("Modify rootElement data-test attribute.");
168 waitUntilPausedAndDumpStack(step2); 168 InspectorTest.waitUntilPausedAndDumpStackAndResume(step2);
169 169
170 function step2(callFrames) 170 function step2(callFrames)
171 { 171 {
172 pane._removeBreakpoint(rootElement, pane._breakpointTypes.Attrib uteModified); 172 pane._removeBreakpoint(rootElement, pane._breakpointTypes.Attrib uteModified);
173 next(); 173 next();
174 } 174 }
175 }, 175 },
176 176
177 function testSetAttrNode(next) 177 function testSetAttrNode(next)
178 { 178 {
179 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when adding a new Attr node."); 179 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when adding a new Attr node.");
180 pane._setBreakpoint(rootElement, pane._breakpointTypes.AttributeModi fied, true); 180 pane._setBreakpoint(rootElement, pane._breakpointTypes.AttributeModi fied, true);
181 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement."); 181 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement.");
182 InspectorTest.evaluateInPageWithTimeout("setAttrNode('rootElement', 'data-foo', 'bar')"); 182 InspectorTest.evaluateInPageWithTimeout("setAttrNode('rootElement', 'data-foo', 'bar')");
183 InspectorTest.addResult("Modify rootElement data-foo attribute."); 183 InspectorTest.addResult("Modify rootElement data-foo attribute.");
184 waitUntilPausedAndDumpStack(step2); 184 InspectorTest.waitUntilPausedAndDumpStackAndResume(step2);
185 185
186 function step2(callFrames) 186 function step2(callFrames)
187 { 187 {
188 pane._removeBreakpoint(rootElement, pane._breakpointTypes.Attrib uteModified); 188 pane._removeBreakpoint(rootElement, pane._breakpointTypes.Attrib uteModified);
189 next(); 189 next();
190 } 190 }
191 }, 191 },
192 192
193 function testModifyStyleAttribute(next) 193 function testModifyStyleAttribute(next)
194 { 194 {
195 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when modifying style attribute."); 195 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when modifying style attribute.");
196 pane._setBreakpoint(rootElement, pane._breakpointTypes.AttributeModi fied, true); 196 pane._setBreakpoint(rootElement, pane._breakpointTypes.AttributeModi fied, true);
197 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement."); 197 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement.");
198 InspectorTest.evaluateInPageWithTimeout("modifyStyleAttribute('rootE lement', 'color', 'green')"); 198 InspectorTest.evaluateInPageWithTimeout("modifyStyleAttribute('rootE lement', 'color', 'green')");
199 InspectorTest.addResult("Modify rootElement style.color attribute.") ; 199 InspectorTest.addResult("Modify rootElement style.color attribute.") ;
200 waitUntilPausedAndDumpStack(step2); 200 InspectorTest.waitUntilPausedAndDumpStackAndResume(step2);
201 201
202 function step2(callFrames) 202 function step2(callFrames)
203 { 203 {
204 pane._removeBreakpoint(rootElement, pane._breakpointTypes.Attrib uteModified); 204 pane._removeBreakpoint(rootElement, pane._breakpointTypes.Attrib uteModified);
205 next(); 205 next();
206 } 206 }
207 }, 207 },
208 208
209 function testRemoveNode(next) 209 function testRemoveNode(next)
210 { 210 {
211 InspectorTest.addResult("Test that 'Node Removed' breakpoint is hit when removing a node."); 211 InspectorTest.addResult("Test that 'Node Removed' breakpoint is hit when removing a node.");
212 InspectorTest.nodeWithId("elementToRemove", step2); 212 InspectorTest.nodeWithId("elementToRemove", step2);
213 213
214 function step2(node) 214 function step2(node)
215 { 215 {
216 pane._setBreakpoint(node, pane._breakpointTypes.NodeRemoved, tru e); 216 pane._setBreakpoint(node, pane._breakpointTypes.NodeRemoved, tru e);
217 InspectorTest.addResult("Set 'Node Removed' DOM breakpoint on el ementToRemove."); 217 InspectorTest.addResult("Set 'Node Removed' DOM breakpoint on el ementToRemove.");
218 InspectorTest.evaluateInPageWithTimeout("removeElement('elementT oRemove')"); 218 InspectorTest.evaluateInPageWithTimeout("removeElement('elementT oRemove')");
219 InspectorTest.addResult("Remove elementToRemove."); 219 InspectorTest.addResult("Remove elementToRemove.");
220 waitUntilPausedAndDumpStack(next); 220 InspectorTest.waitUntilPausedAndDumpStackAndResume(next);
221 } 221 }
222 }, 222 },
223 223
224 function testReload(next) 224 function testReload(next)
225 { 225 {
226 InspectorTest.addResult("Test that DOM breakpoints are persisted bet ween page reloads."); 226 InspectorTest.addResult("Test that DOM breakpoints are persisted bet ween page reloads.");
227 InspectorTest.nodeWithId("rootElement", step2); 227 InspectorTest.nodeWithId("rootElement", step2);
228 228
229 function step2(node) 229 function step2(node)
230 { 230 {
231 pane._setBreakpoint(node, pane._breakpointTypes.SubtreeModified, true); 231 pane._setBreakpoint(node, pane._breakpointTypes.SubtreeModified, true);
232 pane._saveBreakpoints(); 232 pane._saveBreakpoints();
233 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n rootElement."); 233 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n rootElement.");
234 InspectorTest.reloadPage(step3); 234 InspectorTest.reloadPage(step3);
235 } 235 }
236 236
237 function step3() 237 function step3()
238 { 238 {
239 InspectorTest.expandElementsTree(step4); 239 InspectorTest.expandElementsTree(step4);
240 } 240 }
241 241
242 function step4() 242 function step4()
243 { 243 {
244 InspectorTest.evaluateInPageWithTimeout("appendElement('rootElem ent', 'childElement')"); 244 InspectorTest.evaluateInPageWithTimeout("appendElement('rootElem ent', 'childElement')");
245 InspectorTest.addResult("Append childElement to rootElement."); 245 InspectorTest.addResult("Append childElement to rootElement.");
246 waitUntilPausedAndDumpStack(next); 246 InspectorTest.waitUntilPausedAndDumpStackAndResume(next);
247 } 247 }
248 }, 248 },
249 249
250 function testInsertChildIntoAuthorShadowTree(next) 250 function testInsertChildIntoAuthorShadowTree(next)
251 { 251 {
252 InspectorTest.shadowRootByHostId("hostElement", callback); 252 InspectorTest.shadowRootByHostId("hostElement", callback);
253 253
254 function callback(node) 254 function callback(node)
255 { 255 {
256 authorShadowRoot = node; 256 authorShadowRoot = node;
257 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint on author shadow root is hit when appending a child."); 257 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint on author shadow root is hit when appending a child.");
258 pane._setBreakpoint(authorShadowRoot, pane._breakpointTypes.Subt reeModified, true); 258 pane._setBreakpoint(authorShadowRoot, pane._breakpointTypes.Subt reeModified, true);
259 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n author shadow root."); 259 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n author shadow root.");
260 InspectorTest.evaluateInPageWithTimeout("appendElementToAuthorSh adowRoot('childElement')"); 260 InspectorTest.evaluateInPageWithTimeout("appendElementToAuthorSh adowRoot('childElement')");
261 InspectorTest.addResult("Append childElement to author shadow ro ot."); 261 InspectorTest.addResult("Append childElement to author shadow ro ot.");
262 waitUntilPausedAndDumpStack(next); 262 InspectorTest.waitUntilPausedAndDumpStackAndResume(next);
263 } 263 }
264 }, 264 },
265 265
266 function testReloadWithShadowElementBreakpoint(next) 266 function testReloadWithShadowElementBreakpoint(next)
267 { 267 {
268 InspectorTest.nodeWithId("outerElement", step1); 268 InspectorTest.nodeWithId("outerElement", step1);
269 269
270 function step1(node) 270 function step1(node)
271 { 271 {
272 outerElement = node; 272 outerElement = node;
273 273
274 InspectorTest.addResult("Test that shadow DOM breakpoints are pe rsisted between page reloads."); 274 InspectorTest.addResult("Test that shadow DOM breakpoints are pe rsisted between page reloads.");
275 pane._setBreakpoint(outerElement, pane._breakpointTypes.SubtreeM odified, true); 275 pane._setBreakpoint(outerElement, pane._breakpointTypes.SubtreeM odified, true);
276 pane._saveBreakpoints(); 276 pane._saveBreakpoints();
277 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n outerElement."); 277 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n outerElement.");
278 InspectorTest.reloadPage(step2); 278 InspectorTest.reloadPage(step2);
279 } 279 }
280 280
281 function step2() 281 function step2()
282 { 282 {
283 InspectorTest.expandElementsTree(step3); 283 InspectorTest.expandElementsTree(step3);
284 } 284 }
285 285
286 function step3() 286 function step3()
287 { 287 {
288 InspectorTest.evaluateInPageWithTimeout("appendElementToAuthorSh adowTree('outerElement', 'childElement')"); 288 InspectorTest.evaluateInPageWithTimeout("appendElementToAuthorSh adowTree('outerElement', 'childElement')");
289 InspectorTest.addResult("Append childElement to outerElement."); 289 InspectorTest.addResult("Append childElement to outerElement.");
290 waitUntilPausedAndDumpStack(next); 290 InspectorTest.waitUntilPausedAndDumpStackAndResume(next);
291 } 291 }
292 } 292 }
293 293
294 ]); 294 ]);
295
296 function waitUntilPausedAndDumpStack(callback)
297 {
298 InspectorTest.waitUntilPaused(paused);
299 InspectorTest.addSniffer(WebInspector.CallStackSidebarPane.prototype, "s etStatus", setStatus);
300
301 var caption;
302 var callFrames;
303
304 function setStatus(status)
305 {
306 if (typeof status === "string")
307 caption = status;
308 else
309 caption = status.textContent;
310 if (callFrames)
311 step1();
312 }
313
314 function paused(frames)
315 {
316 callFrames = frames;
317 if (typeof caption === "string")
318 step1();
319 }
320
321 function step1()
322 {
323 InspectorTest.captureStackTrace(callFrames);
324 InspectorTest.addResult(caption);
325 InspectorTest.runAfterPendingDispatches(step2);
326 }
327
328 function step2()
329 {
330 InspectorTest.resumeExecution(InspectorTest.safeWrap(callback));
331 }
332 }
333 } 295 }
334 296
335 </script> 297 </script>
336 </head> 298 </head>
337 299
338 <body onload="runTest()"> 300 <body onload="runTest()">
339 <p> 301 <p>
340 Tests DOM breakpoints. <a href="https://bugs.webkit.org/show_bug.cgi?id=42886">B ug 42886</a> 302 Tests DOM breakpoints. <a href="https://bugs.webkit.org/show_bug.cgi?id=42886">B ug 42886</a>
341 </p> 303 </p>
342 304
343 <div id="rootElement" style="color: red"> 305 <div id="rootElement" style="color: red">
344 <div id="elementToRemove"></div> 306 <div id="elementToRemove"></div>
345 </div> 307 </div>
346 308
347 <div id="hostElement"></div> 309 <div id="hostElement"></div>
348 <script> 310 <script>
349 var root = document.getElementById("hostElement").createShadowRoot(); 311 var root = document.getElementById("hostElement").createShadowRoot();
350 root.innerHTML = "<div id='outerElement' style='red'><input id='input'/></div>"; 312 root.innerHTML = "<div id='outerElement' style='red'><input id='input'/></div>";
351 </script> 313 </script>
352 314
353 </body> 315 </body>
354 </html> 316 </html>
OLDNEW
« no previous file with comments | « LayoutTests/inspector/sources/debugger/async-callstack-and-framework-black-box-expected.txt ('k') | LayoutTests/inspector/sources/debugger/frameworks-dom-xhr-event-breakpoints.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698