New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 865766 link

Starred by 2 users

Issue metadata

Status: Assigned
Owner:
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Chrome
Pri: 3
Type: Bug

Blocked on:
issue 830340
issue 840897



Sign in to add a comment

Omnibox MD Refresh - Touchable Master Bug

Project Member Reported by tommycli@chromium.org, Jul 19

Issue description

This bug is the 'master' bug that tracks all Omnibox MD Refresh Touchable issues.
 
Labels: OS-Chrome
Here is a pixel audit of the raised state on CrOS touchable omnibox. 

These screenshots are from today's Windows Canary, with the following flags enabled:
chrome://flags/#top-chrome-md (Touchable Refresh)
chrome://flags/#omnibox-ui-hide-steady-state-url-scheme-and-subdomains
chrome://flags/#simplify-https-indicator
Group 10.png
843 KB View Download
Blockedon: 830340
Another case to make sure we have the spacing right is with the keyword search (tab to search) button. Currently, there's more space than there should be to the right of the vertical bar/separator.
Ill revisit this once we make the final call on the omnibox divider/jog
Okay no problem -- just to log what we discussed yesterday for posterity:

I think there have already been a few changes since the above pixel audit, so ideally we have absolute measurements for us to meet.
Components: UI>Browser>Omnibox
Labels: -Pri-3 Proj-MdRefresh Pri-2
Labels: Group-Omnibox
Labels: -Pri-2 Pri-1
Hey Joel - Let me know how you want to proceed on adjusting the spacing on Touchable Refresh.

The jog behavior should soon be back in the next Canary for you folk to play with. It will enabled by default but toggle-able via chrome://flags/#omnibox-ui-jog-textfield-on-popup

Should be in Monday Canary.
Owner: tommycli@chromium.org
Assigning this to tommycli for driving this from the eng side and coordinating whatever changes are required.
Ok. So I did a full audit and the cause of the misalignment is the increased touch size and icon size (16 to 20) for the omnibox. 

TL;DR, we need to change:

Raised OB surface offset: Touchable in Canary = 6dp, needs to be 2dp
Suggestion icon margin: Touchable in Canary = 14dp, correct
Suggestion icon size: Touchable in Canary = 20dp, correct
Suggestion margin to domain: Touchable in Canary = 16dp, needs to be 20dp

Other notes:
1. In Canary touchable raised OB state, the input row has different margins than the suggestions. Those margins need to be the same as defined above.

2. In Canary touchable raised OB state, the input row height should be 48dp tall to match the toolbar height (if possible...know this is a known issue and platform specific)
865766.png
501 KB View Download
CL here: https://chromium-review.googlesource.com/c/chromium/src/+/1157562

I can't explain why, but I ended up having to use slightly different values to make everything line up.

Raised OB surface offset: I had to use 1dp.
Text indent from left edge of raised surface to text: I had to add 4dp for touchable instead of 2dp (as the mocks above suggest).

Do you mind auditing the screenshot I've attached? Let me know if anything seems wrong.

Screenshot from 2018-07-31 16-59-19.png
22.6 KB View Download
This LGTM! Thanks for making it work. I couldn't tell if it should be 1 or 2dp for the offset. Most of this is based on the inset of the resolved lock + URL state. We can always make these metrics make most sense in the next build.
Thanks Joel, I'll send this in and request a merge. We can keep iterating, but at least it doesn't look blatantly wrong now.
Project Member

Comment 16 by bugdroid1@chromium.org, Aug 1

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/f83d1138aea1028c8b0b572f8b3c47db3b023ef6

commit f83d1138aea1028c8b0b572f8b3c47db3b023ef6
Author: Tommy C. Li <tommycli@chromium.org>
Date: Wed Aug 01 19:12:56 2018

Omnibox Refresh UI: Touchable Refresh dimension tweaks.

Tweak the Touchable Refresh dimensions to make everything in the Omnibox
and Suggestions box line up.

Bug: 865766
Change-Id: Ibe9ec38e6b2c1c9d92e56ffff60cf32faa92c59c
Reviewed-on: https://chromium-review.googlesource.com/1157562
Reviewed-by: Justin Donnelly <jdonnelly@chromium.org>
Commit-Queue: Tommy Li <tommycli@chromium.org>
Cr-Commit-Position: refs/heads/master@{#579889}
[modify] https://crrev.com/f83d1138aea1028c8b0b572f8b3c47db3b023ef6/chrome/browser/ui/views/omnibox/omnibox_match_cell_view.cc
[modify] https://crrev.com/f83d1138aea1028c8b0b572f8b3c47db3b023ef6/chrome/browser/ui/views/omnibox/rounded_omnibox_results_frame.cc

Labels: Merge-Request-69
I can confirm that c#16 makes Touchable Refresh look a lot better on Canary. (tested on Windows).

Requesting a merge.
Project Member

Comment 18 by sheriffbot@chromium.org, Aug 2

Labels: -Merge-Request-69 Merge-Review-69 Hotlist-Merge-Review
This bug requires manual review: M69 has already been promoted to the beta branch, so this requires manual review
Please contact the milestone owner if you have questions.
Owners: amineer@(Android), kariahda@(iOS), cindyb@(ChromeOS), govind@(Desktop)

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
Re-pinging on the Merge Request.

The CL has been verified on Canary and is low techincal risk for a user-visible change for Touch Chromebooks.
Cc: cindyb@chromium.org
+cindyb@ (Chrome OS TPM) for M69 merge review
Labels: -Merge-Review-69 Merge-Approved-69
Merge approved M69.
Project Member

Comment 22 by bugdroid1@chromium.org, Aug 8

Labels: -merge-approved-69 merge-merged-3497
The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/fd247a11d2f53d587ee07932871893dc11480883

commit fd247a11d2f53d587ee07932871893dc11480883
Author: Tommy C. Li <tommycli@chromium.org>
Date: Wed Aug 08 17:01:46 2018

Omnibox Refresh UI: Touchable Refresh dimension tweaks.

Tweak the Touchable Refresh dimensions to make everything in the Omnibox
and Suggestions box line up.

Bug: 865766
Change-Id: Ibe9ec38e6b2c1c9d92e56ffff60cf32faa92c59c
Reviewed-on: https://chromium-review.googlesource.com/1157562
Reviewed-by: Justin Donnelly <jdonnelly@chromium.org>
Commit-Queue: Tommy Li <tommycli@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#579889}(cherry picked from commit f83d1138aea1028c8b0b572f8b3c47db3b023ef6)
Reviewed-on: https://chromium-review.googlesource.com/1167624
Reviewed-by: Tommy Li <tommycli@chromium.org>
Cr-Commit-Position: refs/branch-heads/3497@{#500}
Cr-Branched-From: 271eaf50594eb818c9295dc78d364aea18c82ea8-refs/heads/master@{#576753}
[modify] https://crrev.com/fd247a11d2f53d587ee07932871893dc11480883/chrome/browser/ui/views/omnibox/omnibox_match_cell_view.cc
[modify] https://crrev.com/fd247a11d2f53d587ee07932871893dc11480883/chrome/browser/ui/views/omnibox/rounded_omnibox_results_frame.cc

Cc: abdulsyed@chromium.org
+abdulsyed@ fyi, M69 merges taken for Proj-MdRefresh .
tommycli: fixed?
Labels: -Pri-1 Pri-3
Mostly. One remaining issue:

On Touchable with Jog Disabled, the Omnibox text is off by 1px.

I'm changing this to a P3
Labels: -Proj-MdRefresh Proj-DesktopUI
Labels: Hotlist-DesktopUITriaged

Sign in to add a comment