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

Side by Side Diff: third_party/WebKit/LayoutTests/fast/dom/shadow/css-focus-pseudo-match-shadow-host5.html

Issue 1684533002: Rename "tree of trees" to "composed tree". (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Created 4 years, 10 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
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <script src="../../../resources/js-test.js"></script> 2 <script src="../../../resources/js-test.js"></script>
3 <script src="resources/shadow-dom.js"></script> 3 <script src="resources/shadow-dom.js"></script>
4 <style> 4 <style>
5 div { 5 div {
6 background-color: white; 6 background-color: white;
7 } 7 }
8 8
9 div#shadow-host:focus { 9 div#shadow-host:focus {
10 background-color: green; 10 background-color: green;
(...skipping 26 matching lines...) Expand all
37 sandbox.offsetTop; 37 sandbox.offsetTop;
38 } 38 }
39 39
40 function testNestedDistribution() { 40 function testNestedDistribution() {
41 debug('testing nested distribution'); 41 debug('testing nested distribution');
42 42
43 buildNestedDistributionTree(false, false); 43 buildNestedDistributionTree(false, false);
44 44
45 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); 45 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');
46 46
47 var outerInput = getNodeInTreeOfTrees('outer-input'); 47 var outerInput = getNodeInComposedTree('outer-input');
48 var input1 = getNodeInTreeOfTrees('input1'); 48 var input1 = getNodeInComposedTree('input1');
49 var input2 = getNodeInTreeOfTrees('shadow-host/input2'); 49 var input2 = getNodeInComposedTree('shadow-host/input2');
50 var input3 = getNodeInTreeOfTrees('shadow-host/inner-shadow-host/input3'); 50 var input3 = getNodeInComposedTree('shadow-host/inner-shadow-host/input3');
51 51
52 debug('#input1, #input2 are (re)distributed in the same treescope as #input3 , but :focus on shadow host only matches when a focused element is under its sha dow tree.'); 52 debug('#input1, #input2 are (re)distributed in the same treescope as #input3 , but :focus on shadow host only matches when a focused element is under its sha dow tree.');
53 53
54 debug('(1/4) top and inner shadow do not delegate focus.'); 54 debug('(1/4) top and inner shadow do not delegate focus.');
55 outerInput.focus(); 55 outerInput.focus();
56 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); 56 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');
57 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ; 57 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ;
58 58
59 input1.focus(); 59 input1.focus();
60 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); 60 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');
61 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ; 61 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ;
62 62
63 input2.focus(); 63 input2.focus();
64 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); 64 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');
65 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ; 65 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ;
66 66
67 input3.focus(); 67 input3.focus();
68 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); 68 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');
69 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ; 69 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ;
70 70
71 debug('(2/4) top shadow delegates, but inner shadow does not.'); 71 debug('(2/4) top shadow delegates, but inner shadow does not.');
72 buildNestedDistributionTree(true, false); 72 buildNestedDistributionTree(true, false);
73 73
74 var outerInput = getNodeInTreeOfTrees('outer-input'); 74 var outerInput = getNodeInComposedTree('outer-input');
75 var input1 = getNodeInTreeOfTrees('input1'); 75 var input1 = getNodeInComposedTree('input1');
76 var input2 = getNodeInTreeOfTrees('shadow-host/input2'); 76 var input2 = getNodeInComposedTree('shadow-host/input2');
77 var input3 = getNodeInTreeOfTrees('shadow-host/inner-shadow-host/input3'); 77 var input3 = getNodeInComposedTree('shadow-host/inner-shadow-host/input3');
78 78
79 outerInput.focus(); 79 outerInput.focus();
80 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); 80 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');
81 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ; 81 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ;
82 82
83 input1.focus(); 83 input1.focus();
84 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); 84 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');
85 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ; 85 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ;
86 86
87 input2.focus(); 87 input2.focus();
88 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)'); 88 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)');
89 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ; 89 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ;
90 90
91 input3.focus(); 91 input3.focus();
92 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)'); 92 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)');
93 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ; 93 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ;
94 94
95 debug('(3/4) top shadow does not delegate, but inner shadow does.'); 95 debug('(3/4) top shadow does not delegate, but inner shadow does.');
96 buildNestedDistributionTree(false, true); 96 buildNestedDistributionTree(false, true);
97 97
98 var outerInput = getNodeInTreeOfTrees('outer-input'); 98 var outerInput = getNodeInComposedTree('outer-input');
99 var input1 = getNodeInTreeOfTrees('input1'); 99 var input1 = getNodeInComposedTree('input1');
100 var input2 = getNodeInTreeOfTrees('shadow-host/input2'); 100 var input2 = getNodeInComposedTree('shadow-host/input2');
101 var input3 = getNodeInTreeOfTrees('shadow-host/inner-shadow-host/input3'); 101 var input3 = getNodeInComposedTree('shadow-host/inner-shadow-host/input3');
102 102
103 outerInput.focus(); 103 outerInput.focus();
104 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); 104 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');
105 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ; 105 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ;
106 106
107 input1.focus(); 107 input1.focus();
108 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); 108 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');
109 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ; 109 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ;
110 110
111 input2.focus(); 111 input2.focus();
112 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); 112 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');
113 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ; 113 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ;
114 114
115 input3.focus(); 115 input3.focus();
116 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); 116 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');
117 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(0, 0, 255)'); 117 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(0, 0, 255)');
118 118
119 debug('(4/4) both shadow hosts delagate focus.'); 119 debug('(4/4) both shadow hosts delagate focus.');
120 buildNestedDistributionTree(true, true); 120 buildNestedDistributionTree(true, true);
121 121
122 var outerInput = getNodeInTreeOfTrees('outer-input'); 122 var outerInput = getNodeInComposedTree('outer-input');
123 var input1 = getNodeInTreeOfTrees('input1'); 123 var input1 = getNodeInComposedTree('input1');
124 var input2 = getNodeInTreeOfTrees('shadow-host/input2'); 124 var input2 = getNodeInComposedTree('shadow-host/input2');
125 var input3 = getNodeInTreeOfTrees('shadow-host/inner-shadow-host/input3'); 125 var input3 = getNodeInComposedTree('shadow-host/inner-shadow-host/input3');
126 126
127 outerInput.focus(); 127 outerInput.focus();
128 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); 128 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');
129 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ; 129 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ;
130 130
131 input1.focus(); 131 input1.focus();
132 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); 132 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');
133 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ; 133 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ;
134 134
135 input2.focus(); 135 input2.focus();
136 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)'); 136 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)');
137 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ; 137 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)') ;
138 138
139 input3.focus(); 139 input3.focus();
140 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)'); 140 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)');
141 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(0, 0, 255)'); 141 backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(0, 0, 255)');
142 } 142 }
143 143
144 testNestedDistribution(); 144 testNestedDistribution();
145 </script> 145 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698