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

Side by Side Diff: third_party/WebKit/LayoutTests/fast/spatial-navigation/snav-css-nav-direction.html

Issue 1919813002: Implementation of CSS3 nav-up/down/left/right properties from CSS3 UI Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Created 4 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
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <script src="../../resources/js-test.js"></script>
5 <script src="resources/spatial-navigation-utils.js"></script>
6 <script type="application/javascript">
7 jsTestIsAsync = true;
8
9 var resultMap = [
10 ["Right", "e9"],
11 ["Up", "e9"],
12 ["Right", "e5"],
13 ["Up", "e2"],
14 ["Left", "e4"],
15 ["Left", "e6"],
16 ["Down", "e8"],
17 ["Down", "fr1"],
18 ["Down", "e5"],
19 ["DONE", "DONE"]
20 ];
21
22 if (window.testRunner) {
23 testRunner.overridePreference("WebKitTabToLinksPreferenceKey", 1);
24 window.internals.settings.setSpatialNavigationEnabled(true);
25 }
26
27 function testParsingAndSerialization()
fs 2016/05/18 15:55:04 Use a separate test for parsing/serializing. Layou
28 {
29 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e1') ).navUp", 'auto');
30 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e1') ).navDown", 'auto');
31 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e1') ).navLeft", 'auto');
32 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e1') ).navRight", 'auto');
33 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e2') ).navUp", 'auto');
34 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e2') ).navDown", 'auto');
35 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e2') ).navLeft", '"#e4" current');
36 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e2') ).navRight", 'auto');
37 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e3') ).navUp", 'auto');
38 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e3') ).navDown", 'auto');
39 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e3') ).navLeft", 'auto');
40 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e3') ).navRight", 'auto');
41 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e4') ).navUp", 'auto');
42 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e4') ).navDown", 'auto');
43 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e4') ).navLeft", '"#e6" current');
44 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e4') ).navRight", 'auto');
45 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e5') ).navDown", 'auto');
46 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e5') ).navUp", '"#e2" current');
47 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e5') ).navDown", 'auto');
48 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e5') ).navLeft", 'auto');
49 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e5') ).navRight", '"#e9" current');
50 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e6') ).navUp", 'auto');
51 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e6') ).navDown", '"#e8" current');
52 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e6') ).navLeft", 'auto');
53 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e6') ).navRight", 'auto');
54 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e7') ).navUp", 'auto');
55 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e7') ).navDown", 'auto');
56 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e7') ).navLeft", 'auto');
57 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e7') ).navRight", 'auto');
58 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e8') ).navUp", 'auto');
59 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e8') ).navDown", '"#fr1" current');
60 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e8') ).navLeft", 'auto');
61 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e8') ).navRight", 'auto');
62 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e9') ).navUp", '"#e9" current');
63 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e9') ).navDown", 'auto');
64 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e9') ).navLeft", 'auto');
65 shouldBeEqualToString("window.getComputedStyle(document.getElementById('e9') ).navRight", '"#e5" current');
66 }
67
68 function testNavigation()
69 {
70 // starting the test itself: get to a known place.
71 document.getElementById("e5").focus();
72
73 initTest(resultMap, finishJSTest);
74 }
75
76 function runTest()
77 {
78 testParsingAndSerialization();
79 testNavigation();
80 }
81 </script>
82 </head>
83 <style>
84 #e2 {
85 nav-left: #e4;
86 }
87 #e4 {
88 nav-left: #e6;
89 }
90 #e5 {
91 nav-right: #e9;
92 nav-up: #e2;
93 }
94 #e6 {
95 nav-down: #e8 current;
96 }
97 #e8 {
98 nav-down: #fr1 "current";
99 }
100 #e9 {
101 nav-up: #e9;
102 nav-right: #e5;
103 }
104 </style>
105 <body id="some-content" onload="runTest();">
106 <p id="description">
107 This test ensures the correctness of Spatial Navigation when CSS3 nav-up/down/le ft/right properties are set.
108 </p>
109 <table style="text-align: left; width: 100%; margin-left: auto; margin-right: au to;" border="1" cellpadding="2" cellspacing="1">
110 <tbody>
111 <tr>
112 <td style="vertical-align: top; text-align: center;"><a id="e1" href="a">1</a></ td>
113 <td style="vertical-align: top; text-align: center;"><a id="e2" href="a">2</a></ td>
114 <td style="vertical-align: top; text-align: center;"><a id="e3" href="a">3</a></ td>
115 </tr>
116 <tr>
117 <td style="vertical-align: top; text-align: center;"><a id="e4" href="a">4</a></ td>
118 <td style="vertical-align: top; text-align: center;"><a id="e5" href="5">5</td>
119 <td style="vertical-align: top; text-align: center;"><a id="e6" href="a">6</a></ td>
120 </tr>
121 <tr>
122 <td style="vertical-align: top; text-align: center;"><a id="e7" href="a">7</a></ td>
123 <td style="vertical-align: top; text-align: center;"><a id="e8" href="a">8</a></ td>
124 <td style="vertical-align: top; text-align: center;"><a id="e9" href="a">9</a></ td>
125 </tr>
126 </tbody>
127 </table>
128 <br/>
129 <iframe name="current" srcdoc="<button id='fr1' style='nav-down: #e5 root;'>insi de frame</button>" style="width:100%; height:40px"></iframe>
130 <div id="console"></div>
131 </body>
132 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698