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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: chrome/browser/resources/shared/js/cr/ui/position_util_test.html

Issue 11962043: Move webui resources from chrome\browser\resources\shared to ui\webui\resources. (Closed) Base URL: svn://chrome-svn/chrome/trunk/src/
Patch Set: Created 7 years, 11 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 | « chrome/browser/resources/shared/js/cr/ui/position_util.js ('k') | chrome/browser/resources/shared/js/cr/ui/repeating_button.js » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <!-- TODO(arv): Check in Closue unit tests and make this run as part of the
5 tests -->
6 <script src="http://closure-library.googlecode.com/svn/trunk/closure/goog/base.j s"></script>
7 <script src="../../cr.js"></script>
8 <script src="position_util.js"></script>
9 <script>
10
11 goog.require('goog.testing.PropertyReplacer');
12 goog.require('goog.testing.jsunit');
13
14 </script>
15 <style>
16
17 html, body {
18 margin: 0;
19 width: 100%;
20 height: 100%;
21 }
22
23 #anchor {
24 position: absolute;
25 width: 10px;
26 height: 10px;
27 background: green;
28 }
29
30 #popup {
31 position: absolute;
32 top: 0;
33 left: 0;
34 width: 100px;
35 height: 100px;
36 background: red;
37 }
38
39 </style>
40 </head>
41 <body>
42
43 <div id=anchor></div>
44 <div id=popup></div>
45
46 <script>
47
48 var anchor = document.getElementById('anchor');
49 var popup = document.getElementById('popup');
50 var anchorParent = anchor.offsetParent;
51 var pr = new goog.testing.PropertyReplacer;
52 var availRect;
53
54 function MockRect(w, h) {
55 this.width = w;
56 this.height = h;
57 this.right = this.left + w;
58 this.bottom = this.top + h;
59 }
60 MockRect.prototype = {
61 left: 0,
62 top: 0
63 };
64
65 function setUp() {
66 anchor.style.top = '100px';
67 anchor.style.left = '100px';
68 availRect = new MockRect(200, 200);
69 pr.set(anchorParent, 'getBoundingClientRect', function() {
70 return availRect;
71 });
72 }
73
74 function tearDown() {
75 document.documentElement.dir = 'ltr';
76 pr.reset();
77 }
78
79 function testAbovePrimary() {
80 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.ABOVE);
81
82 assertEquals('auto', popup.style.top);
83 assertEquals('100px', popup.style.bottom);
84
85 anchor.style.top = '90px';
86 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.ABOVE);
87 assertEquals('100px', popup.style.top);
88 assertEquals('auto', popup.style.bottom);
89 }
90
91 function testBelowPrimary() {
92 // ensure enough below
93 anchor.style.top = '90px';
94
95 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.BELOW);
96
97 assertEquals('100px', popup.style.top);
98 assertEquals('auto', popup.style.bottom);
99
100 // ensure not enough below
101 anchor.style.top = '100px';
102
103 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.BELOW);
104 assertEquals('auto', popup.style.top);
105 assertEquals('100px', popup.style.bottom);
106 }
107
108 function testBeforePrimary() {
109 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.BEFORE);
110
111 assertEquals('auto', popup.style.left);
112 assertEquals('100px', popup.style.right);
113
114 anchor.style.left = '90px';
115 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.BEFORE);
116 assertEquals('100px', popup.style.left);
117 assertEquals('auto', popup.style.right);
118 }
119
120 function testBeforePrimaryRtl() {
121 document.documentElement.dir = 'rtl';
122
123 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.AFTER);
124
125 assertEquals('auto', popup.style.left);
126 assertEquals('100px', popup.style.right);
127
128 anchor.style.left = '90px';
129
130 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.AFTER);
131 assertEquals('100px', popup.style.left);
132 assertEquals('auto', popup.style.right);
133 }
134
135 function testAfterPrimary() {
136 // ensure enough to the right
137 anchor.style.left = '90px';
138
139 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.AFTER);
140
141 assertEquals('100px', popup.style.left);
142 assertEquals('auto', popup.style.right);
143
144 // ensure not enough below
145 anchor.style.left = '100px';
146
147 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.AFTER);
148 assertEquals('auto', popup.style.left);
149 assertEquals('100px', popup.style.right);
150 }
151
152 function testAfterPrimaryRtl() {
153 document.documentElement.dir = 'rtl';
154
155 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.AFTER);
156
157 assertEquals('auto', popup.style.left);
158 assertEquals('100px', popup.style.right);
159
160 // ensure not enough below
161 anchor.style.left = '90px';
162
163 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.AFTER);
164 assertEquals('100px', popup.style.left);
165 assertEquals('auto', popup.style.right);
166 }
167
168 function testAboveSecondary() {
169 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.ABOVE);
170
171 assertEquals('100px', popup.style.left);
172 assertEquals('auto', popup.style.right);
173
174 anchor.style.left = '110px';
175
176 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.ABOVE);
177
178 assertEquals('auto', popup.style.left);
179 assertEquals('80px', popup.style.right);
180 }
181
182 function testAboveSecondaryRtl() {
183 document.documentElement.dir = 'rtl';
184
185 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.ABOVE);
186
187 assertEquals('auto', popup.style.left);
188 assertEquals('90px', popup.style.right);
189
190 anchor.style.left = '80px';
191
192 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.ABOVE);
193
194 assertEquals('80px', popup.style.left);
195 assertEquals('auto', popup.style.right);
196 }
197
198 function testAboveSecondarySwappedAlign() {
199 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.ABOVE, true);
200
201 assertEquals('auto', popup.style.left);
202 assertEquals('90px', popup.style.right);
203
204 anchor.style.left = '80px';
205
206 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.ABOVE, true);
207
208 assertEquals('80px', popup.style.left);
209 assertEquals('auto', popup.style.right);
210 }
211
212 function testBelowSecondary() {
213 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.BELOW);
214
215 assertEquals('100px', popup.style.left);
216 assertEquals('auto', popup.style.right);
217
218 anchor.style.left = '110px';
219
220 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.BELOW);
221
222 assertEquals('auto', popup.style.left);
223 assertEquals('80px', popup.style.right);
224 }
225
226 function testBelowSecondaryRtl() {
227 document.documentElement.dir = 'rtl';
228
229 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.BELOW);
230
231 assertEquals('auto', popup.style.left);
232 assertEquals('90px', popup.style.right);
233
234 anchor.style.left = '80px';
235
236 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.BELOW);
237
238 assertEquals('80px', popup.style.left);
239 assertEquals('auto', popup.style.right);
240 }
241
242 function testBelowSecondarySwappedAlign() {
243 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.BELOW, true);
244
245 assertEquals('auto', popup.style.left);
246 assertEquals('90px', popup.style.right);
247
248 anchor.style.left = '80px';
249
250 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.BELOW, true);
251
252 assertEquals('80px', popup.style.left);
253 assertEquals('auto', popup.style.right);
254 }
255
256 function testBeforeSecondary() {
257 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.BEFORE);
258
259 assertEquals('100px', popup.style.top);
260 assertEquals('auto', popup.style.bottom);
261
262 anchor.style.top = '110px';
263
264 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.BEFORE);
265
266 assertEquals('auto', popup.style.top);
267 assertEquals('80px', popup.style.bottom);
268 }
269
270 function testAfterSecondary() {
271 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.AFTER);
272
273 assertEquals('100px', popup.style.top);
274 assertEquals('auto', popup.style.bottom);
275
276 anchor.style.top = '110px';
277
278 cr.ui.positionPopupAroundElement(anchor, popup, cr.ui.AnchorType.AFTER);
279
280 assertEquals('auto', popup.style.top);
281 assertEquals('80px', popup.style.bottom);
282 }
283
284 function testPositionAtPoint() {
285 cr.ui.positionPopupAtPoint(100, 100, popup);
286
287 assertEquals('100px', popup.style.left);
288 assertEquals('100px', popup.style.top);
289 assertEquals('auto', popup.style.right);
290 assertEquals('auto', popup.style.bottom);
291
292 cr.ui.positionPopupAtPoint(100, 150, popup);
293
294 assertEquals('100px', popup.style.left);
295 assertEquals('auto', popup.style.top);
296 assertEquals('auto', popup.style.right);
297 assertEquals('50px', popup.style.bottom);
298
299 cr.ui.positionPopupAtPoint(150, 150, popup);
300
301 assertEquals('auto', popup.style.left);
302 assertEquals('auto', popup.style.top);
303 assertEquals('50px', popup.style.right);
304 assertEquals('50px', popup.style.bottom);
305 }
306
307 </script>
308
309 </body>
310 </html>
OLDNEW
« no previous file with comments | « chrome/browser/resources/shared/js/cr/ui/position_util.js ('k') | chrome/browser/resources/shared/js/cr/ui/repeating_button.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698