From 97472d0313cd00c2b6ad943117e7679398b124cd Mon Sep 17 00:00:00 2001 From: Darric Heng Date: Mon, 22 Jun 2026 11:06:48 +0800 Subject: [PATCH 1/3] break long words to prevent horizontal scroll --- crates/bin/docs_rs_web/templates/style/style.scss | 2 ++ 1 file changed, 2 insertions(+) diff --git a/crates/bin/docs_rs_web/templates/style/style.scss b/crates/bin/docs_rs_web/templates/style/style.scss index 2f07b1c9f..036de8b82 100644 --- a/crates/bin/docs_rs_web/templates/style/style.scss +++ b/crates/bin/docs_rs_web/templates/style/style.scss @@ -378,12 +378,14 @@ div.recent-releases-container { .description { font-family: $font-family-serif; font-weight: normal; + overflow-wrap: break-word; @media #{$media-sm} { font-size: 1em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; + overflow-wrap: normal; } } From 63fcfce4727a515de01bcbf403b9f38ffaed9b54 Mon Sep 17 00:00:00 2001 From: Darric Heng Date: Mon, 29 Jun 2026 22:24:48 +0800 Subject: [PATCH 2/3] init long crate description gui test --- gui-tests/long-crate-description.goml | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) create mode 100644 gui-tests/long-crate-description.goml diff --git a/gui-tests/long-crate-description.goml b/gui-tests/long-crate-description.goml new file mode 100644 index 000000000..a1622e5d5 --- /dev/null +++ b/gui-tests/long-crate-description.goml @@ -0,0 +1,18 @@ +// Checks that a crate description with a very long sequence of characters doesn't result in a horizontal scroll bar + +go-to: |DOC_PATH| + "/releases/search?query=sysinfo" + +store-value: (description_selector, "div.recent-releases-container .description") + +set-text: (|description_selector|, "SOME/VERYVERY/LONG/SEQUENCE/OF/TEXT/SEPARATED/BY/SLASHES\nAnotherveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryverylongWord") + +// Set width to size smaller than media-sm as that's when we don't truncate the text +store-value(screen_width, 567) +set-window-size(|screen_width|, 800) + +store-property: (|description_selector|, {"scrollWidth": description_width}) + +// Check that the description width isn't wider than the screen. +// It should be smaller due to padding, but if it overflows it'll be wider than the screen anyway. +assert-false: |description_width| > |screen_width| + From 169cc5de0217dea05db79c52b89830a5206fe07f Mon Sep 17 00:00:00 2001 From: Darric Heng Date: Tue, 30 Jun 2026 22:20:24 +0800 Subject: [PATCH 3/3] fix test syntax --- gui-tests/long-crate-description.goml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/gui-tests/long-crate-description.goml b/gui-tests/long-crate-description.goml index a1622e5d5..2cfb0fee1 100644 --- a/gui-tests/long-crate-description.goml +++ b/gui-tests/long-crate-description.goml @@ -7,8 +7,8 @@ store-value: (description_selector, "div.recent-releases-container .description" set-text: (|description_selector|, "SOME/VERYVERY/LONG/SEQUENCE/OF/TEXT/SEPARATED/BY/SLASHES\nAnotherveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryverylongWord") // Set width to size smaller than media-sm as that's when we don't truncate the text -store-value(screen_width, 567) -set-window-size(|screen_width|, 800) +store-value: (screen_width, 567) +set-window-size: (|screen_width|, 800) store-property: (|description_selector|, {"scrollWidth": description_width})