Auto merge of #94320 - GuillaumeGomez:sidebar-display, r=jsha

Fix sidebar elements display

The bug can be seen more easily when the javascript is disabled:

![Screenshot from 2022-02-24 12-18-28](https://user-images.githubusercontent.com/3050060/155514578-cbefd3dd-f006-47e9-bc76-7c26d7e823e8.png)

r? `@jsha`

2 files changed, 25 insertions, 3 deletions

diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css
index 9a4b382a304..67adaa8702d 100644
--- a/src/librustdoc/html/static/css/rustdoc.css
+++ b/src/librustdoc/html/static/css/rustdoc.css
@@ -397,17 +397,17 @@ nav.sub {
 	overflow-y: hidden;
 }
 
-.source .sidebar > *:not(:first-child) {
-	transition: opacity 0.5s;
+.source .sidebar > *:not(#sidebar-toggle) {
 	opacity: 0;
 	visibility: hidden;
+	transition: opacity 0.5s;
 }
 
 .source .sidebar.expanded {
 	overflow-y: auto;
 }
 
-.source .sidebar.expanded > * {
+.source .sidebar.expanded > *:not(#sidebar-toggle) {
 	opacity: 1;
 	visibility: visible;
 }
diff --git a/src/test/rustdoc-gui/sidebar-source-code-display.goml b/src/test/rustdoc-gui/sidebar-source-code-display.goml
new file mode 100644
index 00000000000..27229705a9f
--- /dev/null
+++ b/src/test/rustdoc-gui/sidebar-source-code-display.goml
@@ -0,0 +1,22 @@
+// This test ensures that the elements in the sidebar are displayed correctly.
+javascript: false
+goto: file://|DOC_PATH|/src/test_docs/lib.rs.html
+// Since the javascript is disabled, there shouldn't be a toggle.
+assert-false: "#sidebar-toggle"
+// For some reason, we need to wait a bit here because it seems like the transition on opacity
+// is being applied whereas it can't be reproduced in a browser...
+wait-for: 500
+assert-css: (".sidebar > *", {"visibility": "hidden", "opacity": 0})
+
+// Let's retry with javascript enabled.
+javascript: true
+reload:
+wait-for: "#sidebar-toggle"
+assert-css: ("#sidebar-toggle", {"visibility": "visible", "opacity": 1})
+assert-css: (".sidebar > *:not(#sidebar-toggle)", {"visibility": "hidden", "opacity": 0})
+// Let's expand the sidebar now.
+click: "#sidebar-toggle"
+// Because of the transition CSS, better wait a second before checking.
+wait-for: 1000
+assert-css: ("#sidebar-toggle", {"visibility": "visible", "opacity": 1})
+assert-css: (".sidebar > *:not(#sidebar-toggle)", {"visibility": "visible", "opacity": 1})