Wrong outline in dialog close button on Firefox

[flack]

The basic demo (https://jqueryui.com/dialog/) shows a focus outline like this on Firefox:

It seems to work fine in Chrome, haven't checked other browsers

[mgol]

Thanks for the report. Since the issue is already in 1.12, it's not likely to be fixed by the UI team; see the project status at https://blog.jqueryui.com/2021/10/jquery-maintainers-update-and-transition-jquery-ui-as-part-of-overall-modernization-efforts/.

[flack]

@mgol well, strictly speaking it was not an issue when 1.12 was released. It cropped up some time later, presumably due to some change in Firefox, so I was hoping that might fall under some "stay compatible with actual browsers" category

[mgol]

@flack Team's resources are very scarce nowadays. I had a quick look but the button dimensions are fine so I don't know why the outline is so large. If you manage to find a workaround, PRs are welcome. You can also report that as an issue to Firefox, maybe it's a bug they can fix.

[flack]

alright, I've opened a ticket on Bugzilla: https://bugzilla.mozilla.org/show_bug.cgi?id=1739894

It seems to have started in FF 78, i.e. last summer

[mgol]

Looks like it will get fixed by Firefox; it already looks fine in Nightly 96. Let's wait a bit whether it reaches production and then we'll be able to close it.

[mgol]

The Firefox fix has propagated to Firefox Developer Edition & Firefox Beta. It should react Firefox stable on 2022-01-11.

[mgol]

Firefox 96 with the fix has been released, nothing needs to be done on the jQuery UI side. Closing.