src/test/rustdoc-gui/sidebar-mobile.goml

   1 // This test ensure that the sidebar isn't "hidden" on mobile but instead moved out of the viewport.
   2 // This is especially important for devices for "text-first" content (like for users with
   3 // sight issues).
   4 goto: file://|DOC_PATH|/test_docs/struct.Foo.html
   5 // Switching to "mobile view" by reducing the width to 600px.
   6 size: (600, 600)
   7 assert-css: (".sidebar", {"display": "block", "left": "-1000px"})
   8 // Opening the sidebar menu.
   9 click: ".sidebar-menu-toggle"
  10 assert-css: (".sidebar", {"display": "block", "left": "0px"})
  11 // Closing the sidebar menu.
  12 click: ".sidebar-menu-toggle"
  13 assert-css: (".sidebar", {"display": "block", "left": "-1000px"})
  14 // Force the sidebar open by focusing a link inside it.
  15 // This makes it easier for keyboard users to get to it.
  16 focus: ".sidebar-title a"
  17 assert-css: (".sidebar", {"display": "block", "left": "0px"})
  18 // When we tab out of the sidebar, close it.
  19 focus: ".search-input"
  20 assert-css: (".sidebar", {"display": "block", "left": "-1000px"})
  21
  22 // Open the sidebar menu.
  23 click: ".sidebar-menu-toggle"
  24 assert-css: (".sidebar", {"left": "0px"})
  25
  26 // Click elsewhere.
  27 click: "body"
  28 assert-css: (".sidebar", {"display": "block", "left": "-1000px"})
  29
  30 // Check that the topbar is visible
  31 assert-property: (".mobile-topbar", {"clientHeight": "45"})
  32
  33 // Check that clicking an element from the sidebar scrolls to the right place
  34 // so the target is not obscured by the topbar.
  35 click: ".sidebar-menu-toggle"
  36 click: ".sidebar-elems section .block li > a"
  37 assert-position: ("#method\.must_use", {"y": 45})
  38
  39 // Check that the bottom-most item on the sidebar menu can be scrolled fully into view.
  40 click: ".sidebar-menu-toggle"
  41 scroll-to: ".block.keyword li:nth-child(1)"
  42 compare-elements-position-near: (".block.keyword li:nth-child(1)", ".mobile-topbar", {"y": 543})