88 lines
3.2 KiB
Text
88 lines
3.2 KiB
Text
// This test ensure that the sidebar isn't "hidden" on mobile but instead moved out of the viewport.
|
|
// This is especially important for devices for "text-first" content (like for users with
|
|
// sight issues).
|
|
goto: "file://" + |DOC_PATH| + "/test_docs/struct.Foo.html"
|
|
// Switching to "mobile view" by reducing the width to 600px.
|
|
size: (600, 600)
|
|
assert-css: (".sidebar", {"display": "block", "left": "-1000px"})
|
|
// Opening the sidebar menu.
|
|
click: ".sidebar-menu-toggle"
|
|
assert-css: (".sidebar", {"display": "block", "left": "0px"})
|
|
// Closing the sidebar menu.
|
|
click: ".sidebar-menu-toggle"
|
|
assert-css: (".sidebar", {"display": "block", "left": "-1000px"})
|
|
// Force the sidebar open by focusing a link inside it.
|
|
// This makes it easier for keyboard users to get to it.
|
|
focus: ".sidebar-elems h3 a"
|
|
assert-css: (".sidebar", {"display": "block", "left": "0px"})
|
|
// When we tab out of the sidebar, close it.
|
|
focus: ".search-input"
|
|
assert-css: (".sidebar", {"display": "block", "left": "-1000px"})
|
|
|
|
// Open the sidebar menu.
|
|
click: ".sidebar-menu-toggle"
|
|
assert-css: (".sidebar", {"left": "0px"})
|
|
|
|
// Make sure the "struct Foo" header is hidden, since the mobile topbar already does it.
|
|
assert-css: ("//nav[contains(@class, 'sidebar')]//h2/a[text()='Foo']/parent::h2", {"display": "none"})
|
|
// Make sure the global navigation is still here.
|
|
assert-css: ("//nav[contains(@class, 'sidebar')]//h2/a[text()='In test_docs']/parent::h2", {"display": "block"})
|
|
|
|
// Click elsewhere.
|
|
click: "body"
|
|
assert-css: (".sidebar", {"display": "block", "left": "-1000px"})
|
|
|
|
// Open the sidebar menu, and make sure pressing Escape closes it.
|
|
click: ".sidebar-menu-toggle"
|
|
assert-css: (".sidebar", {"left": "0px"})
|
|
press-key: "Escape"
|
|
assert-css: (".sidebar", {"display": "block", "left": "-1000px"})
|
|
|
|
// Check that the topbar is visible
|
|
assert-property: (".mobile-topbar", {"clientHeight": "45"})
|
|
|
|
// Check that clicking an element from the sidebar scrolls to the right place
|
|
// so the target is not obscured by the topbar.
|
|
click: ".sidebar-menu-toggle"
|
|
click: ".sidebar-elems section .block li > a"
|
|
assert-position: ("#method\.must_use", {"y": 45})
|
|
|
|
// Check that the bottom-most item on the sidebar menu can be scrolled fully into view.
|
|
click: ".sidebar-menu-toggle"
|
|
scroll-to: ".block.keyword li:nth-child(1)"
|
|
compare-elements-position-near: (".block.keyword li:nth-child(1)", ".mobile-topbar", {"y": 543.19})
|
|
|
|
// Now checking the background color of the sidebar.
|
|
show-text: true
|
|
|
|
define-function: (
|
|
"check-colors",
|
|
(theme, color, background),
|
|
block {
|
|
local-storage: {"rustdoc-use-system-theme": "false", "rustdoc-theme": |theme|}
|
|
reload:
|
|
|
|
// Open the sidebar menu.
|
|
click: ".sidebar-menu-toggle"
|
|
assert-css: (".sidebar", {
|
|
"background-color": |background|,
|
|
"color": |color|,
|
|
})
|
|
},
|
|
)
|
|
|
|
call-function: ("check-colors", {
|
|
"theme": "ayu",
|
|
"color": "rgb(197, 197, 197)",
|
|
"background": "rgb(20, 25, 31)",
|
|
})
|
|
call-function: ("check-colors", {
|
|
"theme": "dark",
|
|
"color": "rgb(221, 221, 221)",
|
|
"background": "rgb(80, 80, 80)",
|
|
})
|
|
call-function: ("check-colors", {
|
|
"theme": "light",
|
|
"color": "rgb(0, 0, 0)",
|
|
"background": "rgb(245, 245, 245)",
|
|
})
|