1593965 - Reconsider drag&drop indicators for tabs and the bookmarks toolbar

Status: RESOLVED FIXED

(Firefox :: Address Bar, task, P2)

Description

[Marco Bonardo [:mak]]

Try dragging a link or a bookmark between tabs or on the bookmarks toolbar.
The current indicators, on some platforms, cross the expanded urlbar.
On Windows for example the bookmarks toolbar indicator has a small arrow pointing down at the top, there's no reason for which it may not be an arrow pointing up at the bottom.
Similarly, the tabs indicator is an arrow pointing up below tabs, while it could be an arrow pointing down above tabs (Chrome is panting these arrows out of the window frame, not sure we can).

Something can surely be done to improve visibility of these indicators, apart from just touching z-index (that for the bookmarks toolbar case may not help much).

Comment 1

[Harry Twyford]

In the tab drag&drop case, the indicators look quite old and out of place in Photon/modern OS versions with the exception of the macOS indicator. Could UX possibly rework the Windows/Linux indicators to be more vertically-oriented like the macOS indicator? That would solve the issues with the focused megabar.

Comment 2

[Mike de Boer [:mikedeboer]]

Having them in SVG would be nice too!

Comment 3

[Harry Twyford]

For the sake of putting everything in this one bug, here are the bookmark toolbar indicators. They're also .pngs that might benefit from a more modern look.

Comment 4

[Marco Bonardo [:mak]]

Can we have someone from UX re-evalate these indicators?

Comment 5

[Harry Twyford]

Attachment: drag_regularmode.mp4

I took a screen capture of the behavior on Windows. Linux behaviour is similar. The problem is definitely not as bad as it used to be with the bigger megabar, but it still isn't great.
We've worked around the issue a little by setting the tab d&d arrow to appear above the megabar, but ideally we wouldn't have to do this since it definitely looks like a workaround. It'd be nicer if we had a more vertically-oriented indicator like we have on macOS.
The arrow in the bookmarks toolbar d&d icon is visible, but obscured by the shadow cast by the expanded megabar. For some reason the shadow doesn't appear in the screen capture.

Comment 6

[Harry Twyford]

Attachment: image.png

We're going to use the macOS-style drop indicator on all platforms. Bryan's prepared an SVG version and a similar-looking toolbar drop indicator as well.

Comment 7

[Harry Twyford]

Attachment: Bug 1593965 - Use new drag & drop indicators for tabs and the bookmarks toolbar. r?mak

Comment 8

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/81b1c17310c2
Use new drag & drop indicators for tabs and the bookmarks toolbar. r=mak,dao

Comment 9

[Pulsebot]

Backout by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/27a1fb60c286
Backed out changeset 81b1c17310c2 for causing failures in browser_startup_images.js CLOSED TREE

Comment 10

[Noemi Erli[:noemi_erli]]

Backed out changeset 81b1c17310c2 (Bug 1593965) for causing failures in browser_startup_images.js CLOSED TREE

Push with failures: https://treeherder.mozilla.org/#/jobs?repo=autoland&selectedJob=276407831&resultStatus=testfailed%2Cbusted%2Cexception&searchStr=mochitest&revision=81b1c17310c2e3060f5a6e92f0a5221514c5fa72

Failure log: https://treeherder.mozilla.org/logviewer.html#/jobs?job_id=276407831&repo=autoland&lineNumber=2272

Backout: https://hg.mozilla.org/integration/autoland/rev/27a1fb60c2863d29755521c69d6fceb1f2be18d7

Comment 11

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/4658f41dadee
Use new drag & drop indicators for tabs and the bookmarks toolbar. r=mak,dao

Comment 12

[Stefan Hindli [:stefan_hindli]]

https://hg.mozilla.org/mozilla-central/rev/4658f41dadee