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

Side by Side Diff: LayoutTests/fast/multicol/vertical-rl/image-inside-nested-blocks-with-border.html

Issue 1173313003: Correct fast/multicol/vertical-rl/image-inside-nested-blocks-with-border.html (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Created 5 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
OLDNEW
1 <html> 1 <!DOCTYPE html>
2 <body style="-webkit-writing-mode: vertical-rl"> 2 <script src="../../../resources/js-test.js"></script>
3 <div id="tests" style="-webkit-column-count:2; -webkit-column-gap:0; column-coun t:2; column-gap:0; column-fill:auto; width:300px; height:600px;">
4 <div style="width:280px"></div>
5 <div id="f1" style="border:5px solid black; float:left">
6 <img style="display:block;height:140px;width:80px;">
7 </div>
8 </div>
9 <div id="result"></div>
10 <script> 3 <script>
4 description("Test that getBoundingClientRect works as expected on a float in the second column - writing-mode is vertical-rl.");
5 </script>
6 <body style="-webkit-writing-mode:vertical-rl;">
7 <div id="multicol" style="-webkit-column-count:2; -webkit-column-gap:0; colu mn-fill:auto; width:300px; height:600px;">
8 <div style="width:280px;"></div>
9 <div id="f1" style="border:5px solid black; float:left;">
10 <img style="display:block; height:140px; width:80px;">
11 </div>
12 </div>
13 <script>
11 function floatOffset(float) 14 function floatOffset(float)
12 { 15 {
13 var parentRect = document.getElementById('tests').getBoundingClientRect( ); 16 var parentRect = document.getElementById("multicol").getBoundingClientRe ct();
14 var rect = float.getBoundingClientRect(); 17 var rect = float.getBoundingClientRect();
15 return { width: rect.left - parentRect.left, height: rect.top - parentRe ct.top }; 18 return { left: rect.left - parentRect.left, top: rect.top - parentRect.t op };
16 } 19 }
17 20
18 var tests = [ 21 var result = floatOffset(document.getElementById("f1"));
19 ["f1", 0, 300] 22 shouldBe("result.left", "210");
20 ]; 23 shouldBe("result.top", "300");
21 24 </script>
22 var test;
23 var failures = 0;
24 while (test = tests.shift()) {
25 var float = document.getElementById(test[0]);
26 var result = floatOffset(float);
27 var passed = result.width === test[1] && result.height === test[2]
28 float.style.backgroundColor = passed ? "green" : "red";
29 if (!passed) {
30 failures++
31 alert(result.width + " " + result.height)
32 }
33 }
34
35 if (window.testRunner) {
36 testRunner.dumpAsText();
37 document.getElementById("tests").style.display = "none";
38 }
39
40 document.getElementById("result").innerText = failures ? "FAIL: " + failures + " cases failed" : "PASS";
41 </script>
42
43
44
45 </body> 25 </body>
46 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698