bjoernager/rust
bjoernager/rust
1
Fork 0
Code Activity

rustdoc: change mobile breakpoint to match CSS

Browse source 
Since it's possible to have a 700.5px viewport width, the JS needs to not
switch to mobile mode in such a setup.
This commit is contained in:
Michael Howell 2022-10-17 14:20:04 -07:00
parent bbac29c095
commit d4e4b08b9b
3 changed files with 7 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/librustdoc/html/static/js/main.js
View file

@ -737,7 +737,7 @@ function loadCss(cssFileName) {
window.rustdocMobileScrollLock = function() { window.rustdocMobileScrollLock = function() {
const mobile_topbar = document.querySelector(".mobile-topbar"); const mobile_topbar = document.querySelector(".mobile-topbar");
if (window.innerWidth < window.RUSTDOC_MOBILE_BREAKPOINT) { if (window.innerWidth <= window.RUSTDOC_MOBILE_BREAKPOINT) {
// This is to keep the scroll position on mobile. // This is to keep the scroll position on mobile.
oldSidebarScrollPosition = window.scrollY; oldSidebarScrollPosition = window.scrollY;
document.body.style.width = `${document.body.offsetWidth}px`; document.body.style.width = `${document.body.offsetWidth}px`;
@ -783,7 +783,7 @@ function loadCss(cssFileName) {
} }
window.addEventListener("resize", () => { window.addEventListener("resize", () => {
if (window.innerWidth >= window.RUSTDOC_MOBILE_BREAKPOINT && if (window.innerWidth > window.RUSTDOC_MOBILE_BREAKPOINT &&
oldSidebarScrollPosition !== null) { oldSidebarScrollPosition !== null) {
// If the user opens the sidebar in "mobile" mode, and then grows the browser window, // If the user opens the sidebar in "mobile" mode, and then grows the browser window,
// we need to switch away from mobile mode and make the main content area scrollable. // we need to switch away from mobile mode and make the main content area scrollable.

2
src/librustdoc/html/static/js/storage.js
View file

@ -12,7 +12,7 @@ window.mainTheme = document.getElementById("mainThemeStyle");
// WARNING: RUSTDOC_MOBILE_BREAKPOINT MEDIA QUERY // WARNING: RUSTDOC_MOBILE_BREAKPOINT MEDIA QUERY
// If you update this line, then you also need to update the media query with the same // If you update this line, then you also need to update the media query with the same
// warning in rustdoc.css // warning in rustdoc.css
window.RUSTDOC_MOBILE_BREAKPOINT = 701; window.RUSTDOC_MOBILE_BREAKPOINT = 700;
const settingsDataset = (function() { const settingsDataset = (function() {
const settingsElement = document.getElementById("default-settings"); const settingsElement = document.getElementById("default-settings");

8
src/test/rustdoc-gui/sidebar-mobile-scroll.goml
View file

@ -1,12 +1,12 @@
// This test ensures that the mobile sidebar preserves scroll position. // This test ensures that the mobile sidebar preserves scroll position.
goto: "file://" + |DOC_PATH| + "/test_docs/struct.Foo.html" goto: "file://" + |DOC_PATH| + "/test_docs/struct.Foo.html"
// Switching to "mobile view" by reducing the width to 600px. // Switching to "mobile view" by reducing the width to 600px.
size: (600, 600) size: (700, 600)
assert-css: (".sidebar", {"display": "block", "left": "-1000px"}) assert-css: (".sidebar", {"display": "block", "left": "-1000px"})
// Scroll down. // Scroll down.
scroll-to: "//h2[@id='blanket-implementations']" scroll-to: "//h2[@id='blanket-implementations']"
assert-window-property: {"pageYOffset": "651"} assert-window-property: {"pageYOffset": "627"}
// Open the sidebar menu. // Open the sidebar menu.
click: ".sidebar-menu-toggle" click: ".sidebar-menu-toggle"
@ -21,11 +21,11 @@ assert-window-property: {"pageYOffset": "0"}
// Close the sidebar menu. Make sure the scroll position gets restored. // Close the sidebar menu. Make sure the scroll position gets restored.
click: ".sidebar-menu-toggle" click: ".sidebar-menu-toggle"
wait-for-css: (".sidebar", {"left": "-1000px"}) wait-for-css: (".sidebar", {"left": "-1000px"})
assert-window-property: {"pageYOffset": "651"} assert-window-property: {"pageYOffset": "627"}
// Now test that scrollability returns when the browser window is just resized. // Now test that scrollability returns when the browser window is just resized.
click: ".sidebar-menu-toggle" click: ".sidebar-menu-toggle"
wait-for-css: (".sidebar", {"left": "0px"}) wait-for-css: (".sidebar", {"left": "0px"})
assert-window-property: {"pageYOffset": "0"} assert-window-property: {"pageYOffset": "0"}
size: (900, 600) size: (900, 600)
assert-window-property: {"pageYOffset": "651"} assert-window-property: {"pageYOffset": "627"}