LayoutTests/fast/backgrounds/background-repeat-computed-style.html - Issue 231153003: Added backround-repeat-x and -y as keyword properties.

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 test cases. Reworked test style as requested. 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 <!DOCTYPE html>

2 <head>	2 <style>

3 <title>Syntax for backgroundRepeat</title>	3 .testDiv

4 <style type="text/css">	4 {

5 #testDiv	5 background-image: url(resources/map.jpg);

6 {	6 width:500px;

7 background-image: url(resources/map.jpg);	7 height:500px;

8 width:500px;	8 border: 10px solid black;

9 height:500px;	9 }

10 border: 10px solid black;	10

11 }	11 .testDivNoRepeat

12 </style>	12 {

13 <script>	13 background-image: url(resources/map.jpg);

14 if (window.testRunner)	14 background-repeat: no-repeat;

15 window.testRunner.dumpAsText();	15 width:500px;

16 </script>	16 height:500px;

17 </head>	17 border: 10px solid black;

18 <body>	18 }

19 <div id="testDiv" style="background-repeat:repeat-x">This div should have a horizontal repeating background</div>	19 </style>

20 <div id="testresult">Fail</div>	20 <script>

21 <script type="text/javascript">	21 if (window.testRunner)

22 if(window.getComputedStyle(testDiv, "").getPropertyValue("background-rep eat") == "repeat-x")	22 window.testRunner.dumpAsText();

23 {	23 </script>

24 document.getElementById("testresult").innerHTML = "Pass";	24 <div id="case1" class="testDiv" style="background-repeat:repeat-x">This div shou ld have a horizontal repeating background (background-repeat:repeat-x)</div>

25 }	25 <div id="case2" class="testDiv" style="background-repeat:repeat-y">This div shou ld have a vertical repeating background (background-repeat:repeat-y)</div>

26 </script>	26 <div id="case3" class="testDiv" style="background-repeat-y:no-repeat">This div s hould have a horizontal repeating background (background-repeat-y:no-repeat)</di v>

27 </body>	27 <div id="case4" class="testDiv" style="background-repeat-x:no-repeat">This div s hould have a vertical repeating background (background-repeat-x:no-repeat)</div>

28 </html>	28 <div id="case5" class="testDiv" style="background-repeat-x:repeat; background-re peat-y:repeat">This div should have vertical and horizontal repeating background ()</div>

	29 <div id="case6" class="testDiv">This div should have vertical and horizontal rep eating background (background-repeat-x:repeat; background-repeat-y:repeat)</div>

	30 <div id="case7" class="testDivNoRepeat" style="background-repeat-x:repeat">This div should have a horizontal repeating background (background-repeat: no-repeat; background-repeat-x:repeat)</div>

	31 <div id="case8" class="testDivNoRepeat" style="background-repeat-y:repeat">This div should have a vertical repeating background (background-repeat: no-repeat; b ackground-repeat-y:repeat)</div>

	32 <div id="case9" class="testDivNoRepeat" style="background-repeat:repeat">This di v should have a vertical and horizontal repeating background (background-repeat: repeat;)</div>

	33 <div id="case10" class="testDivNoRepeat" style="background-repeat-x:repeat; back ground-repeat-y:repeat">This div should have vertical and horizontal repeating b ackground (background-repeat-x:repeat; background-repeat-y:repeat)</div>

	34 <div id="case11" class="testDivNoRepeat" style="">This div should have no repeat ing background ()</div>

	35 <div id="case12" class="testDivNoRepeat" style="background-repeat-x:no-repeat; b ackground-repeat-y:no-repeat">This div should have no repeating background (back ground-repeat-x:no-repeat; background-repeat-y:no-repeat)</div>

	36 <div id="case13" class="testDivNoRepeat" style="background-repeat-x:repeat-y; ba ckground-repeat-y:repeat-x">This div should have no repeating background: invali d css (background-repeat-x:repeat-y; background-repeat-y:repeat-x)</div>

	37 <div id="case14" class="testDivNoRepeat" style="background-repeat-x:repeat-x; ba ckground-repeat-y:repeat-y">This div should have no repeating background: invali d css (background-repeat-x:repeat-x; background-repeat-y:repeat-y)</div>

	38 <div id="case15" class="testDivNoRepeat" style="background-repeat-x:10px;">This div should have no repeating background: invalid css (background-repeat-x:10px;) </div>

	39 <div id="case16" class="testDivNoRepeat" style="background-repeat:black;">This d iv should have no repeating background: invalid css (background-repeat:black;)</ div>

	40 <div id="testresult" style="white-space: pre">Fail</div>

	41 <script>

	42 var expectations = {

	43 "case1": "repeat-x",

	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);

	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 }

	69 }

	70

	71 document.getElementById("testresult").innerHTML = log ? log : "Passed";

	72 </script>

	73

OLD	NEW

« no previous file with comments | « no previous file | LayoutTests/fast/backgrounds/background-repeat-computed-style-expected.txt » ('j') | no next file with comments »