1843318 - Secondary pane headings (Threads, Watch Expressions, etc.) are not marked as expanded

Status: RESOLVED FIXED

(DevTools :: Debugger, defect, P3)

Comment 1

[Nicolas Chevobbe [:nchevobbe]]

Attachment: Bug 1843318 - [devtools] Make Debugger secondary panes accordion accessible. r=ayeddi,#devtools-reviewers.

This adds a proper button element to toggle panels, with the appropriate aria-expanded
and aria-controls attributes.
The button directly includes that toggle arrow, as a background, and in order
to properly handle the color in CSS, we add a context-fill attribute to the SVG file.

Since button can handle keyboard activation by default, we don't have to carry
the onKeyDown listener that was on the h2 before.

Also, since the "header buttons" (e.g. add watch expression, remove breakpoints, …)
are not under the "accordion toggler" element anymore, we can remove all the
event.stopPropagation calls that we had to prevent toggling the panes when
interacting with those buttons.
That also mean that we need to properly expand the watch expression panel and
the xhr breakpoint panel when clicking on the "+" icon..

Comment 2

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/2fde555365f1
[devtools] Make Debugger secondary panes accordion accessible. r=devtools-reviewers,accessibility-frontend-reviewers,ayeddi,ochameau.

Comment 3

[Narcis Beleuzu [:NarcisB]]

https://hg.mozilla.org/mozilla-central/rev/2fde555365f1