Rollup merge of #113823 - GuillaumeGomez:fix-results-search-alias-display, r=notriddle

Fix results search alias display

Currently it's displayed like this:

![Screenshot from 2023-07-18 14-23-35](https://github.com/rust-lang/rust/assets/3050060/119d8f18-b298-4e6f-9571-9f678fc19126)

With this fix:

![Screenshot from 2023-07-18 14-23-29](https://github.com/rust-lang/rust/assets/3050060/679d6241-420e-4f13-be78-dc061cbc488a)

r? `@notriddle`

4 files changed, 18 insertions, 22 deletions

diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css
index 9209915895a..94e778406f8 100644
--- a/src/librustdoc/html/static/css/rustdoc.css
+++ b/src/librustdoc/html/static/css/rustdoc.css
@@ -888,7 +888,7 @@ so that we can apply CSS-filters to change the arrow color in themes */
 	justify-content: start;
 	flex: 3;
 }
-.search-results .result-name span.alias {
+.search-results .result-name .alias {
 	color: var(--search-results-alias-color);
 }
 .search-results .result-name .grey {
@@ -904,6 +904,9 @@ so that we can apply CSS-filters to change the arrow color in themes */
 	max-width: calc(100% - var(--search-typename-width));
 	display: inline-block;
 }
+.search-results .result-name .path > * {
+	display: inline;
+}
 
 .popover {
 	position: absolute;
diff --git a/src/librustdoc/html/static/js/search.js b/src/librustdoc/html/static/js/search.js
index 51d8e81ca86..42088e73554 100644
--- a/src/librustdoc/html/static/js/search.js
+++ b/src/librustdoc/html/static/js/search.js
@@ -2108,29 +2108,22 @@ function initSearch(rawSearchIndex) {
                 const resultName = document.createElement("div");
                 resultName.className = "result-name";
 
-                if (item.is_alias) {
-                    const alias = document.createElement("span");
-                    alias.className = "alias";
-
-                    const bold = document.createElement("b");
-                    bold.innerText = item.alias;
-                    alias.appendChild(bold);
-
-                    alias.insertAdjacentHTML(
-                        "beforeend",
-                        "<i class=\"grey\">&nbsp;- see&nbsp;</i>");
+                resultName.insertAdjacentHTML(
+                    "beforeend",
+                    `<span class="typename">${typeName}</span>`);
+                link.appendChild(resultName);
 
-                    resultName.appendChild(alias);
+                let alias = " ";
+                if (item.is_alias) {
+                    alias = ` <div class="alias">\
+<b>${item.alias}</b><i class="grey">&nbsp;- see&nbsp;</i>\
+</div>`;
                 }
-
                 resultName.insertAdjacentHTML(
                     "beforeend",
-                    `\
-<span class="typename">${typeName}</span>\
-<div class="path">\
- ${item.displayPath}<span class="${type}">${name}</span>\
+                    `<div class="path">${alias}\
+${item.displayPath}<span class="${type}">${name}</span>\
 </div>`);
-                link.appendChild(resultName);
 
                 const description = document.createElement("div");
                 description.className = "desc";
diff --git a/tests/rustdoc-gui/search-reexport.goml b/tests/rustdoc-gui/search-reexport.goml
index 6ea6d53e287..b9d2c8f15ce 100644
--- a/tests/rustdoc-gui/search-reexport.goml
+++ b/tests/rustdoc-gui/search-reexport.goml
@@ -26,7 +26,7 @@ write: (".search-input", "AliasForTheStdReexport")
 wait-for: "//a[@class='result-import']"
 assert-text: (
     "a.result-import .result-name",
-    "AliasForTheStdReexport - see re-export test_docs::TheStdReexport",
+    "re-export AliasForTheStdReexport - see test_docs::TheStdReexport",
 )
 // Same thing again, we click on it to ensure the background is once again set as expected.
 click: "//a[@class='result-import']"
diff --git a/tests/rustdoc-gui/search-result-color.goml b/tests/rustdoc-gui/search-result-color.goml
index 7a7785fd9ac..f9f81c5ba04 100644
--- a/tests/rustdoc-gui/search-result-color.goml
+++ b/tests/rustdoc-gui/search-result-color.goml
@@ -368,8 +368,8 @@ define-function: (
         // Waiting for the search results to appear...
         wait-for: "#search-tabs"
         // Checking that the colors for the alias element are the ones expected.
-        assert-css: (".result-name > .alias", {"color": |alias|})
-        assert-css: (".result-name > .alias > .grey", {"color": |grey|})
+        assert-css: (".result-name .path .alias", {"color": |alias|})
+        assert-css: (".result-name .path .alias > .grey", {"color": |grey|})
         // Leave the search results to prevent reloading with an already filled search input.
         press-key: "Escape"
     },