From 27ff258826d560d3c57554153bc9dcfdb6712bc9 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Wed, 29 Jun 2022 15:15:40 +0200 Subject: [PATCH 1/7] Fix height for the source sidebar in mobile mode --- src/librustdoc/html/static/css/rustdoc.css | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css index 5d0756d30fb53..3b0d9844e5a3c 100644 --- a/src/librustdoc/html/static/css/rustdoc.css +++ b/src/librustdoc/html/static/css/rustdoc.css @@ -1772,9 +1772,11 @@ details.rustdoc-toggle[open] > summary.hideme::after { /* The source view uses a different design for the sidebar toggle, and doesn't have a topbar, so don't bump down the main content or the sidebar. */ .source main, - .source .sidebar { + .rustdoc.source .sidebar { top: 0; padding: 0; + height: 100vh; + border: 0; } .sidebar.shown, From ea97bdc908ce4651cf9167c52817f46a3b4e200e Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Wed, 29 Jun 2022 15:15:53 +0200 Subject: [PATCH 2/7] Update/add tests for source sidebar in mobile mode --- src/test/rustdoc-gui/sidebar-source-code-display.goml | 10 ++++++++++ src/test/rustdoc-gui/sidebar-source-code.goml | 4 ++-- 2 files changed, 12 insertions(+), 2 deletions(-) diff --git a/src/test/rustdoc-gui/sidebar-source-code-display.goml b/src/test/rustdoc-gui/sidebar-source-code-display.goml index 8f53e8627ee1c..ea8dde7edeb1f 100644 --- a/src/test/rustdoc-gui/sidebar-source-code-display.goml +++ b/src/test/rustdoc-gui/sidebar-source-code-display.goml @@ -116,3 +116,13 @@ assert-css: ( "#source-sidebar .expand + .children .folders .name", {"color": "rgb(255, 180, 76)", "background-color": "rgb(20, 25, 31)"}, ) + +// Now checking on mobile devices. +size: (500, 700) +reload: +// Waiting for the sidebar to be displayed... +wait-for-css: ("#sidebar-toggle", {"visibility": "visible", "opacity": 1}) + +// We now check it takes the full size of the display. +assert-property: ("body", {"clientWidth": "500", "clientHeight": "700"}) +assert-property: (".sidebar", {"clientWidth": "500", "clientHeight": "700"}) \ No newline at end of file diff --git a/src/test/rustdoc-gui/sidebar-source-code.goml b/src/test/rustdoc-gui/sidebar-source-code.goml index 724520bc399d0..86df478fa1dd2 100644 --- a/src/test/rustdoc-gui/sidebar-source-code.goml +++ b/src/test/rustdoc-gui/sidebar-source-code.goml @@ -18,8 +18,8 @@ assert: "nav.sidebar" // We now switch to mobile mode. size: (600, 600) -// We check that the sidebar has the expected width (0 and 1px for the border). -assert-css: ("nav.sidebar", {"width": "1px"}) +// We check that the sidebar has the expected width (0). +assert-css: ("nav.sidebar", {"width": "0px"}) // We expand the sidebar. click: "#sidebar-toggle" assert-css: (".source-sidebar-expanded nav.sidebar", {"width": "600px"}) From ad970a72c34b9a6c2f331c0cf57cc0f13386c5e3 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Wed, 29 Jun 2022 15:28:16 +0200 Subject: [PATCH 3/7] Fix display of toggle on expanded source sidebar --- src/librustdoc/html/static/css/rustdoc.css | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css index 3b0d9844e5a3c..532b98d9bb9f6 100644 --- a/src/librustdoc/html/static/css/rustdoc.css +++ b/src/librustdoc/html/static/css/rustdoc.css @@ -1926,6 +1926,9 @@ details.rustdoc-toggle[open] > summary.hideme::after { width: unset; border-top-right-radius: unset; border-bottom-right-radius: unset; + position: sticky; + border: 0; + border-bottom: 1px solid; } #source-sidebar { From be569634e17e4fe172029e499006d2bd4dbde901 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Wed, 29 Jun 2022 15:30:01 +0200 Subject: [PATCH 4/7] Add test for source sidebar toggle --- .../rustdoc-gui/sidebar-source-code-display.goml | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/src/test/rustdoc-gui/sidebar-source-code-display.goml b/src/test/rustdoc-gui/sidebar-source-code-display.goml index ea8dde7edeb1f..0474a8638db20 100644 --- a/src/test/rustdoc-gui/sidebar-source-code-display.goml +++ b/src/test/rustdoc-gui/sidebar-source-code-display.goml @@ -125,4 +125,16 @@ wait-for-css: ("#sidebar-toggle", {"visibility": "visible", "opacity": 1}) // We now check it takes the full size of the display. assert-property: ("body", {"clientWidth": "500", "clientHeight": "700"}) -assert-property: (".sidebar", {"clientWidth": "500", "clientHeight": "700"}) \ No newline at end of file +assert-property: (".sidebar", {"clientWidth": "500", "clientHeight": "700"}) + +// We now check the display of the toggle once the sidebar is expanded. +assert-property: ("#sidebar-toggle", {"clientWidth": "500", "clientHeight": "39"}) +assert-css: ( + "#sidebar-toggle", + { + "border-top-width": "0px", + "border-right-width": "0px", + "border-left-width": "0px", + "border-bottom-width": "1px", + }, +) From 277b77a5de79076fda48d8952618fae99a8cd7a3 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Wed, 29 Jun 2022 23:20:21 +0200 Subject: [PATCH 5/7] Update browser-ui-test version to 0.9.7 --- .../docker/host-x86_64/x86_64-gnu-tools/browser-ui-test.version | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/ci/docker/host-x86_64/x86_64-gnu-tools/browser-ui-test.version b/src/ci/docker/host-x86_64/x86_64-gnu-tools/browser-ui-test.version index 9cf038687f117..bae256fd5b38a 100644 --- a/src/ci/docker/host-x86_64/x86_64-gnu-tools/browser-ui-test.version +++ b/src/ci/docker/host-x86_64/x86_64-gnu-tools/browser-ui-test.version @@ -1 +1 @@ -0.9.6 \ No newline at end of file +0.9.7 \ No newline at end of file From 72f6322f8a50288a4bf96c9b20935f666a889621 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Wed, 29 Jun 2022 23:21:26 +0200 Subject: [PATCH 6/7] Fix scroll when source sidebar is open on mobile --- src/librustdoc/html/static/js/source-script.js | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/src/librustdoc/html/static/js/source-script.js b/src/librustdoc/html/static/js/source-script.js index 290c29d3141a2..acb1d8d7b5c8d 100644 --- a/src/librustdoc/html/static/js/source-script.js +++ b/src/librustdoc/html/static/js/source-script.js @@ -10,6 +10,7 @@ (function() { const rootPath = document.getElementById("rustdoc-vars").attributes["data-root-path"].value; +let oldScrollPosition = 0; function createDirEntry(elem, parent, fullPath, hasFoundFile) { const name = document.createElement("div"); @@ -65,10 +66,24 @@ function createDirEntry(elem, parent, fullPath, hasFoundFile) { function toggleSidebar() { const child = this.children[0]; if (child.innerText === ">") { + if (window.innerWidth < 701) { + // This is to keep the scroll position on mobile. + oldScrollPosition = window.scrollY; + document.body.style.position = "fixed"; + document.body.style.top = `-${oldScrollPosition}px`; + } addClass(document.documentElement, "source-sidebar-expanded"); child.innerText = "<"; updateLocalStorage("source-sidebar-show", "true"); } else { + if (window.innerWidth < 701) { + // This is to keep the scroll position on mobile. + document.body.style.position = ""; + document.body.style.top = ""; + // The scroll position is lost when resetting the style, hence why we store it in + // `oldScroll`. + window.scrollTo(0, oldScrollPosition); + } removeClass(document.documentElement, "source-sidebar-expanded"); child.innerText = ">"; updateLocalStorage("source-sidebar-show", "false"); From 9a1f52d7fd78f3dc26b49d4490e4e8004f590fc3 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Wed, 29 Jun 2022 23:21:46 +0200 Subject: [PATCH 7/7] Add test to ensure that scroll position is kept when opening/closing source sidebar --- .../rustdoc-gui/sidebar-source-code-display.goml | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/test/rustdoc-gui/sidebar-source-code-display.goml b/src/test/rustdoc-gui/sidebar-source-code-display.goml index 0474a8638db20..c441f84a82135 100644 --- a/src/test/rustdoc-gui/sidebar-source-code-display.goml +++ b/src/test/rustdoc-gui/sidebar-source-code-display.goml @@ -138,3 +138,17 @@ assert-css: ( "border-bottom-width": "1px", }, ) + +// We now check that the scroll position is kept when opening the sidebar. +click: "#sidebar-toggle" +wait-for-css: (".sidebar", {"width": "0px"}) +// We scroll to line 117 to change the scroll position. +scroll-to: '//*[@id="117"]' +assert-window-property: {"pageYOffset": "2519"} +// Expanding the sidebar... +click: "#sidebar-toggle" +wait-for-css: (".sidebar", {"width": "500px"}) +click: "#sidebar-toggle" +wait-for-css: (".sidebar", {"width": "0px"}) +// The "scrollTop" property should be the same. +assert-window-property: {"pageYOffset": "2519"}