1 // This test ensures that the settings menu display is working as expected.
2 goto: file://|DOC_PATH|/test_docs/index.html
3 show-text: true // needed when we check for colors below.
4 // First, we check that the settings page doesn't exist.
5 assert-false: "#settings"
6 // We now click on the settings button.
7 click: "#settings-menu"
9 assert-css: ("#settings", {"display": "block"})
10 // Let's close it by clicking on the same button.
11 click: "#settings-menu"
12 wait-for-css: ("#settings", {"display": "none"})
14 // Let's check that pressing "ESCAPE" is closing it.
15 click: "#settings-menu"
16 wait-for-css: ("#settings", {"display": "block"})
18 wait-for-css: ("#settings", {"display": "none"})
20 // Let's click on it when the search results are displayed.
21 focus: ".search-input"
23 // To be SURE that the search will be run.
25 wait-for: "#alternative-display #search"
26 click: "#settings-menu"
27 wait-for-css: ("#settings", {"display": "block"})
28 // Ensure that the search is still displayed.
29 wait-for: "#alternative-display #search"
30 assert: "#main-content.hidden"
32 // Now let's check the content of the settings menu.
33 local-storage: {"rustdoc-theme": "dark", "rustdoc-use-system-theme": "false"}
35 click: "#settings-menu"
38 // We check that the "Use system theme" is disabled.
39 assert-property: ("#use-system-theme", {"checked": "false"})
40 assert: "//*[@class='setting-line']//span[text()='Use system theme']"
41 // Meaning that only the "theme" menu is showing up.
42 assert: ".setting-line:not(.hidden) #theme"
43 assert: ".setting-line.hidden #preferred-dark-theme"
44 assert: ".setting-line.hidden #preferred-light-theme"
46 // We check that the correct theme is selected.
47 assert-property: ("#theme .choices #theme-dark", {"checked": "true"})
49 // Some style checks...
50 // First we check the "default" display.
54 "border-color": "rgb(221, 221, 221)",
55 "box-shadow": "rgb(53, 53, 53) 0px 0px 0px 3px inset",
58 assert-css: ("#theme-light", {"border-color": "rgb(221, 221, 221)", "box-shadow": "none"})
59 // Let's start with the hover.
60 move-cursor-to: "#theme-dark"
64 "border-color": "rgb(33, 150, 243)",
65 "box-shadow": "rgb(53, 53, 53) 0px 0px 0px 3px inset",
68 move-cursor-to: "#theme-light"
69 assert-css: ("#theme-light", {"border-color": "rgb(33, 150, 243)", "box-shadow": "none"})
70 move-cursor-to: "#theme-ayu"
71 // Let's now check with the focus.
76 "border-color": "rgb(221, 221, 221)",
77 "box-shadow": "rgb(53, 53, 53) 0px 0px 0px 3px inset, rgb(33, 150, 243) 0px 0px 2px 2px",
84 "border-color": "rgb(221, 221, 221)",
85 "box-shadow": "rgb(33, 150, 243) 0px 0px 1px 1px",
88 // Now we check we both focus and hover.
89 move-cursor-to: "#theme-dark"
94 "border-color": "rgb(33, 150, 243)",
95 "box-shadow": "rgb(53, 53, 53) 0px 0px 0px 3px inset, rgb(33, 150, 243) 0px 0px 2px 2px",
98 move-cursor-to: "#theme-light"
103 "border-color": "rgb(33, 150, 243)",
104 "box-shadow": "rgb(33, 150, 243) 0px 0px 1px 1px",
108 // We now switch the display.
109 click: "#use-system-theme"
110 // Wait for the hidden element to show up.
111 wait-for: ".setting-line:not(.hidden) #preferred-dark-theme"
112 assert: ".setting-line:not(.hidden) #preferred-light-theme"
113 // Check that the theme picking is hidden.
114 assert: ".setting-line.hidden #theme"
116 // We check their text as well.
117 assert-text: ("#preferred-dark-theme .setting-name", "Preferred dark theme")
118 assert-text: ("#preferred-light-theme .setting-name", "Preferred light theme")
120 // We now check that clicking on the "sliders"' text is like clicking on the slider.
121 // To test it, we use the "Disable keyboard shortcuts".
122 local-storage: {"rustdoc-disable-shortcuts": "false"}
123 click: ".setting-line:last-child .toggle .label"
124 assert-local-storage: {"rustdoc-disable-shortcuts": "true"}
126 // Make sure that "Disable keyboard shortcuts" actually took effect.
129 assert-false: "#help-button .popover"
130 wait-for-css: ("#settings-menu .popover", {"display": "block"})
132 // Now turn keyboard shortcuts back on, and see if they work.
133 click: ".setting-line:last-child .toggle .label"
134 assert-local-storage: {"rustdoc-disable-shortcuts": "false"}
137 wait-for-css: ("#help-button .popover", {"display": "block"})
138 assert-css: ("#settings-menu .popover", {"display": "none"})
140 // Now we go to the settings page to check that the CSS is loaded as expected.
141 goto: file://|DOC_PATH|/settings.html
142 wait-for: "#settings"
143 assert-css: (".setting-line .toggle .slider", {"width": "45px", "margin-right": "20px"})
145 // We now check the display with JS disabled.
146 assert-false: "noscript section"
149 assert-css: ("noscript section", {"display": "block"})
152 // Check for the display on small screen
156 click: "#settings-menu"
157 wait-for: "#settings"
158 assert-css: ("#settings .slider", {"width": "45px"}, ALL)