1514352 - Add "hidden focus" functionality to URLbar

Status: RESOLVED FIXED

(Firefox :: New Tab Page, enhancement, P2)

Description

[Kate Hudson :k88hudson]

In order to support a search hand-off feature in private browsing mode/from about:newtab, we would like to call a method that allows us to focus the awesomebar without making it appear visually focused.

This is similar to how Chrome implements search hand-off.

See Bug 1508388 for more details.

Comment 1

[Ed Lee :Mardak]

adw, I quickly prototyped this by just setting a "hide-focus" attribute in gURLBar.search (but we probably want a separate method or optional param on search). It seems to look okay, but the tricky part is when to remove the hide-focus attribute. r1cky has a activity-stream side jsm prototype calling urlbar.focus() and adding event listeners in order to tell the page to fade/hide the in-content search box when the user actually starts typing. There's probably existing oninput or other event to detect "success" but maybe trickier is what if the user never ends up typing, e.g., switch tab?

```diff
diff --git a/browser/base/content/urlbarBindings.xml b/browser/base/content/urlbarBindings.xml
--- a/browser/base/content/urlbarBindings.xml
+++ b/browser/base/content/urlbarBindings.xml
@@ -1681,6 +1681,7 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
           // and fire an input event to do that.  (If we set this.textValue we'd
           // get an input event for free, but it would also set mIgnoreInput,
           // skipping all of the above requirements.)
+          this.setAttribute("hide-focus", true);
           this.focus();
           this.value = value;
 
diff --git a/browser/themes/osx/browser.css b/browser/themes/osx/browser.css
--- a/browser/themes/osx/browser.css
+++ b/browser/themes/osx/browser.css
@@ -258,7 +258,7 @@ html|input.urlbar-input {
   line-height: 1.745em;
 }
 
-#urlbar[focused="true"],
+#urlbar[focused="true"]:not([hide-focus]),
 .searchbar-textbox[focused="true"] {
   box-shadow: 0 0 0 1px var(--toolbar-field-focus-border-color) inset,
               0 0 0 1px var(--toolbar-field-focus-border-color);
diff --git a/browser/themes/shared/urlbar-searchbar.inc.css b/browser/themes/shared/urlbar-searchbar.inc.css
--- a/browser/themes/shared/urlbar-searchbar.inc.css
+++ b/browser/themes/shared/urlbar-searchbar.inc.css
@@ -65,12 +65,12 @@
   background-color: var(--lwt-toolbar-field-background-color, white);
 }
 
-#urlbar[focused="true"],
+#urlbar[focused="true"]:not([hide-focus]),
 .searchbar-textbox[focused="true"] {
   border-color: var(--toolbar-field-focus-border-color);
 }
 
-#urlbar:-moz-lwtheme[focused="true"],
+#urlbar:not([hide-focus]):-moz-lwtheme[focused="true"],
 #navigator-toolbox .searchbar-textbox:-moz-lwtheme[focused="true"] {
   background-color: var(--lwt-toolbar-field-focus, var(--lwt-toolbar-field-background-color, white));
   color: var(--lwt-toolbar-field-focus-color, var(--lwt-toolbar-field-color, black));
```

Comment 2

[Ed Lee :Mardak]

Eh, maybe I should have looked at r1cky's code closer before commenting :P His prototype adds a blur listener to urlbar, and maybe that's general enough to capture any "abort" situations to clean up. Although adding event listeners to gURLBar from activity stream probably is redundant depending on what urlbarBindings already has.

Comment 3

[Drew Willcoxon :adw]

Blur does seem like what you want, if I understand correctly?  As long as the focus remains in the urlbar, hide the focus, and then when focus leaves, reset?  The urlbar has this "revert" concept too (handleRevert) that you can trigger by pressing Esc, but that's probably not interesting in this case since the focus remains in the input?  If you go that route, I'm not sure that modifying urlbarBindings is better than adding event listeners from activity stream, which seems OK to me.

Or, instead of actually focusing the input, maybe you could just fire input events at it as the user is typing?  i.e., eat the input events the user types in the in-content input and re-dispatch them to the urlbar input.  I don't know if that would actually work.  Or otherwise set the urlbar input value and open the popup without actually focusing it.  Although that would probably be a little weird from the user's POV since there probably wouldn't be a caret.

Comment 4

[Ricky Rosario [:rrosario, :r1cky]]

Attachment: Bug 1514352 - Add "hidden focus" functionality to URLbar

Adds hiddenFocus() and removeHiddenFocus() methods and some CSS selector tweaking to enable focusing without visible changes.

MozReview-Commit-ID: Dq66TET4AVR

Comment 5

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/4fcceeb6a1eb
Add "hidden focus" functionality to URLbar r=adw

Comment 6

[Arthur Iakab [arthur_iakab]]

https://hg.mozilla.org/mozilla-central/rev/4fcceeb6a1eb