WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Help needed to integrate aXe webdriverjs into selenium

for

From: Mohith BP
Date: Nov 13, 2018 10:44PM

Hi Marcy Sutton,

Thank you for the response.
Will check out those resources and get connected in Gitter channel.

Thanks & Regards,
Mohith B. P.


On 11/14/18, Marcy Sutton < <EMAIL REMOVED> > wrote:
> Hi Mohith,
>
> The axe-webdriverjs library requires Node.js, as that is how it injects into
> the page. There is an open source axe Selenium Java project you could check
> out: https://github.com/dequelabs/axe-selenium-java
> <https://github.com/dequelabs/axe-selenium-java>
>
> Otherwise, the best place to get help with axe implementations is in our
> Gitter channel: https://gitter.im/dequelabs/axe-core
> <https://gitter.im/dequelabs/axe-core>
>
> Hope that helps!
>
> Marcy Sutton | Developer Advocate | 206-819-8408
> Deque Systems - Accessibility for Good
> deque.com <http://deque.com/>;
>
>> On Nov 13, 2018, at 11:00 AM, <EMAIL REMOVED> wrote:
>>
>> Send WebAIM-Forum mailing list submissions to
>> <EMAIL REMOVED>
>>
>> To subscribe or unsubscribe via the World Wide Web, visit
>> http://list.webaim.org/mailman/listinfo/webaim-forum
>> or, via email, send a message with subject or body 'help' to
>> <EMAIL REMOVED>
>>
>> You can reach the person managing the list at
>> <EMAIL REMOVED>
>>
>> When replying, please edit your Subject line so it is more specific
>> than "Re: Contents of WebAIM-Forum digest..."
>> Today's Topics:
>>
>> 1. Accessible table where some data spans multiple columns
>> (Jeremy Echols)
>> 2. Re: Accessible table where some data spans multiple columns
>> (Philippe Vayssi?re)
>> 3. Fwd: [community] Tenon-UI - a11y-oriented React component
>> library (Brandon Keith Biggs)
>> 4. Help needed to integrate aXe webdriverjs into selenium (Mohith BP)
>> 5. Re: Accessible table where some data spans multiple columns
>> (Birkir R. Gunnarsson)
>> 6. Re: Accessible table where some data spans multiple columns
>> (glen walker)
>> 7. Re: Accessible table where some data spans multiple columns
>> (Jeremy Echols)
>> 8. Re: Accessible table where some data spans multiple columns
>> (glen walker)
>> 9. Re: Accessible dragon drop component? ? some questions
>> (Bryan Garaventa)
>>
>> From: Jeremy Echols < <EMAIL REMOVED> >
>> Subject: [WebAIM] Accessible table where some data spans multiple columns
>> Date: November 12, 2018 at 12:24:07 PM PST
>> To: WebAIM Discussion List < <EMAIL REMOVED> >
>>
>>
>> I'm trying to figure out how to make a table read the headers properly
>> when a data cell spans multiple columns. We have a data table (gist URL
>> below) where we're describing fines for library resources, and some of the
>> fines are the same across multiple groups, so naturally we used "colspan"
>> to make it clear that the information pertains to multiple groups.
>> Unfortunately, when I tested this out with NVDA, it only read the first
>> pertinent header for the data. I'm not sure why this is happening, as the
>> markup looks correct to me.
>>
>> Any ideas what's going on? Is this an NVDA bug or am I missing something
>> obvious?
>>
>> Gist URL:
>> https://gist.github.com/jechols/8e1d447e98c9c40e24e114e80a5c5b7b#file-table-html
>>
>>
>>
>>
>> From: Philippe Vayssière < <EMAIL REMOVED> >
>> Subject: Re: [WebAIM] Accessible table where some data spans multiple
>> columns
>> Date: November 13, 2018 at 12:45:34 AM PST
>> To: <EMAIL REMOVED>
>>
>>
>> Hi,
>>
>> headers and cells should be associated via the id and headers attributes
>> mechanism (even better if you can simplify your table and not have colspan
>> and rowspan. If).
>> WCAG Techniques H43 and F90 are relevant here:
>>
>> * H43: Using id and headers attributes to associate data cells with header
>> cells in data tables <https://www.w3.org/WAI/GL/WCAG20-TECHS/H43.html>
>> * F90: Failure of Success Criterion 1.3.1 for incorrectly associating
>> table headers and content via the headers and id attributes <F90: Failure
>> of Success Criterion 1.3.1 for incorrectly associating table headers and
>> content via the headers and id attributes>
>>
>> This bookmarklet by Gez Lemon may help verifying the tedious – and prone
>> to error – work of adding headers:
>> <http://juicystudio.com/article/complextableinspector.php>;
>>
>>
>> Philippe
>>
>> Le 12/11/2018 à 21:24, Jeremy Echols a écrit :
>>> I'm trying to figure out how to make a table read the headers properly
>>> when a data cell spans multiple columns. We have a data table (gist URL
>>> below) where we're describing fines for library resources, and some of
>>> the fines are the same across multiple groups, so naturally we used
>>> "colspan" to make it clear that the information pertains to multiple
>>> groups. Unfortunately, when I tested this out with NVDA, it only read
>>> the first pertinent header for the data. I'm not sure why this is
>>> happening, as the markup looks correct to me.
>>>
>>> Any ideas what's going on? Is this an NVDA bug or am I missing something
>>> obvious?
>>>
>>> Gist URL:
>>> https://gist.github.com/jechols/8e1d447e98c9c40e24e114e80a5c5b7b#file-table-html
>>>
>>
>>
>>
>>
>>
>> From: Brandon Keith Biggs < <EMAIL REMOVED> >
>> Subject: [WebAIM] Fwd: [community] Tenon-UI - a11y-oriented React
>> component library
>> Date: November 13, 2018 at 2:28:51 AM PST
>> To: WebAIM Discussion List < <EMAIL REMOVED> >
>>
>>
>> Hello,
>> Just thought people would like to know about this new accessible framework
>> in React:
>> https://github.com/tenon-io/tenon-ui
>> Thanks,
>>
>> Brandon Keith Biggs <http://brandonkeithbiggs.com/>;
>>
>>
>> ---------- Forwarded message ---------
>> From: Harnum, Alan < <EMAIL REMOVED> >
>> Date: Mon, Nov 12, 2018 at 2:10 PM
>> Subject: [community] Tenon-UI - a11y-oriented React component library
>> To: <EMAIL REMOVED>
>> < <EMAIL REMOVED> >
>>
>>
>> Released in 1.0 as of today:
>>
>> Docs: https://tenon-ui.info/
>> GitHub repo: https://github.com/tenon-io/tenon-ui
>>
>> Released by the development team behind the https://tenon.io/
>> accessibility
>> testing tool.
>>
>> I haven't seriously used React in a few years but I know the mindshare and
>> adoption of it is, shall we say, significant in the web development world,
>> so this looks like an important effort.
>>
>> ALAN HARNUM
>> SENIOR INCLUSIVE DEVELOPER
>> INCLUSIVE DESIGN RESEARCH CENTRE, OCAD UNIVERSITY
>>
>> E <EMAIL REMOVED> <mailto: <EMAIL REMOVED> >
>> OCAD UNIVERSITY
>> 100 McCaul Street, Toronto, Canada, M5T 1W1
>> www.ocadu.ca<;http://ocadu.ca/>;
>>
>> >> Inclusive Design Community ( <EMAIL REMOVED> )
>> >> https://lists.idrc.ocadu.ca/mailman/listinfo/community
>>
>>
>>
>>
>> From: Mohith BP < <EMAIL REMOVED> >
>> Subject: [WebAIM] Help needed to integrate aXe webdriverjs into selenium
>> Date: November 13, 2018 at 3:00:56 AM PST
>> To: WebAIM Discussion List < <EMAIL REMOVED> >
>>
>>
>> Hi Folks,
>>
>> I am trying to integrate aXe webdriverjs into existing automation
>> framework. However I am hitting road blocks as the documentation
>> suggests to use node.js with jasmine.
>> As I have no experience with Node.JS.
>>
>> The current environment I am running is Eclipse and Selenium with
>> webdrivers for Chrome and Firefox.
>>
>> Would like to know the experience of integrating aXe webdriverjs into
>> existing automation framework.
>>
>> Thanks & Regards,
>> Mohith B. P.
>>
>>
>>
>>
>> From: "Birkir R. Gunnarsson" < <EMAIL REMOVED> >
>> Subject: Re: [WebAIM] Accessible table where some data spans multiple
>> columns
>> Date: November 13, 2018 at 6:43:29 AM PST
>> To: WebAIM Discussion List < <EMAIL REMOVED> >
>>
>>
>> Simple data tables do not need headers.
>>
>> The default behavior of data tables where regular table cells span
>> multiple columns however is to associate the first column header with
>> that cell (tested with NVDA and Jaws).
>> As already pointed out, you can force associating all the headers with
>> a cell using the headers attribute (assign a unique id to each header
>> and use the headers attribute on the cell to announce them).
>> That's probably your best best short of trying to reorganize the whole
>> table.
>>
>>
>>
>> On 11/13/18, Philippe Vayssière < <EMAIL REMOVED> > wrote:
>>> Hi,
>>>
>>> headers and cells should be associated via the id and headers attributes
>>> mechanism (even better if you can simplify your table and not have
>>> colspan and rowspan. If).
>>> WCAG Techniques H43 and F90 are relevant here:
>>>
>>> * H43: Using id and headers attributes to associate data cells with
>>> header cells in data tables
>>> <https://www.w3.org/WAI/GL/WCAG20-TECHS/H43.html>
>>> * F90: Failure of Success Criterion 1.3.1 for incorrectly associating
>>> table headers and content via the headers and id attributes <F90:
>>> Failure of Success Criterion 1.3.1 for incorrectly associating table
>>> headers and content via the headers and id attributes>
>>>
>>> This bookmarklet by Gez Lemon may help verifying the tedious – and prone
>>> to error – work of adding headers:
>>> <http://juicystudio.com/article/complextableinspector.php>;
>>>
>>>
>>> Philippe
>>>
>>> Le 12/11/2018 à 21:24, Jeremy Echols a écrit :
>>>> I'm trying to figure out how to make a table read the headers properly
>>>> when a data cell spans multiple columns. We have a data table (gist URL
>>>> below) where we're describing fines for library resources, and some of
>>>> the
>>>> fines are the same across multiple groups, so naturally we used
>>>> "colspan"
>>>> to make it clear that the information pertains to multiple groups.
>>>> Unfortunately, when I tested this out with NVDA, it only read the first
>>>> pertinent header for the data. I'm not sure why this is happening, as
>>>> the
>>>> markup looks correct to me.
>>>>
>>>> Any ideas what's going on? Is this an NVDA bug or am I missing
>>>> something
>>>> obvious?
>>>>
>>>> Gist URL:
>>>> https://gist.github.com/jechols/8e1d447e98c9c40e24e114e80a5c5b7b#file-table-html
>>>>
>>>
>>> >>> >>> >>> >>>
>>
>>
>> --
>> Work hard. Have fun. Make history.
>>
>>
>>
>>
>> From: glen walker < <EMAIL REMOVED> >
>> Subject: Re: [WebAIM] Accessible table where some data spans multiple
>> columns
>> Date: November 13, 2018 at 7:02:42 AM PST
>> To: WebAIM Discussion List < <EMAIL REMOVED> >
>>
>>
>> In general, as stated already, the <th scope=row/col> works great for
>> associating headers with data cells. The id/header attributes aren't
>> normally needed.
>>
>> And spanned row or column headers also works pretty well. But in your
>> case, none of your headers are spanned but rather the data cells are
>> spanned. One could argue that maybe the screen reader should figure out
>> that a data cell that's spanned has multiple headers, but in the meantime,
>> the headers attribute fixes the problem. I tried a quick test with JAWS
>> on
>> IE and NVDA on firefox and the following read multiple column headers.
>>
>> 1. Added an ID to each column header.
>> 2. Added a header attribute to two of the data cells (just to test those
>> two - I didn't update the entire table). It's only needed for the spanned
>> cells.
>>
>> However, visually, I find the table hard to scan because there is no
>> consistent cell shape. I can't read a column header and then scan down to
>> find the fee. So while spanned data cells might seem like a good idea in
>> this case to convey that all the different headers have the same charge,
>> I'm not sure that's conveyed very well.
>>
>>
>> <thead>
>> <tr>
>> <th scope="col" id="col1">Borrower type/Material type</th>
>> <th scope="col" id="col2">Faculty/Staff</th>
>> <th scope="col" id="col3">Grad Student or Honors Student</th>
>> <th scope="col" id="col4">Undergrad or Community Ed.</th>
>> <th scope="col" id="col5">Member, UO Alum Assoc.</th>
>> <th scope="col" id="col6">Oregon Card and NCU</th>
>> </tr>
>> </thead>
>>
>> ...
>> <tr>
>> <th scope="row">General Materials</th>
>> <td style="text-align: center;">No general fines<br>
>> $5/day recall fine (max=$20)</td>
>> <td colspan="4" style="text-align: center;" headers="col3 col4 col5
>> col5">$0.50/day (max=$20)</td>
>> </tr>
>> <tr>
>> <th scope="row">Summit Loans</th>
>> <td style="text-align: center;">$0.50/day (max=$20</td>
>> <td colspan="2" style="text-align: center;" headers="col3
>> col4">$0.50/day
>> (max=$20)</td>
>> <td style="text-align: center;">NA</td>
>> <td style="text-align: center;">NA</td>
>> </tr>
>>
>>
>>
>>
>> From: Jeremy Echols < <EMAIL REMOVED> >
>> Subject: Re: [WebAIM] Accessible table where some data spans multiple
>> columns
>> Date: November 13, 2018 at 7:25:55 AM PST
>> To: WebAIM Discussion List < <EMAIL REMOVED> >
>>
>>
>> Interesting. I knew about associating multiple headers, but didn't know
>> that was necessary just for colspans. I also didn't really see the table
>> as being confusing, but now that you point that out, it does indeed seem a
>> little difficult to navigate.
>>
>> Thanks for all the info everybody!
>>
>>