[Inventory] Tags can't be removed when too many columns are displayed

[mkllnk]

Description

The inventory table has several columns which are optional. When you enable several columns, the Tags column can become too small and the delete button of tags is hidden. It's not obvious how to remove tags in this scenario.

There are two workarounds:

1. Hide columns until the delete buttons appear.
2. Add another tag which recalculates the size of the tags field. The delete buttons are then visible and you can delete the new tag and whichever other tag you wanted to remove.

Expected Behavior

Tags can always be removed from inventory items.

Actual Behavior

The delete button may be hidden.

Steps to Reproduce

1. Go to the Inventory /admin/inventory.
2. Select an enterprise.
3. Add products if its empty.
4. Add tags to a product and save.
5. Reload the page and select the enterprise again.
6. Click on "COLUMNS" and select "Enable Stock Reset?", "Inherit?" and "Tags".
7. Observe the tags and their "x" delete button.

Animated Gif/Screenshot

Good view:

Bad view:

Context

I'm working on #2469 (using Chrome as test browser) and one feature spec can't click the remove button, because it's not visible.

Severity

s4: It affects only a few users, but they may get stuck and think that it doesn't work at all.

Possible Fix

[filipefurtad0]

While testing #6789 and going through spec/features/admin/variant_overrides_spec.rb I noticed the reference to this issue. This might be resolved now, since the introduction #6070 .

I ran this spec after commenting out line 303, and it passes - the columns are now broad enough on a regular 1600 x 816 browser window. However, it fails again though if the window width is reduced to half a screen (800 px).

Maybe it is possible to define a minimal width, for the Tags column? Is this feasible? ping @jibees

I think that could close this issue, and then, line 303 could be removed from the spec.

[jibees]

Yeah, I agree we should find a decent solution (like min-width or maybe enlarge tag to its real size on mouse hover or truncate the text and always display the cross or mixture of all that). Maybe @Erioldoesdesign has a better idea? Anyway thanks for pointing me that out @filipefurtad0 !

[RachL]

@filipefurtad0 @jibees I want to flag that this problem has a workaround (display less columns) and is on a page that will completely disappear with network. Let's maybe find bigger fishes? :)

I would even close this bug, as we are not offering support for half screen on the admin side...

[Erioldoesdesign]

display less columns is a solution that not many users will know unless they ask for customer support or on comms.

If this does get a fix then I would suggest clicking anywhere on a tag shows an overlaid 'x' and a click will remove the tag.