[wp-trac] [WordPress Trac] #60808: Twenty Twenty-Four: Black outline around the Navigation block submenu-expanding button

[WordPress Trac]

#60808: Twenty Twenty-Four: Black outline around the Navigation block submenu-
expanding button
-------------------------------------------------+-------------------------
 Reporter:  jordesign                            |       Owner:  (none)
     Type:  defect (bug)                         |      Status:  new
 Priority:  normal                               |   Milestone:  6.5.1
Component:  Bundled Theme                        |     Version:  trunk
 Severity:  normal                               |  Resolution:
 Keywords:  2nd-opinion has-patch needs-testing  |     Focuses:
                                                 |  accessibility
-------------------------------------------------+-------------------------

Comment (by wildworks):

 `60808.diff` appears to work as expected for me.

 > However, `:focus-visible` does not add the outline in situations such as
 clicking the submenu toggle button or opening the context menu ("right-
 click").

 WCAG describes it as "**When the keyboard focus indicator is visible, an
 area of the focus indicator meets all the following**". In other words, it
 seems like a proper focus outline should only be visible when using the
 keyboard, and not a requirement when using the mouse.

 However, I think it's basically a good thing that the focus is displayed
 even when using the mouse, so if anyone knows of a good approach, I'd like
 to hear your ideas.

 Another thing I noticed about this issue is that when I click on the
 summary element in the Details block, an unnatural outline appears. This
 is due to the fact that `overflow: hidden;` is applied to the block.
 However, this may be a problem that should be fixed separately on the
 Details block side.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/60808#comment:9>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform