The issue has been closed
- On this issue’s comment field
- Click the table-input button
- Click anywhere on the page
The dropdown should close, but it doesn't.
Modals like the "canned replies" automatically closes by design, without any JavaScript. table-input should be modified so it natively closes like the rest of the modals, it should probably never be explicitly closed via JS.
I may be wrong, but I remember it working as supposed to when the feature was first added. It was probably broken by GH updates. I'll take a look at it.
Seems like adding a tooltip on the button disrupts the modal functionality. The "canned replies" input also doesn't have a tooltip, so my guess is that GitHub doesn't implement this in the first place.
I tried a few things, including moving the tooltip to the <details> element itself, to no avail. Unless someone more familiar with the GitHub DOM has a solution, we'll just have to drop the tooltip. It's not perfect, but imo having a functioning modal is more important than having a tooltip.
Seems like adding a tooltip on the button disrupts the modal functionality
You're right, that's because both use :before.
It won't be accessible, but we can wrap the SVG in a div with the tooltip attribute. Better than nothing at all.
(For record, the tooltip is added in #3615)
So this is why the table-input button has somehow "awkward" focus, and only shows tooltip when hover the icon instead of the larger button.
The "canned replies" input also doesn't have a tooltip
Did you mean "Insert a reply"? It does have a tooltip now:
But it doesn't open a modal, you have to click the icon or press <kbd>Esc</kbd> to close it.
Just my random thoughts, doesn't necessarily mean I want a change.
button has somehow "awkward" focus
What are you referring to?
Anyway I noticed that our buttons don't handle the focus the same way:
It's a little hard to see but at first I press tab, where you see the focus going between the first and table-input. Then I move the focus with the arrows, which proceed to skip over table-input and the details button.
They probably need some DOM work to match the other buttons.
only shows tooltip when hover the icon instead of the larger button.
This is because the button has margins inside the summary. Like above, DOM work is welcome.
The "canned replies" input also doesn't have a tooltip
Did you mean "Insert a reply"? It does have a tooltip now:
Yes. You mention that and it made me notice that that button is not a modal either. Ew. I definitely prefer the modal over the tooltip.
IssueHunt