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

Side by Side Diff: LayoutTests/fast/backgrounds/background-repeat-computed-style.html

Issue 231153003: Added backround-repeat-x and -y as keyword properties. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Added background-repeat-x(-y) test. 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
« no previous file with comments | « no previous file | LayoutTests/fast/backgrounds/background-repeat-computed-style-expected.txt » ('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 <title>Syntax for backgroundRepeat</title> 3 <title>Syntax for backgroundRepeat</title>
ojan 2014/04/14 17:17:59 Typically we only include the html, head, title an
Dmitry Zvorygin 2014/04/15 11:30:41 Done.
4 <style type="text/css"> 4 <style type="text/css">
ojan 2014/04/14 17:17:59 No need to include the type attribute.
Dmitry Zvorygin 2014/04/15 11:30:41 Done.
5 #testDiv 5 .testDiv
6 { 6 {
7 background-image: url(resources/map.jpg); 7 background-image: url(resources/map.jpg);
8 width:500px; 8 width:500px;
9 height:500px; 9 height:500px;
10 border: 10px solid black; 10 border: 10px solid black;
11 } 11 }
12
13 .testDivNoRepeat
14 {
15 background-image: url(resources/map.jpg);
16 background-repeat: no-repeat;
17 width:500px;
18 height:500px;
19 border: 10px solid black;
20 }
12 </style> 21 </style>
13 <script> 22 <script>
14 if (window.testRunner) 23 if (window.testRunner)
15 window.testRunner.dumpAsText(); 24 window.testRunner.dumpAsText();
16 </script> 25 </script>
17 </head> 26 </head>
18 <body> 27 <body>
19 <div id="testDiv" style="background-repeat:repeat-x">This div should have a horizontal repeating background</div> 28 <div id="case1" class="testDiv" style="background-repeat:repeat-x">This div should have a horizontal repeating background (background-repeat:repeat-x)</div>
20 <div id="testresult">Fail</div> 29 <div id="case2" class="testDiv" style="background-repeat:repeat-y">This div should have a vertical repeating background (background-repeat:repeat-y)</div>
30 <div id="case3" class="testDiv" style="background-repeat-y:no-repeat">This d iv should have a horizontal repeating background (background-repeat-y:no-repeat) </div>
31 <div id="case4" class="testDiv" style="background-repeat-x:no-repeat">This d iv should have a vertical repeating background (background-repeat-x:no-repeat)</ div>
32 <div id="case5" class="testDiv" style="background-repeat-x:repeat; backgroun d-repeat-y:repeat">This div should have vertical and horizontal repeating backgr ound ()</div>
33 <div id="case6" class="testDiv">This div should have vertical and horizontal repeating background (background-repeat-x:repeat; background-repeat-y:repeat)</ div>
34 <div id="case7" class="testDivNoRepeat" style="background-repeat-x:repeat">T his div should have a horizontal repeating background (background-repeat: no-rep eat; background-repeat-x:repeat)</div>
35 <div id="case8" class="testDivNoRepeat" style="background-repeat-y:repeat">T his div should have a vertical repeating background (background-repeat: no-repea t; background-repeat-y:repeat)</div>
36 <div id="case9" class="testDivNoRepeat" style="background-repeat:repeat">Thi s div should have a vertical and horizontal repeating background (background-rep eat: repeat;)</div>
37 <div id="case10" class="testDivNoRepeat" style="background-repeat-x:repeat; background-repeat-y:repeat">This div should have vertical and horizontal repeati ng background (background-repeat-x:repeat; background-repeat-y:repeat)</div>
38 <div id="case11" class="testDivNoRepeat" style="">This div should have no re peating background ()</div>
39 <div id="case12" class="testDiv" style="background-repeat-x:no-repeat; backg round-repeat-y:no-repeat">This div should have no repeating background (backgrou nd-repeat-x:no-repeat; background-repeat-y:no-repeat)</div>
ojan 2014/04/14 17:17:59 Can you also add a test-case for the values of bac
Dmitry Zvorygin 2014/04/15 11:30:41 Done.
40 <div id="testresult" style="white-space: pre">Fail</div>
21 <script type="text/javascript"> 41 <script type="text/javascript">
ojan 2014/04/14 17:17:59 ditto.
Dmitry Zvorygin 2014/04/15 11:30:41 Done.
22 if(window.getComputedStyle(testDiv, "").getPropertyValue("background-rep eat") == "repeat-x") 42 var expectations = {
23 { 43 "case1": "repeat-x",
24 document.getElementById("testresult").innerHTML = "Pass"; 44 "case2": "repeat-y",
45 "case3": "repeat-x",
46 "case4": "repeat-y",
47 "case5": "repeat",
48 "case6": "repeat",
49 "case7": "repeat-x",
50 "case8": "repeat-y",
51 "case9": "repeat",
52 "case10": "repeat",
53 "case11": "no-repeat",
54 "case12": "no-repeat",
55 };
56
57 var failed = false;
58 var log = "";
59
60 // Check element's style
61 for (var caseId in expectations) {
62 var testCase = document.getElementById(caseId);
ojan 2014/04/14 17:17:59 Indentation is off (should be 4 spaces)
Dmitry Zvorygin 2014/04/15 11:30:41 Done.
63 var style = window.getComputedStyle(testCase);
64 var testData = expectations[caseId];
65 var value = style.getPropertyValue("background-repeat");
66 if (value !== testData) {
67 log += "Expected [" +testData+ "] as background-repeat on [" + caseI d + "] but got [" + value + "]\r\n";
68 }
25 } 69 }
70
71 document.getElementById("testresult").innerHTML = log ? log : "Passed";
26 </script> 72 </script>
27 </body> 73 </body>
28 </html> 74 </html>
OLDNEW
« no previous file with comments | « no previous file | LayoutTests/fast/backgrounds/background-repeat-computed-style-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698