Chromium Code Reviews| Index: third_party/WebKit/LayoutTests/fast/spatial-navigation/snav-css-nav-direction.html |
| diff --git a/third_party/WebKit/LayoutTests/fast/spatial-navigation/snav-css-nav-direction.html b/third_party/WebKit/LayoutTests/fast/spatial-navigation/snav-css-nav-direction.html |
| new file mode 100644 |
| index 0000000000000000000000000000000000000000..cf5c1c5e92180ef633cc4184b098c728dc488ada |
| --- /dev/null |
| +++ b/third_party/WebKit/LayoutTests/fast/spatial-navigation/snav-css-nav-direction.html |
| @@ -0,0 +1,132 @@ |
| +<!DOCTYPE html> |
| +<html> |
| +<head> |
| +<script src="../../resources/js-test.js"></script> |
| +<script src="resources/spatial-navigation-utils.js"></script> |
| +<script type="application/javascript"> |
| +jsTestIsAsync = true; |
| + |
| +var resultMap = [ |
| + ["Right", "e9"], |
| + ["Up", "e9"], |
| + ["Right", "e5"], |
| + ["Up", "e2"], |
| + ["Left", "e4"], |
| + ["Left", "e6"], |
| + ["Down", "e8"], |
| + ["Down", "fr1"], |
| + ["Down", "e5"], |
| + ["DONE", "DONE"] |
| +]; |
| + |
| +if (window.testRunner) { |
| + testRunner.overridePreference("WebKitTabToLinksPreferenceKey", 1); |
| + window.internals.settings.setSpatialNavigationEnabled(true); |
| +} |
| + |
| +function testParsingAndSerialization() |
|
fs
2016/05/18 15:55:04
Use a separate test for parsing/serializing. Layou
|
| +{ |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e1')).navUp", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e1')).navDown", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e1')).navLeft", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e1')).navRight", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e2')).navUp", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e2')).navDown", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e2')).navLeft", '"#e4" current'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e2')).navRight", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e3')).navUp", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e3')).navDown", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e3')).navLeft", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e3')).navRight", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e4')).navUp", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e4')).navDown", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e4')).navLeft", '"#e6" current'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e4')).navRight", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e5')).navDown", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e5')).navUp", '"#e2" current'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e5')).navDown", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e5')).navLeft", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e5')).navRight", '"#e9" current'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e6')).navUp", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e6')).navDown", '"#e8" current'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e6')).navLeft", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e6')).navRight", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e7')).navUp", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e7')).navDown", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e7')).navLeft", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e7')).navRight", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e8')).navUp", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e8')).navDown", '"#fr1" current'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e8')).navLeft", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e8')).navRight", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e9')).navUp", '"#e9" current'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e9')).navDown", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e9')).navLeft", 'auto'); |
| + shouldBeEqualToString("window.getComputedStyle(document.getElementById('e9')).navRight", '"#e5" current'); |
| +} |
| + |
| +function testNavigation() |
| +{ |
| + // starting the test itself: get to a known place. |
| + document.getElementById("e5").focus(); |
| + |
| + initTest(resultMap, finishJSTest); |
| +} |
| + |
| +function runTest() |
| +{ |
| + testParsingAndSerialization(); |
| + testNavigation(); |
| +} |
| +</script> |
| +</head> |
| +<style> |
| +#e2 { |
| + nav-left: #e4; |
| +} |
| +#e4 { |
| + nav-left: #e6; |
| +} |
| +#e5 { |
| + nav-right: #e9; |
| + nav-up: #e2; |
| +} |
| +#e6 { |
| + nav-down: #e8 current; |
| +} |
| +#e8 { |
| + nav-down: #fr1 "current"; |
| +} |
| +#e9 { |
| + nav-up: #e9; |
| + nav-right: #e5; |
| +} |
| +</style> |
| +<body id="some-content" onload="runTest();"> |
| +<p id="description"> |
| +This test ensures the correctness of Spatial Navigation when CSS3 nav-up/down/left/right properties are set. |
| +</p> |
| +<table style="text-align: left; width: 100%; margin-left: auto; margin-right: auto;" border="1" cellpadding="2" cellspacing="1"> |
| +<tbody> |
| +<tr> |
| +<td style="vertical-align: top; text-align: center;"><a id="e1" href="a">1</a></td> |
| +<td style="vertical-align: top; text-align: center;"><a id="e2" href="a">2</a></td> |
| +<td style="vertical-align: top; text-align: center;"><a id="e3" href="a">3</a></td> |
| +</tr> |
| +<tr> |
| +<td style="vertical-align: top; text-align: center;"><a id="e4" href="a">4</a></td> |
| +<td style="vertical-align: top; text-align: center;"><a id="e5" href="5">5</td> |
| +<td style="vertical-align: top; text-align: center;"><a id="e6" href="a">6</a></td> |
| +</tr> |
| +<tr> |
| +<td style="vertical-align: top; text-align: center;"><a id="e7" href="a">7</a></td> |
| +<td style="vertical-align: top; text-align: center;"><a id="e8" href="a">8</a></td> |
| +<td style="vertical-align: top; text-align: center;"><a id="e9" href="a">9</a></td> |
| +</tr> |
| +</tbody> |
| +</table> |
| +<br/> |
| +<iframe name="current" srcdoc="<button id='fr1' style='nav-down: #e5 root;'>inside frame</button>" style="width:100%; height:40px"></iframe> |
| +<div id="console"></div> |
| +</body> |
| +</html> |