959143 - Search Results Overlay is Jerky

Status: VERIFIED FIXED

(Firefox for Metro Graveyard :: General, defect, P2)

Description

[Stephen Horlander [:shorlander]]

Saw this with a mouse and keyboard setup, I didn't try with the OSK.

STR:

1) Start typing in location bar
2) Max results generally show up first at max size i.e. 8 result tiles and 4 search tiles
3) Refine search; results re-flow to fewer tiles with and smaller height
4) Re-flow happens suddenly with no transition and is visually jarring

This is a pretty jarring experience. More so if you overtype and start deleting because then it jumps back up.

Comment 1

[Sam Foster [:sfoster] (he/him)]

Not exactly sure what I/we can do here but I'll take a look and try out some ideas. Thoughts: 

* We can fix the columns so the suggestions and search providers grids don't jump around. We'll probably need a "no results" treatment in that case as it will leave the left side of the popup empty when there are no matches (currently the column collapses and the search tiles occupy that space)
* I would like to transition the height of the popup so it doesnt jump so abruptly, but I'm not sure without some digging how feasible that will be. 
* Frank had prototyped a nice effect for a build-in style transitioning in of the tiles. We punted on that because it implied making adding and removing tiles (richgriditems) an async procedure, which would wreak havoc in the short term. But I'll look again to see if there's anything we can salvage
* Fallback is to at least fade in the tiles, which should be doable. It may not help much with the jumpiness however..

Comment 2

[Sam Foster [:sfoster] (he/him)]

Update on this: The autocomplete grids are special as just about every dimension is variable, making animate from a-b difficult - its all determined by document flow and no useful animate-able values are ever set. I've tried a couple of different ways to pin it down but my current/next approach is this: 

Set an initial height on the container to accommodate 3 grid rows. Allow (hidden/clipped) overflow and animate to the actual height once rendered, eliminating the scroll offset. 

This may not make the aurora uplift cutoff, but I'm keeping it in my queue unless I'm told otherwise

Comment 3

[Sam Foster [:sfoster] (he/him)]

Attachment: fixed-height-autocomplete

Gives the autocomplete popup a fixed height, a couple layout tweaks and transition in of the popup. After much head to wall percussion, this seems to be stable and I think much improved visually. 

Had to tweak a couple of tests. I'm not sure exactly why/how the "selection enabled" and "caret browsing enabled" tests (browser_selection_urlbar.js) were impacted by this, but waiting for that transitionend gets them passing again. I'm pushing to try to confirm...

Comment 4

[Sam Foster [:sfoster] (he/him)]

Awaiting Try verdict: https://tbpl.mozilla.org/?tree=Try&rev=3325dc278dff

Comment 5

[Jim Mathies [:jimm]]

Comment on attachment 8367750 [details] [diff] [review]
fixed-height-autocomplete

Review of attachment 8367750 [details] [diff] [review]:
-----------------------------------------------------------------

This looks much better.

It seems our selection on the url bar is broken. Thought it might be this patch but I can't get it to work regardless. will file a follow up.

Comment 6

[Sam Foster [:sfoster] (he/him)]

On fx-team https://hg.mozilla.org/integration/fx-team/rev/9c108f2dacbb

Comment 7

[Carsten Book [:Tomcat]]

https://hg.mozilla.org/mozilla-central/rev/9c108f2dacbb

Comment 8

[Sam Foster [:sfoster] (he/him)]

Patch introduces async behavior where before there was none (animating the showing of the autocomplete popup), so recommending we let it bake on mozilla-central and target 29 for this.

Comment 9

[Manuela Muntean [Away]]

Verified as fixed for iteration #23, with latest Nightly on Win 8 64-bit: search results overlay is smooth.