mathieu/os-rust
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Rollup merge of #120526 - GuillaumeGomez:mobile-long-crate-name, r=notriddle

Browse source 
rustdoc: Correctly handle long crate names on mobile

Fixes https://github.com/rust-lang/rust/issues/120471.

It now renders like this:

![image](https://github.com/rust-lang/rust/assets/3050060/065b4b8b-ba55-4163-a928-8d7bf735c111)

r? `@notriddle`
This commit is contained in:
León Orell Valerian Liehr 2024-02-18 05:10:16 +01:00 • committed by GitHub
commit fb5982f14e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 26 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
src/librustdoc/html/static/css/rustdoc.css
View file

@ -1941,13 +1941,8 @@ in src-script.js and main.js
pixels to avoid overflowing the topbar when the user sets a bigger
font size. */
font-size: 24px;
}
.mobile-topbar h2 a {
display: block;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.mobile-topbar .logo-container > img {

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

@ -45,7 +45,7 @@ function setMobileTopbar() {
const mobileTitle = document.createElement("h2");
mobileTitle.className = "location";
if (hasClass(document.querySelector(".rustdoc"), "crate")) {
mobileTitle.innerText = `Crate ${window.currentCrate}`;
mobileTitle.innerHTML = `Crate <a href="#">${window.currentCrate}</a>`;
} else if (locationTitle) {
mobileTitle.innerHTML = locationTitle.innerHTML;
}

22
tests/rustdoc-gui/mobile-crate-name.goml Normal file
View file

@ -0,0 +1,22 @@
// Checks that if the crate name is too long on mobile, it will not grow and overflow its parent
// (thanks to text overflow ellipsis).
go-to: "file://" + |DOC_PATH| + "/test_docs/index.html"
// First we change the title to make it big.
set-window-size: (350, 800)
// We ensure that the "format" of the title is the same as the one we'll use.
assert-text: (".mobile-topbar .location a", "test_docs")
// We store the height we know is correct.
store-property: (".mobile-topbar .location", {"offsetHeight": height})
// We change the crate name to something longer.
set-text: (".mobile-topbar .location a", "cargo_packager_resource_resolver")
// And we check that the size remained the same.
assert-property: (".mobile-topbar .location", {"offsetHeight": |height|})
// Now we check if it works for the non-crate pages as well.
go-to: "file://" + |DOC_PATH| + "/test_docs/struct.Foo.html"
// We store the height we know is correct.
store-property: (".mobile-topbar .location", {"offsetHeight": height})
set-text: (".mobile-topbar .location a", "Something_incredibly_long_because")
// And we check that the size remained the same.
assert-property: (".mobile-topbar .location", {"offsetHeight": |height|})

4
tests/rustdoc-gui/type-declation-overflow.goml
View file

@ -39,8 +39,8 @@ assert-property: ("pre.item-decl", {"scrollWidth": "950"})
set-window-size: (600, 600)
go-to: "file://" + |DOC_PATH| + "/lib2/too_long/struct.SuperIncrediblyLongLongLongLongLongLongLongGigaGigaGigaMegaLongLongLongStructName.html"
// It shouldn't have an overflow in the topbar either.
store-property: (".mobile-topbar h2", {"scrollWidth": scrollWidth})
assert-property: (".mobile-topbar h2", {"clientWidth": |scrollWidth|})
store-property: (".mobile-topbar", {"scrollWidth": scrollWidth})
assert-property: (".mobile-topbar", {"clientWidth": |scrollWidth|})
assert-css: (".mobile-topbar h2", {"overflow-x": "hidden"})
// Check wrapping for top main-heading h1 and out-of-band.