LayoutTests/inspector/elements/reveal-shadow-dom-node.html - Issue 218703002: DevTools: [wip] move Elements panel off WebInspector.domModel and single tree outline.

Side by Side Diff: LayoutTests/inspector/elements/reveal-shadow-dom-node.html

Issue 218703002: DevTools: [wip] move Elements panel off WebInspector.domModel and single tree outline. (Closed) Base URL: svn://svn.chromium.org/blink/trunk

Patch Set: Review comment addressed (and much more) Created 6 years, 8 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

OLD	NEW
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>	5 <script>

6	6

7 function test()	7 function test()

8 {	8 {

9 var elementsPanel = WebInspector.inspectorView.showPanel("elements");	9 InspectorTest.firstElementsTreeOutline().addEventListener(WebInspector.Eleme ntsTreeOutline.Events.SelectedNodeChanged, selectedNodeChanged);

10 elementsPanel.treeOutline.addEventListener(WebInspector.ElementsTreeOutline. Events.SelectedNodeChanged, selectedNodeChanged);

11	10

12 var nodeChangesRemaining = 2;	11 var nodeChangesRemaining = 2;

13 function selectedNodeChanged(event) {	12 function selectedNodeChanged(event) {

14 var node = event.data;	13 var node = event.data;

15 InspectorTest.addResult("SelectedNodeChanged: " + node.localName() + " " + shadowDOMPart(node));	14 InspectorTest.addResult("SelectedNodeChanged: " + node.localName() + " " + shadowDOMPart(node));

16 if (!--nodeChangesRemaining)	15 if (!--nodeChangesRemaining)

17 InspectorTest.completeTest();	16 InspectorTest.completeTest();

18 }	17 }

19	18

20 function shadowDOMPart(node)	19 function shadowDOMPart(node)

21 {	20 {

22 if (!node.isInShadowTree())	21 if (!node.isInShadowTree())

23 return "(not in shadow tree)";	22 return "(not in shadow tree)";

24 return "(in " + (node.ancestorUserAgentShadowRoot() ? "user-agent" : "au thor") + " shadow DOM)";	23 return "(in " + (node.ancestorUserAgentShadowRoot() ? "user-agent" : "au thor") + " shadow DOM)";

25 }	24 }

26	25

27 InspectorTest.nodeWithId("nested-input", function(node) {	26 InspectorTest.nodeWithId("nested-input", function(node) {

28 node.shadowRoots()[0].getChildNodes(childrenCallback);	27 node.shadowRoots()[0].getChildNodes(childrenCallback);

29	28

30 function childrenCallback(children)	29 function childrenCallback(children)

31 {	30 {

32 var shadowDiv = children[0];	31 var shadowDiv = children[0];

33 InspectorTest.addResult("User-agent shadow DOM hidden:");	32 InspectorTest.addResult("User-agent shadow DOM hidden:");

34 elementsPanel.revealAndSelectNode(shadowDiv.id);	33 WebInspector.panels.elements.revealAndSelectNode(shadowDiv);

35 WebInspector.settings.showUAShadowDOM.set(true);	34 WebInspector.settings.showUAShadowDOM.set(true);

36 InspectorTest.addResult("User-agent shadow DOM shown:");	35 InspectorTest.addResult("User-agent shadow DOM shown:");

37 elementsPanel.revealAndSelectNode(shadowDiv.id);	36 WebInspector.panels.elements.revealAndSelectNode(shadowDiv);

38 }	37 }

39 });	38 });

40 }	39 }

41 </script>	40 </script>

42 </head>	41 </head>

43	42

44 <body onload="runTest()">	43 <body onload="runTest()">

45	44

46 <p id="description">This test verifies that the correct node is revealed in the DOM tree when asked to reveal a user-agent shadow DOM node.</p>	45 <p id="description">This test verifies that the correct node is revealed in the DOM tree when asked to reveal a user-agent shadow DOM node.</p>

47	46

48 <p id="test1"></p>	47 <p id="test1"></p>

49	48

50 <script>	49 <script>

51 var input = document.createElement("input");	50 var input = document.createElement("input");

52 input.id = "nested-input";	51 input.id = "nested-input";

53 input.value = "test";	52 input.value = "test";

54 test1.createShadowRoot().appendChild(input);	53 test1.createShadowRoot().appendChild(input);

55 </script>	54 </script>

56	55

57 </body>	56 </body>

58 </html>	57 </html>

OLD	NEW