1 // This test ensures that the elements in the sidebar are displayed correctly.
3 goto: "file://" + |DOC_PATH| + "/src/test_docs/lib.rs.html"
4 // Since the javascript is disabled, there shouldn't be a toggle.
5 assert-false: "#sidebar-toggle"
6 wait-for-css: (".sidebar", {"display": "none"})
8 // Let's retry with javascript enabled.
11 wait-for: "#sidebar-toggle"
12 assert-css: ("#sidebar-toggle", {"visibility": "visible"})
13 assert-css: (".sidebar > *:not(#sidebar-toggle)", {"visibility": "hidden"})
14 // Let's expand the sidebar now.
15 click: "#sidebar-toggle"
16 wait-for-css: ("#sidebar-toggle", {"visibility": "visible"})
18 // We now check that opening the sidebar and clicking a link will leave it open.
19 // The behavior here on desktop is different than the behavior on mobile,
20 // but since the sidebar doesn't fill the entire screen here, it makes sense to have the
21 // sidebar stay resident.
22 wait-for-css: (".sidebar", {"width": "300px"})
23 assert-local-storage: {"rustdoc-source-sidebar-show": "true"}
24 click: ".sidebar a.selected"
25 goto: "file://" + |DOC_PATH| + "/src/test_docs/lib.rs.html"
26 wait-for-css: (".sidebar", {"width": "300px"})
27 assert-local-storage: {"rustdoc-source-sidebar-show": "true"}
29 // Now we check the display of the sidebar items.
35 theme, color, color_hover, background, background_hover, background_toggle,
36 background_toggle_hover,
39 ("local-storage", {"rustdoc-theme": |theme|, "rustdoc-use-system-theme": "false"}),
41 ("wait-for-css", ("#sidebar-toggle", {"visibility": "visible"})),
43 "#source-sidebar details[open] > .files a.selected",
44 {"color": |color_hover|, "background-color": |background|},
46 // Without hover or focus.
47 ("assert-css", ("#sidebar-toggle > button", {"background-color": |background_toggle|})),
49 ("focus", "#sidebar-toggle > button"),
50 ("assert-css", ("#sidebar-toggle > button", {"background-color": |background_toggle_hover|})),
51 ("focus", ".search-input"),
53 ("move-cursor-to", "#sidebar-toggle > button"),
54 ("assert-css", ("#sidebar-toggle > button", {"background-color": |background_toggle_hover|})),
57 "#source-sidebar details[open] > .files a:not(.selected)",
58 {"color": |color|, "background-color": |background_toggle|},
61 ("focus", "#source-sidebar details[open] > .files a:not(.selected)"),
63 "#source-sidebar details[open] > .files a:not(.selected)",
64 {"color": |color_hover|, "background-color": |background_hover|},
66 ("focus", ".search-input"),
68 ("move-cursor-to", "#source-sidebar details[open] > .files a:not(.selected)"),
70 "#source-sidebar details[open] > .files a:not(.selected)",
71 {"color": |color_hover|, "background-color": |background_hover|},
75 "#source-sidebar details[open] > .folders > details > summary",
76 {"color": |color|, "background-color": |background_toggle|},
79 ("focus", "#source-sidebar details[open] > .folders > details > summary"),
81 "#source-sidebar details[open] > .folders > details > summary",
82 {"color": |color_hover|, "background-color": |background_hover|},
84 ("focus", ".search-input"),
86 ("move-cursor-to", "#source-sidebar details[open] > .folders > details > summary"),
88 "#source-sidebar details[open] > .folders > details > summary",
89 {"color": |color_hover|, "background-color": |background_hover|},
94 call-function: ("check-colors", {
96 "color": "rgb(0, 0, 0)",
97 "color_hover": "rgb(0, 0, 0)",
98 "background": "rgb(255, 255, 255)",
99 "background_hover": "rgb(224, 224, 224)",
100 "background_toggle": "rgba(0, 0, 0, 0)",
101 "background_toggle_hover": "rgb(224, 224, 224)",
103 call-function: ("check-colors", {
105 "color": "rgb(221, 221, 221)",
106 "color_hover": "rgb(221, 221, 221)",
107 "background": "rgb(51, 51, 51)",
108 "background_hover": "rgb(68, 68, 68)",
109 "background_toggle": "rgba(0, 0, 0, 0)",
110 "background_toggle_hover": "rgb(103, 103, 103)",
112 call-function: ("check-colors", {
114 "color": "rgb(197, 197, 197)",
115 "color_hover": "rgb(255, 180, 76)",
116 "background": "rgb(20, 25, 31)",
117 "background_hover": "rgb(20, 25, 31)",
118 "background_toggle": "rgba(0, 0, 0, 0)",
119 "background_toggle_hover": "rgba(70, 70, 70, 0.33)",
122 // Now checking on mobile devices.
125 // Waiting for the sidebar to be displayed...
126 wait-for-css: ("#sidebar-toggle", {"visibility": "visible"})
128 // We now check it takes the full size of the display.
129 assert-property: ("body", {"clientWidth": "500", "clientHeight": "700"})
130 assert-property: (".sidebar", {"clientWidth": "500", "clientHeight": "700"})
132 // We now check the display of the toggle once the sidebar is expanded.
133 assert-property: ("#sidebar-toggle", {"clientWidth": "500", "clientHeight": "39"})
137 "border-top-width": "0px",
138 "border-right-width": "0px",
139 "border-left-width": "0px",
140 "border-bottom-width": "1px",
144 // We now check that the scroll position is kept when opening the sidebar.
145 click: "#sidebar-toggle"
146 wait-for-css: (".sidebar", {"width": "0px"})
147 // We scroll to line 117 to change the scroll position.
148 scroll-to: '//*[@id="117"]'
149 assert-window-property: {"pageYOffset": "2542"}
150 // Expanding the sidebar...
151 click: "#sidebar-toggle"
152 wait-for-css: (".sidebar", {"width": "500px"})
153 click: "#sidebar-toggle"
154 wait-for-css: (".sidebar", {"width": "0px"})
155 // The "scrollTop" property should be the same.
156 assert-window-property: {"pageYOffset": "2542"}
158 // We now check that the scroll position is restored if the window is resized.
160 click: "#sidebar-toggle"
161 wait-for-css: ("#source-sidebar", {"visibility": "visible"})
162 assert-window-property: {"pageYOffset": "0"}
164 assert-window-property: {"pageYOffset": "2542"}
166 click: "#sidebar-toggle"
167 wait-for-css: ("#source-sidebar", {"visibility": "hidden"})
169 // We now check that opening the sidebar and clicking a link will close it.
170 // The behavior here on mobile is different than the behavior on desktop,
171 // but common sense dictates that if you have a list of files that fills the entire screen, and
172 // you click one of them, you probably want to actually see the file's contents, and not just
173 // make it the current selection.
174 click: "#sidebar-toggle"
175 wait-for-css: ("#source-sidebar", {"visibility": "visible"})
176 assert-local-storage: {"rustdoc-source-sidebar-show": "true"}
177 click: ".sidebar a.selected"
178 goto: "file://" + |DOC_PATH| + "/src/test_docs/lib.rs.html"
179 wait-for-css: ("#source-sidebar", {"visibility": "hidden"})
180 assert-local-storage: {"rustdoc-source-sidebar-show": "false"}
181 // Resize back to desktop size, to check that the sidebar doesn't spontaneously open.
183 wait-for-css: ("#source-sidebar", {"visibility": "hidden"})
184 assert-local-storage: {"rustdoc-source-sidebar-show": "false"}
185 click: "#sidebar-toggle"
186 wait-for-css: ("#source-sidebar", {"visibility": "visible"})
187 assert-local-storage: {"rustdoc-source-sidebar-show": "true"}