From 9566db1e496e6a834529e0ffbe3397b0c0d6803a Mon Sep 17 00:00:00 2001 From: Michael Howell Date: Tue, 19 Dec 2023 18:22:38 -0700 Subject: [PATCH] Fix corner cases when dealing with mobile mode --- src/librustdoc/html/static/css/rustdoc.css | 15 ++++++---- src/librustdoc/html/static/js/main.js | 18 +++++------- tests/rustdoc-gui/sidebar-resize-setting.goml | 28 +++++++++++++++++++ .../src/theme_css/custom-theme.css | 1 + 4 files changed, 45 insertions(+), 17 deletions(-) diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css index 619ad1d0d49..0125d42c1c2 100644 --- a/src/librustdoc/html/static/css/rustdoc.css +++ b/src/librustdoc/html/static/css/rustdoc.css @@ -1560,6 +1560,9 @@ a.tooltip:hover::after { left: 8px; z-index: 101; } +.hide-sidebar .src #sidebar-button { + position: static; +} #settings-menu > a, #help-button > a, #sidebar-button > a { display: flex; align-items: center; @@ -1896,6 +1899,12 @@ in src-script.js and main.js .src .search-form { margin-left: 40px; } + .hide-sidebar .search-form { + margin-left: 32px; + } + .hide-sidebar .src .search-form { + margin-left: 0; + } .sidebar.shown, .src-sidebar-expanded .src .sidebar, @@ -2020,12 +2029,6 @@ in src-script.js and main.js .src .src-sidebar-title { padding-top: 0; } - .hide-sidebar #sidebar-button { - position: static; - } - .src #sidebar-button { - position: fixed; - } /* Position of the "[-]" element. */ details.toggle:not(.top-doc) > summary { diff --git a/src/librustdoc/html/static/js/main.js b/src/librustdoc/html/static/js/main.js index 410bf2e34ca..8ff0dac6add 100644 --- a/src/librustdoc/html/static/js/main.js +++ b/src/librustdoc/html/static/js/main.js @@ -1519,18 +1519,14 @@ href="https://doc.rust-lang.org/${channel}/rustdoc/read-documentation/search.htm // and it can be activated by resizing the sidebar into nothing. const sidebarButton = document.getElementById("sidebar-button"); if (sidebarButton) { - if (document.querySelector(".rustdoc.src")) { - sidebarButton.addEventListener("click", e => { + sidebarButton.addEventListener("click", e => { + removeClass(document.documentElement, "hide-sidebar"); + updateLocalStorage("hide-sidebar", "false"); + if (document.querySelector(".rustdoc.src")) { window.rustdocToggleSrcSidebar(); - e.preventDefault(); - }); - } else { - sidebarButton.addEventListener("click", e => { - removeClass(document.documentElement, "hide-sidebar"); - updateLocalStorage("hide-sidebar", "false"); - e.preventDefault(); - }); - } + } + e.preventDefault(); + }); } // Pointer capture. diff --git a/tests/rustdoc-gui/sidebar-resize-setting.goml b/tests/rustdoc-gui/sidebar-resize-setting.goml index 2fdb2faa864..32471f9db4e 100644 --- a/tests/rustdoc-gui/sidebar-resize-setting.goml +++ b/tests/rustdoc-gui/sidebar-resize-setting.goml @@ -21,3 +21,31 @@ wait-for-css: ("#settings", {"display": "block"}) assert-property: ("#hide-sidebar", {"checked": "true"}) click: "#hide-sidebar" wait-for-css: (".sidebar", {"display": "block"}) + +// Verify that hiding the sidebar hides the source sidebar +// and puts the button in static position mode on mobile +go-to: "file://" + |DOC_PATH| + "/src/test_docs/lib.rs.html" +set-window-size: (600, 600) +focus: "#settings-menu a" +press-key: "Enter" +wait-for-css: ("#settings", {"display": "block"}) +wait-for-css: ("#sidebar-button", {"position": "fixed"}) +store-position: ("#sidebar-button", { + "y": sidebar_button_y, + "x": sidebar_button_x, +}) +assert-property: ("#hide-sidebar", {"checked": "false"}) +click: "#hide-sidebar" +wait-for-css: (".sidebar", {"display": "none"}) +wait-for-css: ("#sidebar-button", {"position": "static"}) +assert-position: ("#sidebar-button", { + "y": |sidebar_button_y|, + "x": |sidebar_button_x|, +}) +assert-property: ("#hide-sidebar", {"checked": "true"}) +press-key: "Escape" +// Clicking the sidebar button should work, and implicitly re-enable +// the persistent navigation bar +wait-for-css: ("#settings", {"display": "none"}) +click: "#sidebar-button" +wait-for-css: (".sidebar", {"display": "block"}) diff --git a/tests/rustdoc-gui/src/theme_css/custom-theme.css b/tests/rustdoc-gui/src/theme_css/custom-theme.css index 49227d9ea11..b7f89d4cf15 100644 --- a/tests/rustdoc-gui/src/theme_css/custom-theme.css +++ b/tests/rustdoc-gui/src/theme_css/custom-theme.css @@ -18,6 +18,7 @@ --code-attribute-color: #999; --toggles-color: #999; --toggle-filter: none; + --mobile-sidebar-menu-filter: none; --search-input-focused-border-color: #66afe9; --copy-path-button-color: #999; --copy-path-img-filter: invert(50%);