Change 591517 had a related patch set uploaded (by Tchanders; owner: Tchanders):
[mediawiki/extensions/CheckUser@master] SpecialInvestigate: De-clutter buttons from results table cells

https://gerrit.wikimedia.org/r/591517

Just to clarify, this won't be able to look exactly like the screenshot until after the frameless toggle button is available (T249841). That should be added in a follow-up once it's ready.

Change 591517 merged by jenkins-bot:
[mediawiki/extensions/CheckUser@master] SpecialInvestigate: De-clutter buttons from results table cells

https://gerrit.wikimedia.org/r/591517

Testing mainly the Compare table on Firefox 68, IE11 and Safari 13, on testwiki (CheckUser 2.5 (284c6a2) 06:20, 12 May 2020).

• There should be no jump (height change) when the user hovers over a row

I haven't seen any jumping or changes in height, so far.

• Reduce clutter on table cells
• Tools and actions should be easily accessible

@Niharika The pin and the ellipsis menu do not appear on the mobile version of the site. I don't know if this will be a problem for T&S if they are trying to use it away from their desk. They can always use the desktop version of the site (slightly less conveniently).

I don't know to what extent we need to consider the accessibility of this feature. For example, you cannot tab to a pin or ellipsis unless it is currently visible.

• Following our UI standards

I did read https://design.wikimedia.org/style-guide/index.html and tried to relate it to this work. I don't think there are any great problems.

• Always leave space on the right for icons, even when they aren't visible. Lines should wrap leaving that space empty

This appears to be the case, even on a small viewport.

• The pin button is always visible, followed by the ellipsis icon (like Flow)

Should it always be visible? I don't think this is how we wanted it in T249252.

I note that if another row/column is pinned, hovering over the cell shows an empty space above the ellipsis (where the pin would normally be). I wonder if it would be more consistent with the UI standards to make it disabled rather than hidden. But I am sure we have already had this debate :)

For example:

• All other tools and options go inside the menu
• In the case of UAs the only option in the menu would be filter. This is not ideal.

At the moment, we don't have ellipsis for UAs, just the pin icon.

In T250051#6133633, @dom_walden wrote:

I don't know to what extent we need to consider the accessibility of this feature. For example, you cannot tab to a pin or ellipsis unless it is currently visible.

We should probably do a separate ticket to do a a11y and mobile review and then track all the findings.

• The pin button is always visible, followed by the ellipsis icon (like Flow)

Should it always be visible? I don't think this is how we wanted it in T249252.

No, it should only be visible when the cell is hovered on. And that is what I am seeing on test wiki at the moment and it seems right to me.

I note that if another row/column is pinned, hovering over the cell shows an empty space above the ellipsis (where the pin would normally be). I wonder if it would be more consistent with the UI standards to make it disabled rather than hidden. But I am sure we have already had this debate :)

For example:

We discussed this on Slack and decided to switch the order of the ellipsis and the pin icon. When the ellipsis icon is on top its position won't change because of the hidden pin icon. Should we raise a separate task for this?