Opened 12 years ago

Closed 12 years ago

#8706 closed Bug (fixed)

JAWS not switching modes in CKEditor Cell dialog

Reported by: Satya Minnekanti Owned by: Garry Yao
Priority: Normal Milestone: CKEditor 3.6.3
Component: Accessibility Version: 3.0
Keywords: IBM Firefox Cc: Damian, Teresa Monahan

Description

To reproduce the defect:

  1. Open a CKEditor sample.
  1. Insert a new table.
  1. Open the Cell properties dialog using the context menu
  1. Navigate to a Choose button in the dialog and press Enter to open the Select Color dialog.
  1. Select Color dialog opens and JAWS reads the first color option. Inspect32 confirms that focus is on the first color in colors listbox.
  1. Use Right Arrow key.

Expected Result: JAWS should read the next color in the list. Actual Result: JAWS reading the Cancel button name.

There are two issues here

First Issue: JAWS doesn't switch to forms mode correctly to allow navigating the color picker list box with arrow keys.

Second Issue: Odd jump to the Cancel button bypassing the input field on the dialog.

Attachments (5)

8706.patch (7.3 KB) - added by Garry Yao 12 years ago.
8706.html (3.4 KB) - added by Garry Yao 12 years ago.
8706_2.patch (11.0 KB) - added by Garry Yao 12 years ago.
8706_3.patch (11.8 KB) - added by Garry Yao 12 years ago.
8706_4.patch (1.5 KB) - added by Garry Yao 12 years ago.

Download all attachments as: .zip

Change History (23)

comment:1 Changed 12 years ago by Jakub Ś

Status: newconfirmed
Version: 3.0

Colors haven't been read from CKEditor 3.0.

Focus on first color was introduced in CKEditro 3.3.

comment:2 Changed 12 years ago by Jakub Ś

Other tickets that fall under Select "Color Dialog Problems / Enchancements":
#8701, #8698, #8519, #8679, #8523, #8218, #5960, #4994.

comment:3 Changed 12 years ago by Damian

Response from FS:

The color picker control is currently implemented as a table with role="listbox". Under that table is a tbody element containing tr elements with each tr containing td elements. Finally, each td contains a link with role="option". There appear to be several issues with this control.

  1. According to the authoring guide http://www.w3.org/TR/wai-aria-practices/

in section 10, a list box is supposed to have list items as its children with no other elements in between.

  1. Probably as a result of point 1 above, Firefox does not apply the focusable

state to the table element with role="listbox" and JAWS does not identify this as a listbox control.

  1. Probably most importantly, this control acts like a grid. That is

left/right arrows move the user left and right along rows and up/down arrows move the user from row to row.

How to fix. There are a couple possibilities on the best way to fix this.

  1. Make the color picker a grid control with gridcells for the individual

table cells.

  1. modify the listbox so the direct descendants are list items.

Either of these solutions should let the control work correctly with JAWS

comment:4 Changed 12 years ago by Garry Yao

Status: confirmedpending

This issue WFM with JAWS13 in both IE and FF, can someone confirm it?

comment:5 Changed 12 years ago by Jakub Ś

Keywords: Firefox added
Status: pendingconfirmed

I was bale to reproduce it in Firefox 11, Chrome 17 on Windows XP and JAWS 13.0.718

Strange that it was not found when testing #8701

Changed 12 years ago by Garry Yao

Attachment: 8706.patch added

comment:6 Changed 12 years ago by Garry Yao

Owner: set to Garry Yao
Status: confirmedreview

I did some further testing, it's a random reproduced issue (for the key navigation part) while it's true that "listbox" is not well recognized here, the idea of making it as a "grid" looks like a better choice here, we had the "listbox" option before since at that time the navigation is one way only, later it was later changed to two dimension.

In testing JAWS doesn't work well for marking the "link" as the grid cell, so the impl has to drop the focus directly on a table cell for that, this should be enough to make JAWS speaks:

"Select Color Dialog, Color Options dialog, #660066..."

Changed 12 years ago by Garry Yao

Attachment: 8706.html added

comment:7 Changed 12 years ago by Garry Yao

Added a manual tc for easy testing.

Changed 12 years ago by Garry Yao

Attachment: 8706_2.patch added

comment:8 Changed 12 years ago by Garry Yao

New patch addresses the following found issues:

  1. JAWS on Firefox doesn't speaks out cell color (missing aria-label);
  2. JAWS doesn't always announce table name (caption helps);
  3. Restore last focused color cell on revisit;
  4. Distinguish outline (focus) and hover states;
  5. Fix focus/blur event on old IEs.
  6. Add "aria-selected" to color cell when choose.

comment:9 Changed 12 years ago by Frederico Caldeira Knabben

Milestone: CKEditor 3.6.3

comment:10 Changed 12 years ago by Frederico Caldeira Knabben

Component: GeneralAccessibility
Status: reviewreview_failed
  • There should be no cell highlighted when the dialog opens. That looks strange for non-keyboard users. Cells start to get highlighted as soon as the arrows get activated, having the first cell highlighted on first key-press (similar to toolbar combos).
  • There is a bit of confusion if you start moving the mouse over the cells, after having done it with keyboard. You see two highlight boxes, one for the keyboard and one for the mouse. We should not have it for the mouse, which should not interfere on the keyboard highlight, unless a mouse click takes place.
  • It is not possible to select a color with mouse click.

Changed 12 years ago by Garry Yao

Attachment: 8706_3.patch added

comment:11 Changed 12 years ago by Garry Yao

Status: review_failedreview

comment:12 Changed 12 years ago by Frederico Caldeira Knabben

Status: reviewreview_passed

comment:13 Changed 12 years ago by Garry Yao

Resolution: fixed
Status: review_passedclosed

Fixed with [7429].

comment:14 Changed 12 years ago by Satya Minnekanti

It's not properly fixed. Jaws just reading as Color Options table when we open Select Color dialog, & when user uses Arrow keys nothing happens,JAWS just reads as Blank or space. But after using arrow keys if you press Tab Focus going to a color in the table and user can use arrow keys after it.

Expected Result: when Select Color dialog opens focus should go to first color option in the table and JAWS should read that option, and user should be able to use arrow keys to navigate between different Colors.

Please re-open this ticket.

comment:15 Changed 12 years ago by Garry Yao

Resolution: fixed
Status: closedreopened

Changed 12 years ago by Garry Yao

Attachment: 8706_4.patch added

comment:16 Changed 12 years ago by Garry Yao

Status: reopenedreview

comment:17 Changed 12 years ago by Frederico Caldeira Knabben

Status: reviewreview_passed

comment:18 Changed 12 years ago by Garry Yao

Resolution: fixed
Status: review_passedclosed

Fixed with [7444].

Note: See TracTickets for help on using tickets.
© 2003 – 2022, CKSource sp. z o.o. sp.k. All rights reserved. | Terms of use | Privacy policy