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

Unified 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 side-by-side diff with in-line comments

Download patch

Index: LayoutTests/fast/backgrounds/background-repeat-computed-style.html

diff --git a/LayoutTests/fast/backgrounds/background-repeat-computed-style.html b/LayoutTests/fast/backgrounds/background-repeat-computed-style.html

index 99b122d739a0cc2f24bafd9767c54d9cfcf842e0..27f2a15c3d2eb3f86ab50750ad8d07a4638f7d53 100644

--- a/LayoutTests/fast/backgrounds/background-repeat-computed-style.html

+++ b/LayoutTests/fast/backgrounds/background-repeat-computed-style.html

@@ -2,13 +2,22 @@

<head>

<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.

ojan 2014/04/14 17:17:59 No need to include the type attribute.

Dmitry Zvorygin 2014/04/15 11:30:41 Done.

- #testDiv

+ .testDiv

{

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

width:500px;

height:500px;

border: 10px solid black;

}

+ .testDivNoRepeat

+ {

+ background-image: url(resources/map.jpg);

+ background-repeat: no-repeat;

+ width:500px;

+ height:500px;

+ border: 10px solid black;

+ }

</style>

if (window.testRunner)

@@ -16,13 +25,50 @@

</script>

</head>

<body>

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

- <div id="testresult">Fail</div>

+ <div id="case1" class="testDiv" style="background-repeat:repeat-x">This div should have a horizontal repeating background (background-repeat:repeat-x)</div>

+ <div id="case2" class="testDiv" style="background-repeat:repeat-y">This div should have a vertical repeating background (background-repeat:repeat-y)</div>

+ <div id="case3" class="testDiv" style="background-repeat-y:no-repeat">This div should have a horizontal repeating background (background-repeat-y:no-repeat)</div>

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

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

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

+ <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>

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

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

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

+ <div id="case11" class="testDivNoRepeat" style="">This div should have no repeating background ()</div>

+ <div id="case12" class="testDiv" style="background-repeat-x:no-repeat; background-repeat-y:no-repeat">This div should have no repeating background (background-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.

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

ojan 2014/04/14 17:17:59 ditto.

Dmitry Zvorygin 2014/04/15 11:30:41 Done.

- if(window.getComputedStyle(testDiv, "").getPropertyValue("background-repeat") == "repeat-x")

- {

- document.getElementById("testresult").innerHTML = "Pass";

+ var expectations = {

+ "case1": "repeat-x",

+ "case2": "repeat-y",

+ "case3": "repeat-x",

+ "case4": "repeat-y",

+ "case5": "repeat",

+ "case6": "repeat",

+ "case7": "repeat-x",

+ "case8": "repeat-y",

+ "case9": "repeat",

+ "case10": "repeat",

+ "case11": "no-repeat",

+ "case12": "no-repeat",

+ };

+ var failed = false;

+ var log = "";

+ // Check element's style

+ for (var caseId in expectations) {

+ 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.

+ var style = window.getComputedStyle(testCase);

+ var testData = expectations[caseId];

+ var value = style.getPropertyValue("background-repeat");

+ if (value !== testData) {

+ log += "Expected [" +testData+ "] as background-repeat on [" + caseId + "] but got [" + value + "]\r\n";

+ }

}

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

</script>

</body>

</html>

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