From 9104632c4f6a2b5380fc770a29ce368bba563b69 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Fri, 20 Sep 2024 16:02:16 +0200 Subject: [PATCH 1/4] Revert additional scraped examples height --- 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 38154dee3e287..01506b46af2ee 100644 --- a/src/librustdoc/html/static/css/rustdoc.css +++ b/src/librustdoc/html/static/css/rustdoc.css @@ -801,6 +801,9 @@ both the code example and the line numbers, so we need to remove the radius in t * and we include additional 10px for padding. */ max-height: calc(1.5em * 5 + 10px); } +.more-scraped-examples .scraped-example:not(.expanded) .example-wrap { + max-height: calc(1.5em * 10 + 10px); +} .rustdoc:not(.src) .scraped-example:not(.expanded) .src-line-numbers, .rustdoc:not(.src) .scraped-example:not(.expanded) .src-line-numbers > pre, From 660210c4af12ebcf9e76f897c2542339fe7ce110 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Fri, 20 Sep 2024 15:34:45 +0200 Subject: [PATCH 2/4] Add GUI test to check size of additional scraped examples --- tests/rustdoc-gui/scrape-examples-layout.goml | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/tests/rustdoc-gui/scrape-examples-layout.goml b/tests/rustdoc-gui/scrape-examples-layout.goml index 6bea352bce4bb..be14e202b37d0 100644 --- a/tests/rustdoc-gui/scrape-examples-layout.goml +++ b/tests/rustdoc-gui/scrape-examples-layout.goml @@ -37,6 +37,7 @@ assert-property: ( // The "title" should be located at the right bottom corner of the code example. store-position: (".scraped-example .example-wrap", {"x": x, "y": y}) +assert-size: (".scraped-example .example-wrap", {"height": 130}) store-size: (".scraped-example .example-wrap", {"width": width, "height": height}) store-size: (".scraped-example .scraped-example-title", { "width": title_width, @@ -47,6 +48,13 @@ assert-position: (".scraped-example .scraped-example-title", { "y": |y| + |height| - |title_height| - 8, }) +store-size: (".more-scraped-examples .scraped-example .example-wrap", {"height": more_height}) +assert: |more_height| > |height| +assert-size: (".more-scraped-examples .scraped-example .example-wrap", { + "height": 250, + "width": |width|, +}) + // Check that the expand button works and also that line number aligns with code. move-cursor-to: ".scraped-example .rust" click: ".scraped-example .button-holder .expand" From 38bf2894feff81eb95c39319297e650b79d12b05 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Fri, 20 Sep 2024 15:20:39 +0200 Subject: [PATCH 3/4] Improve paddings for code blocks line numbers --- src/librustdoc/html/static/css/rustdoc.css | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css index 01506b46af2ee..04b0eba745090 100644 --- a/src/librustdoc/html/static/css/rustdoc.css +++ b/src/librustdoc/html/static/css/rustdoc.css @@ -831,10 +831,14 @@ both the code example and the line numbers, so we need to remove the radius in t -webkit-user-select: none; user-select: none; padding: 14px 8px; + padding-right: 2px; color: var(--src-line-numbers-span-color); } -.rustdoc .scraped-example .src-line-numbers { +.rustdoc .scraped-example .example-wrap .src-line-numbers { + padding: 0; +} +.rustdoc .src-line-numbers pre { padding: 14px 0; } .src-line-numbers a, .src-line-numbers span { @@ -893,7 +897,7 @@ both the code example and the line numbers, so we need to remove the radius in t } .docblock code, .docblock-short code, -pre, .rustdoc.src .example-wrap { +pre, .rustdoc.src .example-wrap, .example-wrap .src-line-numbers { background-color: var(--code-block-background-color); } From 55058b6c744a945aea03345bc26611693547a7e5 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Fri, 20 Sep 2024 15:59:50 +0200 Subject: [PATCH 4/4] Add GUI tests for line numbers padding --- .../docblock-code-block-line-number.goml | 63 ++++++++++++++++++- 1 file changed, 62 insertions(+), 1 deletion(-) diff --git a/tests/rustdoc-gui/docblock-code-block-line-number.goml b/tests/rustdoc-gui/docblock-code-block-line-number.goml index 03f8f80b10d4d..fed916ac24675 100644 --- a/tests/rustdoc-gui/docblock-code-block-line-number.goml +++ b/tests/rustdoc-gui/docblock-code-block-line-number.goml @@ -39,7 +39,10 @@ define-function: ( { "color": |color|, "margin": "0px", - "padding": "14px 8px", + "padding-top": "14px", + "padding-bottom": "14px", + "padding-left": "8px", + "padding-right": "2px", "text-align": "right", // There should not be a radius on the right of the line numbers. "border-top-left-radius": "6px", @@ -141,3 +144,61 @@ assert-css: ( }, ALL, ) + +// Checking line numbers on scraped code examples. +go-to: "file://" + |DOC_PATH| + "/scrape_examples/fn.test_many.html" + +define-function: ( + "check-padding", + [path, padding_bottom], + block { + assert-css: (|path| + " .src-line-numbers", { + "padding-top": "0px", + "padding-bottom": "0px", + "padding-left": "0px", + "padding-right": "0px", + }) + assert-css: (|path| + " .src-line-numbers > pre", { + "padding-top": "14px", + "padding-bottom": |padding_bottom|, + "padding-left": "0px", + "padding-right": "0px", + }) + assert-css: (|path| + " .src-line-numbers > pre > span", { + "padding-top": "0px", + "padding-bottom": "0px", + "padding-left": "8px", + "padding-right": "8px", + }) + }, +) + +call-function: ("check-padding", { + "path": ".scraped-example .example-wrap", + "padding_bottom": "0px", +}) + +move-cursor-to: ".scraped-example .example-wrap .rust" +wait-for: ".scraped-example .example-wrap .button-holder .expand" +click: ".scraped-example .example-wrap .button-holder .expand" +wait-for: ".scraped-example.expanded" + +call-function: ("check-padding", { + "path": ".scraped-example.expanded .example-wrap", + "padding_bottom": "14px", +}) + +// Now checking the line numbers in the source code page. +click: ".src" +assert-css: (".src-line-numbers", { + "padding-top": "20px", + "padding-bottom": "20px", + "padding-left": "4px", + "padding-right": "0px", +}) +assert-css: (".src-line-numbers > a", { + "padding-top": "0px", + "padding-bottom": "0px", + "padding-left": "8px", + "padding-right": "8px", +})