tor-browser

commit 4d6bf34db5c6e983eae0fbb4dfc6ff980c7e814e
parent a6f762132a528b4e94e2765b1570ded2e7169455
Author: Dão Gottwald <dao@mozilla.com>
Date:   Fri,  9 Jan 2026 16:52:44 +0000

Bug 2007190 - Add revert button to the search bar. r=mbeier,urlbar-reviewers

Differential Revision: https://phabricator.services.mozilla.com/D278406

Diffstat:
M
browser/base/content/navigator-toolbox.inc.xhtml
 | 
9
+++++----
M
browser/components/urlbar/content/UrlbarInput.mjs
 | 
6
+++++-
M
browser/themes/shared/urlbar-searchbar.css
 | 
11
++++++-----

3 files changed, 16 insertions(+), 10 deletions(-)
diff --git a/browser/base/content/navigator-toolbox.inc.xhtml b/browser/base/content/navigator-toolbox.inc.xhtml
@@ -339,11 +339,12 @@
                       data-l10n-id="urlbar-search-mode-indicator-close"/>
           </html:div>
 
-          <hbox class="urlbar-revert-button-container" urlbar-slot="revert-button">
+          <hbox id="urlbar-revert-button-container" urlbar-slot="revert-button">
             <toolbartabstop/>
-            <image class="urlbar-icon urlbar-revert-button"
-                    role="button"
-                    data-l10n-id="urlbar-revert-button"/>
+            <image id="urlbar-revert-button"
+                   class="urlbar-icon urlbar-revert-button"
+                   role="button"
+                   data-l10n-id="urlbar-revert-button"/>
           </hbox>
 
           <hbox id="page-action-buttons" context="pageActionContextMenu" align="center" urlbar-slot="page-actions">
diff --git a/browser/components/urlbar/content/UrlbarInput.mjs b/browser/components/urlbar/content/UrlbarInput.mjs
@@ -301,6 +301,10 @@ export class UrlbarInput extends HTMLElement {
     this.inputField = /** @type {HTMLInputElement} */ (
       this.querySelector(".urlbar-input")
     );
+    if (this.#sapName == "searchbar") {
+      // This adds a native clear button.
+      this.inputField.setAttribute("type", "search");
+    }
     this._inputContainer = this.querySelector(".urlbar-input-container");
 
     this.controller = new lazy.UrlbarController({ input: this });
@@ -3003,7 +3007,7 @@ export class UrlbarInput extends HTMLElement {
    * @param {object} [options] Options for setting.
    * @param {boolean} [options.allowTrim] Whether the value can be trimmed.
    * @param {string} [options.untrimmedValue] Override for this._untrimmedValue.
-   * @param {boolean} [options.valueIsTyped] Override for this.valueIsTypede.
+   * @param {boolean} [options.valueIsTyped] Override for this.valueIsTyped.
    * @param {string} [options.actionType] Value for the `actiontype` attribute.
    *
    * @returns {string} The set value.
diff --git a/browser/themes/shared/urlbar-searchbar.css b/browser/themes/shared/urlbar-searchbar.css
@@ -51,8 +51,9 @@ toolbar[inactive="true"] .urlbar,
 .urlbar-input-container[pageproxystate="invalid"] > #page-action-buttons > .urlbar-page-action,
 #identity-box.chromeUI ~ #page-action-buttons > .urlbar-page-action:not(#star-button-box, #split-view-button),
 #urlbar[usertyping] > .urlbar-input-container > #page-action-buttons > #urlbar-zoom-button,
-.urlbar:is(:not([usertyping]), :not([focused])) > .urlbar-input-container > .urlbar-go-button,
-.urlbar-revert-button-container {
+.urlbar:not([usertyping]) > .urlbar-input-container > .urlbar-go-button,
+.urlbar:not(#searchbar-new, [focused]) > .urlbar-input-container > .urlbar-go-button,
+#urlbar-revert-button-container {
   display: none;
 }
 
@@ -848,7 +849,7 @@ toolbar[inactive="true"] .urlbar,
 
 /* Persisted Search revert button */
 
-.urlbar-revert-button {
+#urlbar-revert-button {
   list-style-image: url(chrome://global/skin/icons/defaultFavicon.svg);
   fill: var(--toolbarbutton-icon-fill-attention);
 
@@ -857,8 +858,8 @@ toolbar[inactive="true"] .urlbar,
   }
 }
 
-.urlbar[persistsearchterms] > .urlbar-input-container {
-  > .urlbar-revert-button-container {
+#urlbar[persistsearchterms] > .urlbar-input-container {
+  > #urlbar-revert-button-container {
     display: inherit;
   }