WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Firefox Accessible Way To Inspect Individual Elements?

for

From: Mallory
Date: Dec 18, 2017 4:51AM

I haven't found an accessible way to inspect non-focusable elements with
keyboard alone (with a screen reader you can move your virtual cursor
and do a right-click, but for plain-keyboard that's not possible). This
means if you're a non-SR-using keyboarder, you are stuck with finding
the nearest focusable to do the Inspect Element then you need to work
your way to the element you actually care about.

I'm not sure really what browsers could do for that, but it's one reason
I lug my mouse around with my laptop (clicks on the trackpad are
broken).

cheers,
Mallory

On Wed, Dec 13, 2017, at 05:11 PM, Birkir R. Gunnarsson wrote:
> Check out www.bats.fyi for my article on using Firebug.
> Two caveats:
> 1. Firebug has stopped working with the latest versions of Firefox, at
> least 57, maybe it is going to be retired altogether.
> 2. I forget to mention in the article that you have to check the
> "accessible mode" checkbox when you first configure Firebug. I'll have
> to add it at some point.
>
> You can actually simulate a right click on any element on the page, at
> least with Jaws, select "inspect with Firebug" from the right click
> menu, and then you lend on that element in the DOM tree in Firebug
> (sometimes you have to press tab a few times to get there).
>
> The other good news, Firefox's own "inspect element" is pretty
> accessible by now and also works from simulated right click (JawsKey
> and 9).
>
> A note on the Jaws DisplayAdvancedElementInfo script, I find it
> useful, though it only shows you the element and its ancestor elements
> up to the root.
> On laptops you have to configure the keyboard shortcut for it by going
> opening the Jaws keyboard manager (JawsKey f2), making sure all
> scripts are displayed (I think you change the filter under options),
> then you locate the "DisplayAdvancedElementInfo" script and press
> alt-a to assign a keyboard shortcut to it.
>
>
>
> On 12/13/17, Jonathan Avila < <EMAIL REMOVED> > wrote:
> >> The subject says it. I want to sometimes look at the code for individual
> >> elements. It takes a long time to view source and see an element I'm
> >> interested in. Is there an accessible way to do this?
> >
> > In JAWS you can press JAWSkey+shift+f1 to see the tag and attributes under
> > the virtual cursor.
> >
> > In browsers with dev tools -- for elements in forms mode you may be able to
> > press the applications key then inspect element and the current element will
> > show up in the developer tools. You can then move focus to the developer
> > toolbar and your focus should be on that element in the tree.
> >
> > Jonathan
> >
> > Jonathan Avila
> > Chief Accessibility Officer
> > Level Access, inc. (formerly SSB BART Group, inc.)
> > (703) 637-8957
> > <EMAIL REMOVED>
> > Visit us online: Website | Twitter | Facebook | LinkedIn | Blog
> > Looking to boost your accessibility knowledge? Check out our free webinars!
> >
> > The information contained in this transmission may be attorney privileged
> > and/or confidential information intended for the use of the individual or
> > entity named above. If the reader of this message is not the intended
> > recipient, you are hereby notified that any use, dissemination, distribution
> > or copying of this communication is strictly prohibited.
> >
> >