[DevTools] Allow Firefox devtools to toggle the focus-visible pseudo-class

[chrisdavidmills]

Acceptance criteria

1. • The listed features are documented sufficiently on MDN
2. • BCD is updated - NA
3. • Interactive example and data repos are updated if appropriate - NA
4. • The content has been reviewed as needed

Features to document

1. Firefox-only — Allow devtools to toggle the focus-visible pseudo-class

Related Gecko bugs

1. • Allow devtools to toggle the focus-visible pseudo-class.

For folks helping with Firefox-related documentation features — make sure above AC have been done, but also:

• Set bugs to dev-doc-complete
• Add entry to Firefox release notes if feature is enabled in release
• Add entry to Firefox experimental features page if feature is not yet enabled in release

[hamishwillee]

Quick review

• This adds focus-visible checkbox as shown, which you can select to toggle that pseudo class on the element (in this case, the little box around the text). I guess useful to see how all your pseudo-class styles might work on a page
  
• Also option appears in the right-click menu over HTML
  

Anyway, the other values are already documented in https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_CSS#Viewing_common_pseudo-classes so this should just follow same pattern. Note it appears in a few sections - ie. also https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_HTML#Element_popup_context_menu and links from that.

[hamishwillee]

@chrisdavidmills This is now done in #1338

I have updated the bug with info about this here https://bugzilla.mozilla.org/show_bug.cgi?id=1617608#c8 - note though that I can't mark the docs as dev-doc-complete.

[chrisdavidmills]

Bug marked as dev-doc-omplete; thanks for the work on this @hamishwillee !