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

Issues Search
    My Issues | Starred     Open | Closed | All

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

Issue 2837203002: [DevTools] Move dom breakpoints to DOMDebuggerModel (Closed)
Patch Set: addressed review comments Created 3 years, 7 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
« no previous file with comments | « no previous file | third_party/WebKit/LayoutTests/inspector/sources/debugger-breakpoints/dom-breakpoints-editing-dom-from-inspector.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 64 matching lines...) Expand 10 before | Expand all | Expand 10 after
75 function appendElementToOpenShadowRoot(childId) 75 function appendElementToOpenShadowRoot(childId)
76 { 76 {
77 var child = document.createElement("div"); 77 var child = document.createElement("div");
78 child.id = childId; 78 child.id = childId;
79 authorShadowRoot().appendChild(child); 79 authorShadowRoot().appendChild(child);
80 } 80 }
81 81
82 function test() 82 function test()
83 { 83 {
84 84
85 var pane = Components.domBreakpointsSidebarPane; 85 var pane = self.runtime.sharedInstance(Components.DOMBreakpointsSidebarPane) ;
86 var rootElement; 86 var rootElement;
87 var outerElement; 87 var outerElement;
88 var authorShadowRoot; 88 var authorShadowRoot;
89 InspectorTest.runDebuggerTestSuite([ 89 InspectorTest.runDebuggerTestSuite([
90 function testInsertChild(next) 90 function testInsertChild(next)
91 { 91 {
92 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint is hit when appending a child."); 92 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint is hit when appending a child.");
93 InspectorTest.nodeWithId("rootElement", step2); 93 InspectorTest.nodeWithId("rootElement", step2);
94 94
95 function step2(node) 95 function step2(node)
96 { 96 {
97 rootElement = node; 97 rootElement = node;
98 pane._setBreakpoint(node, Components.DOMBreakpointsSidebarPane.B reakpointTypes.SubtreeModified, true); 98 InspectorTest.domDebuggerModel.setDOMBreakpoint(node, SDK.DOMDeb uggerModel.DOMBreakpoint.Type.SubtreeModified);
99 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n rootElement."); 99 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n rootElement.");
100 InspectorTest.evaluateInPageWithTimeout("appendElement('rootElem ent', 'childElement')"); 100 InspectorTest.evaluateInPageWithTimeout("appendElement('rootElem ent', 'childElement')");
101 InspectorTest.addResult("Append childElement to rootElement."); 101 InspectorTest.addResult("Append childElement to rootElement.");
102 InspectorTest.waitUntilPausedAndDumpStackAndResume(next); 102 InspectorTest.waitUntilPausedAndDumpStackAndResume(next);
103 } 103 }
104 }, 104 },
105 105
106 function testBreakpointToggle(next) 106 function testBreakpointToggle(next)
107 { 107 {
108 InspectorTest.addResult("Test that DOM breakpoint toggles properly u sing checkbox."); 108 InspectorTest.addResult("Test that DOM breakpoint toggles properly u sing checkbox.");
109 Components.domBreakpointsSidebarPane._setBreakpoint(rootElement, Com ponents.DOMBreakpointsSidebarPane.BreakpointTypes.AttributeModified, true); 109 var breakpoint = InspectorTest.domDebuggerModel.setDOMBreakpoint(roo tElement, SDK.DOMDebuggerModel.DOMBreakpoint.Type.AttributeModified);
110 InspectorTest.addResult("Set DOM breakpoint."); 110 InspectorTest.addResult("Set DOM breakpoint.");
111 var elementId = pane._createBreakpointId(rootElement.id, Components. DOMBreakpointsSidebarPane.BreakpointTypes.AttributeModified); 111 pane._items.get(breakpoint).checkbox.click();
112 var element = pane._breakpointElements.get(elementId);
113 element._checkboxElement.click();
114 InspectorTest.addResult("Uncheck DOM breakpoint."); 112 InspectorTest.addResult("Uncheck DOM breakpoint.");
115 InspectorTest.evaluateInPagePromise("modifyAttribute('rootElement', 'data-test-breakpoint-toggle', 'foo')").then(step2); 113 InspectorTest.evaluateInPagePromise("modifyAttribute('rootElement', 'data-test-breakpoint-toggle', 'foo')").then(step2);
116 InspectorTest.addResult("DOM breakpoint should not be hit when disab led."); 114 InspectorTest.addResult("DOM breakpoint should not be hit when disab led.");
117 115
118 function step2() 116 function step2()
119 { 117 {
120 InspectorTest.addResult("Check DOM breakpoint."); 118 InspectorTest.addResult("Check DOM breakpoint.");
121 element._checkboxElement.click(); 119 pane._items.get(breakpoint).checkbox.click();
122 InspectorTest.evaluateInPageWithTimeout("modifyAttribute('rootEl ement', 'data-test-breakpoint-toggle', 'bar')"); 120 InspectorTest.evaluateInPageWithTimeout("modifyAttribute('rootEl ement', 'data-test-breakpoint-toggle', 'bar')");
123 InspectorTest.addResult("Test that DOM breakpoint is hit when re -enabled."); 121 InspectorTest.addResult("Test that DOM breakpoint is hit when re -enabled.");
124 InspectorTest.waitUntilPausedAndDumpStackAndResume(next); 122 InspectorTest.waitUntilPausedAndDumpStackAndResume(next);
125 } 123 }
126 }, 124 },
127 125
128 function testInsertGrandchild(next) 126 function testInsertGrandchild(next)
129 { 127 {
130 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint is hit when appending a grandchild."); 128 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint is hit when appending a grandchild.");
131 InspectorTest.evaluateInPageWithTimeout("appendElement('childElement ', 'grandchildElement')"); 129 InspectorTest.evaluateInPageWithTimeout("appendElement('childElement ', 'grandchildElement')");
(...skipping 19 matching lines...) Expand all
151 function step2() 149 function step2()
152 { 150 {
153 InspectorTest.waitUntilPaused(step3); 151 InspectorTest.waitUntilPaused(step3);
154 InspectorTest.evaluateInPageWithTimeout("breakDebugger()"); 152 InspectorTest.evaluateInPageWithTimeout("breakDebugger()");
155 InspectorTest.addResult("Call breakDebugger, expect it to show u p in next stack trace."); 153 InspectorTest.addResult("Call breakDebugger, expect it to show u p in next stack trace.");
156 } 154 }
157 155
158 function step3(frames) 156 function step3(frames)
159 { 157 {
160 InspectorTest.captureStackTrace(frames); 158 InspectorTest.captureStackTrace(frames);
161 pane._removeBreakpoint(rootElement, Components.DOMBreakpointsSid ebarPane.BreakpointTypes.SubtreeModified); 159 InspectorTest.domDebuggerModel.removeDOMBreakpoint(rootElement, SDK.DOMDebuggerModel.DOMBreakpoint.Type.SubtreeModified);
162 InspectorTest.resumeExecution(next); 160 InspectorTest.resumeExecution(next);
163 } 161 }
164 }, 162 },
165 163
166 function testModifyAttribute(next) 164 function testModifyAttribute(next)
167 { 165 {
168 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when modifying attribute."); 166 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when modifying attribute.");
169 pane._setBreakpoint(rootElement, Components.DOMBreakpointsSidebarPan e.BreakpointTypes.AttributeModified, true); 167 InspectorTest.domDebuggerModel.setDOMBreakpoint(rootElement, SDK.DOM DebuggerModel.DOMBreakpoint.Type.AttributeModified);
170 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement."); 168 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement.");
171 InspectorTest.evaluateInPageWithTimeout("modifyAttribute('rootElemen t', 'data-test', 'foo')"); 169 InspectorTest.evaluateInPageWithTimeout("modifyAttribute('rootElemen t', 'data-test', 'foo')");
172 InspectorTest.addResult("Modify rootElement data-test attribute."); 170 InspectorTest.addResult("Modify rootElement data-test attribute.");
173 InspectorTest.waitUntilPausedAndDumpStackAndResume(step2); 171 InspectorTest.waitUntilPausedAndDumpStackAndResume(step2);
174 172
175 function step2(callFrames) 173 function step2(callFrames)
176 { 174 {
177 pane._removeBreakpoint(rootElement, Components.DOMBreakpointsSid ebarPane.BreakpointTypes.AttributeModified); 175 InspectorTest.domDebuggerModel.removeDOMBreakpoint(rootElement, SDK.DOMDebuggerModel.DOMBreakpoint.Type.AttributeModified);
178 next(); 176 next();
179 } 177 }
180 }, 178 },
181 179
182 function testModifyAttrNode(next) 180 function testModifyAttrNode(next)
183 { 181 {
184 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when modifying Attr node."); 182 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when modifying Attr node.");
185 pane._setBreakpoint(rootElement, Components.DOMBreakpointsSidebarPan e.BreakpointTypes.AttributeModified, true); 183 InspectorTest.domDebuggerModel.setDOMBreakpoint(rootElement, SDK.DOM DebuggerModel.DOMBreakpoint.Type.AttributeModified);
186 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement."); 184 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement.");
187 InspectorTest.evaluateInPageWithTimeout("modifyAttrNode('rootElement ', 'data-test', 'bar')"); 185 InspectorTest.evaluateInPageWithTimeout("modifyAttrNode('rootElement ', 'data-test', 'bar')");
188 InspectorTest.addResult("Modify rootElement data-test attribute."); 186 InspectorTest.addResult("Modify rootElement data-test attribute.");
189 InspectorTest.waitUntilPausedAndDumpStackAndResume(step2); 187 InspectorTest.waitUntilPausedAndDumpStackAndResume(step2);
190 188
191 function step2(callFrames) 189 function step2(callFrames)
192 { 190 {
193 pane._removeBreakpoint(rootElement, Components.DOMBreakpointsSid ebarPane.BreakpointTypes.AttributeModified); 191 InspectorTest.domDebuggerModel.removeDOMBreakpoint(rootElement, SDK.DOMDebuggerModel.DOMBreakpoint.Type.AttributeModified);
194 next(); 192 next();
195 } 193 }
196 }, 194 },
197 195
198 function testSetAttrNode(next) 196 function testSetAttrNode(next)
199 { 197 {
200 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when adding a new Attr node."); 198 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when adding a new Attr node.");
201 pane._setBreakpoint(rootElement, Components.DOMBreakpointsSidebarPan e.BreakpointTypes.AttributeModified, true); 199 InspectorTest.domDebuggerModel.setDOMBreakpoint(rootElement, SDK.DOM DebuggerModel.DOMBreakpoint.Type.AttributeModified);
202 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement."); 200 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement.");
203 InspectorTest.evaluateInPageWithTimeout("setAttrNode('rootElement', 'data-foo', 'bar')"); 201 InspectorTest.evaluateInPageWithTimeout("setAttrNode('rootElement', 'data-foo', 'bar')");
204 InspectorTest.addResult("Modify rootElement data-foo attribute."); 202 InspectorTest.addResult("Modify rootElement data-foo attribute.");
205 InspectorTest.waitUntilPausedAndDumpStackAndResume(step2); 203 InspectorTest.waitUntilPausedAndDumpStackAndResume(step2);
206 204
207 function step2(callFrames) 205 function step2(callFrames)
208 { 206 {
209 pane._removeBreakpoint(rootElement, Components.DOMBreakpointsSid ebarPane.BreakpointTypes.AttributeModified); 207 InspectorTest.domDebuggerModel.removeDOMBreakpoint(rootElement, SDK.DOMDebuggerModel.DOMBreakpoint.Type.AttributeModified);
210 next(); 208 next();
211 } 209 }
212 }, 210 },
213 211
214 function testModifyStyleAttribute(next) 212 function testModifyStyleAttribute(next)
215 { 213 {
216 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when modifying style attribute."); 214 InspectorTest.addResult("Test that 'Attribute Modified' breakpoint i s hit when modifying style attribute.");
217 pane._setBreakpoint(rootElement, Components.DOMBreakpointsSidebarPan e.BreakpointTypes.AttributeModified, true); 215 InspectorTest.domDebuggerModel.setDOMBreakpoint(rootElement, SDK.DOM DebuggerModel.DOMBreakpoint.Type.AttributeModified);
218 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement."); 216 InspectorTest.addResult("Set 'Attribute Modified' DOM breakpoint on rootElement.");
219 InspectorTest.evaluateInPageWithTimeout("modifyStyleAttribute('rootE lement', 'color', 'green')"); 217 InspectorTest.evaluateInPageWithTimeout("modifyStyleAttribute('rootE lement', 'color', 'green')");
220 InspectorTest.addResult("Modify rootElement style.color attribute.") ; 218 InspectorTest.addResult("Modify rootElement style.color attribute.") ;
221 InspectorTest.waitUntilPausedAndDumpStackAndResume(step2); 219 InspectorTest.waitUntilPausedAndDumpStackAndResume(step2);
222 220
223 function step2(callFrames) 221 function step2(callFrames)
224 { 222 {
225 pane._removeBreakpoint(rootElement, Components.DOMBreakpointsSid ebarPane.BreakpointTypes.AttributeModified); 223 InspectorTest.domDebuggerModel.removeDOMBreakpoint(rootElement, SDK.DOMDebuggerModel.DOMBreakpoint.Type.AttributeModified);
226 next(); 224 next();
227 } 225 }
228 }, 226 },
229 227
230 function testRemoveNode(next) 228 function testRemoveNode(next)
231 { 229 {
232 InspectorTest.addResult("Test that 'Node Removed' breakpoint is hit when removing a node."); 230 InspectorTest.addResult("Test that 'Node Removed' breakpoint is hit when removing a node.");
233 InspectorTest.nodeWithId("elementToRemove", step2); 231 InspectorTest.nodeWithId("elementToRemove", step2);
234 232
235 function step2(node) 233 function step2(node)
236 { 234 {
237 pane._setBreakpoint(node, Components.DOMBreakpointsSidebarPane.B reakpointTypes.NodeRemoved, true); 235 InspectorTest.domDebuggerModel.setDOMBreakpoint(node, SDK.DOMDeb uggerModel.DOMBreakpoint.Type.NodeRemoved);
238 InspectorTest.addResult("Set 'Node Removed' DOM breakpoint on el ementToRemove."); 236 InspectorTest.addResult("Set 'Node Removed' DOM breakpoint on el ementToRemove.");
239 InspectorTest.evaluateInPageWithTimeout("removeElement('elementT oRemove')"); 237 InspectorTest.evaluateInPageWithTimeout("removeElement('elementT oRemove')");
240 InspectorTest.addResult("Remove elementToRemove."); 238 InspectorTest.addResult("Remove elementToRemove.");
241 InspectorTest.waitUntilPausedAndDumpStackAndResume(next); 239 InspectorTest.waitUntilPausedAndDumpStackAndResume(next);
242 } 240 }
243 }, 241 },
244 242
245 function testReload(next) 243 function testReload(next)
246 { 244 {
247 InspectorTest.addResult("Test that DOM breakpoints are persisted bet ween page reloads."); 245 InspectorTest.addResult("Test that DOM breakpoints are persisted bet ween page reloads.");
248 InspectorTest.nodeWithId("rootElement", step2); 246 InspectorTest.nodeWithId("rootElement", step2);
249 247
250 function step2(node) 248 function step2(node)
251 { 249 {
252 pane._setBreakpoint(node, Components.DOMBreakpointsSidebarPane.B reakpointTypes.SubtreeModified, true); 250 InspectorTest.domDebuggerModel.setDOMBreakpoint(node, SDK.DOMDeb uggerModel.DOMBreakpoint.Type.SubtreeModified);
253 pane._saveBreakpoints();
254 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n rootElement."); 251 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n rootElement.");
255 InspectorTest.reloadPage(step3); 252 InspectorTest.reloadPage(step3);
256 } 253 }
257 254
258 function step3() 255 function step3()
259 { 256 {
260 InspectorTest.expandElementsTree(step4); 257 InspectorTest.expandElementsTree(step4);
261 } 258 }
262 259
263 function step4() 260 function step4()
264 { 261 {
265 InspectorTest.evaluateInPageWithTimeout("appendElement('rootElem ent', 'childElement')"); 262 InspectorTest.evaluateInPageWithTimeout("appendElement('rootElem ent', 'childElement')");
266 InspectorTest.addResult("Append childElement to rootElement."); 263 InspectorTest.addResult("Append childElement to rootElement.");
267 InspectorTest.waitUntilPausedAndDumpStackAndResume(next); 264 InspectorTest.waitUntilPausedAndDumpStackAndResume(next);
268 } 265 }
269 }, 266 },
270 267
271 function testInsertChildIntoAuthorShadowTree(next) 268 function testInsertChildIntoAuthorShadowTree(next)
272 { 269 {
273 InspectorTest.shadowRootByHostId("hostElement", callback); 270 InspectorTest.shadowRootByHostId("hostElement", callback);
274 271
275 function callback(node) 272 function callback(node)
276 { 273 {
277 authorShadowRoot = node; 274 authorShadowRoot = node;
278 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint on author shadow root is hit when appending a child."); 275 InspectorTest.addResult("Test that 'Subtree Modified' breakpoint on author shadow root is hit when appending a child.");
279 pane._setBreakpoint(authorShadowRoot, Components.DOMBreakpointsS idebarPane.BreakpointTypes.SubtreeModified, true); 276 InspectorTest.domDebuggerModel.setDOMBreakpoint(authorShadowRoot , SDK.DOMDebuggerModel.DOMBreakpoint.Type.SubtreeModified);
280 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n author shadow root."); 277 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n author shadow root.");
281 InspectorTest.evaluateInPageWithTimeout("appendElementToOpenShad owRoot('childElement')"); 278 InspectorTest.evaluateInPageWithTimeout("appendElementToOpenShad owRoot('childElement')");
282 InspectorTest.addResult("Append childElement to author shadow ro ot."); 279 InspectorTest.addResult("Append childElement to author shadow ro ot.");
283 InspectorTest.waitUntilPausedAndDumpStackAndResume(next); 280 InspectorTest.waitUntilPausedAndDumpStackAndResume(next);
284 } 281 }
285 }, 282 },
286 283
287 function testReloadWithShadowElementBreakpoint(next) 284 function testReloadWithShadowElementBreakpoint(next)
288 { 285 {
289 InspectorTest.nodeWithId("outerElement", step1); 286 InspectorTest.nodeWithId("outerElement", step1);
290 287
291 function step1(node) 288 function step1(node)
292 { 289 {
293 outerElement = node; 290 outerElement = node;
294 291
295 InspectorTest.addResult("Test that shadow DOM breakpoints are pe rsisted between page reloads."); 292 InspectorTest.addResult("Test that shadow DOM breakpoints are pe rsisted between page reloads.");
296 pane._setBreakpoint(outerElement, Components.DOMBreakpointsSideb arPane.BreakpointTypes.SubtreeModified, true); 293 InspectorTest.domDebuggerModel.setDOMBreakpoint(outerElement, SD K.DOMDebuggerModel.DOMBreakpoint.Type.SubtreeModified);
297 pane._saveBreakpoints();
298 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n outerElement."); 294 InspectorTest.addResult("Set 'Subtree Modified' DOM breakpoint o n outerElement.");
299 InspectorTest.reloadPage(step2); 295 InspectorTest.reloadPage(step2);
300 } 296 }
301 297
302 function step2() 298 function step2()
303 { 299 {
304 InspectorTest.expandElementsTree(step3); 300 InspectorTest.expandElementsTree(step3);
305 } 301 }
306 302
307 function step3() 303 function step3()
(...skipping 20 matching lines...) Expand all
328 </div> 324 </div>
329 325
330 <div id="hostElement"></div> 326 <div id="hostElement"></div>
331 <script> 327 <script>
332 var root = document.getElementById("hostElement").createShadowRoot(); 328 var root = document.getElementById("hostElement").createShadowRoot();
333 root.innerHTML = "<div id='outerElement' style='red'><input id='input'/></div>"; 329 root.innerHTML = "<div id='outerElement' style='red'><input id='input'/></div>";
334 </script> 330 </script>
335 331
336 </body> 332 </body>
337 </html> 333 </html>
OLDNEW
« no previous file with comments | « no previous file | third_party/WebKit/LayoutTests/inspector/sources/debugger-breakpoints/dom-breakpoints-editing-dom-from-inspector.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698