We do need to file that with accessibility since it’s been an outstanding bug Jonathan.
> On Jan 30, 2018, at 7:10 PM, Jonathan Cohn <jon.c.c...@gmail.com> wrote: > > Hey folks do you think we should push Apple Accessibility on this? This has > to do with Popup boxes where multiple items can be selected. I haven't tried > out this specific widget but Brian writes these widgets using HTML5+ARIA so > that there are W3C standards backing his models. > > > Best wishes, > > Jonathan Cohn > > > >> Begin forwarded message: >> >> From: Bryan Garaventa <bryan.garave...@levelaccess.com >> <mailto:bryan.garave...@levelaccess.com>> >> Subject: Re: [WebAIM] Examples of comboboxes supporting multiple selected >> options >> Date: January 30, 2018 at 8:43:24 PM EST >> To: WebAIM Discussion List <webaim-fo...@list.webaim.org >> <mailto:webaim-fo...@list.webaim.org>> >> Reply-To: WebAIM Discussion List <webaim-fo...@list.webaim.org >> <mailto:webaim-fo...@list.webaim.org>> >> >> Hi, >> Actually you are encountering a bug in Safari >> https://bugs.webkit.org/show_bug.cgi?id=167680 >> <https://bugs.webkit.org/show_bug.cgi?id=167680> >> This has been a bug in Safari for years, it would be nice if Apple would >> finally get around to fixing it. I remember first mentioning this to them >> back in 2012. >> >> In regard to Chrome, Chrome is not a browser that is best supported in >> combination with mainstream screen readers, especially in regard to complex >> interactive ARIA widget constructs. >> >> The following is an editable version of the same functionality, which is >> more applicable to your email analogy. >> http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Multiselect%20Editable%20with%20Substring%20Match)/demo.htm >> >> <http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Multiselect%20Editable%20with%20Substring%20Match)/demo.htm> >> >> >> The following steps were tested using JAWS2018 and NVDA in IE11, Firefox, >> and Chrome Canary, and aside from issues where NVDA is not announcing live >> regions properly nor the correct selected state in IE11, nor is JAWS >> announcing live regions properly in Chrome, all of them are functionally >> accessible regardless. >> >> 1. Open the test page above with JAWS or NVDA running in either IE11, >> Firefox, or Chrome Canary. >> >> 2. Set focus into the editable Combobox, and type "hu". >> >> 3. After the autopopulated list appears, press the Down arrow to enter the >> dropdown list, then press Up and Down to move within the filtered results >> and press the Spacebar to check the desired options. >> >> 4. Press Enter to save your selections, then type "sci" in the edit field to >> bring up a new list of search results. >> >> 5. Press Down to enter the dropdown and move up and down within the list and >> press the Spacebar to check your desired authors, then press the Tab key to >> save your selections and move to the next element in the tab order, which is >> the Clear button. >> >> You can see your selections within a list below the buttons. When using JAWS >> in Chrome, it may be necessary to press Insert+Escape to refresh the virtual >> buffer because it is not updating properly when dynamic content changes >> occur at times, which is a JAWS bug. >> >> >> Bryan Garaventa >> Accessibility Fellow >> Level Access, Inc. >> bryan.garave...@levelaccess.com <mailto:bryan.garave...@levelaccess.com> >> 415.624.2709 (o) >> www.LevelAccess.com >> >> -----Original Message----- >> From: WebAIM-Forum [mailto:webaim-forum-boun...@list.webaim.org] On Behalf >> Of Sean Curtis >> Sent: Tuesday, January 30, 2018 4:32 PM >> To: WebAIM Discussion List <webaim-fo...@list.webaim.org> >> Subject: Re: [WebAIM] Examples of comboboxes supporting multiple selected >> options >> >> Hi Bryan, >> >> I tried the whatsock version out in both Chrome and Safari using Voiceover, >> but while the component communicated open state, moving through suggestions >> and selecting them did not work. Is this due to poor support by VO, the >> browsers, or a combination of both? >> >> I tried >> http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Multiselect%20Editable%20with%20Substring%20Match)/demo.htm >> as well but ran into the same issue. The example you linked to does list the >> selected values on the page, but these can't be cleared out without >> searching for them in the list first. >> >> The combobox style most commonly used is like the "Contributors (async)" >> example on https://jedwatson.github.io/react-select/ >> >> Cheers, >> >> Sean >> >> On Wed, Jan 31, 2018 at 10:55 AM, Bryan Garaventa < >> bryan.garave...@levelaccess.com> wrote: >> >>> Hi, >>> This implementation combines the ARIA Combobox design pattern plus the >>> checkable ARIA Listbox patterns to accomplish this accessibly. >>> http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA% >>> 20Comboboxes%20(Simulated,%20Readonly%20Multiselect)/demo.htm >>> >>> This is included within the TSG Combobox section at >>> http://whatsock.com/tsg/#tgl-2-22 >>> And within the Coding Arena archive at https://github.com/accdc/tsg >>> >>> Best wishes, >>> Bryan >>> >>> >>> Bryan Garaventa >>> Accessibility Fellow >>> Level Access, Inc. >>> bryan.garave...@levelaccess.com >>> 415.624.2709 (o) >>> www.LevelAccess.com >>> >>> -----Original Message----- >>> From: WebAIM-Forum [mailto:webaim-forum-boun...@list.webaim.org] On >>> Behalf Of Sean Curtis >>> Sent: Tuesday, January 30, 2018 2:35 PM >>> To: WebAIM Discussion List <webaim-fo...@list.webaim.org> >>> Subject: [WebAIM] Examples of comboboxes supporting multiple selected >>> options >>> >>> I've found many examples of accessible autocompletes, some >>> single-choice combobox components, but I've yet to find one that >>> handles multiple selected options. I'm trying to work out the best >>> pattern for interacting with selected values. Often they appear as a >>> bunch of lozenges beside the input field, with little "X" buttons to >>> clear the values. This is a pattern used often in address fields when >>> composing an email. >>> >>> I've looked at the one used by Gmail, and iCloud mail, but while they >>> do highlight a selected option visually when hitting left/right with >>> the keyboard, that selection is not announced to a screen reader. >>> >>> Ideally they wouldn't be a focusable element as it'd make tabbing >>> through a form exhausting. Is using left/right (and >>> aria-activedescendant) to highlight currently selected values, and >>> up/down to open and navigate additional, as-yet-unselected options a decent >>> compromise? >>> >>> Are there any good examples around that I've just missed? >>> >>> Cheers, >>> >>> Sean >>> _______________________________________________ >>> To manage your subscription, visit http://list.webaim.org/ List >>> archives at http://webaim.org/discussion/archives >>> Address list messages to webaim-fo...@list.webaim.org >>> _______________________________________________ >>> To manage your subscription, visit http://list.webaim.org/ List >>> archives at http://webaim.org/discussion/archives >>> Address list messages to webaim-fo...@list.webaim.org >>> >> _______________________________________________ >> To manage your subscription, visit http://list.webaim.org/ List archives at >> http://webaim.org/discussion/archives >> Address list messages to webaim-fo...@list.webaim.org >> _______________________________________________ >> To manage your subscription, visit http://list.webaim.org/ >> List archives at http://webaim.org/discussion/archives >> Address list messages to webaim-fo...@list.webaim.org > > > -- > The following information is important for all members of the Mac Visionaries > list. > > If you have any questions or concerns about the running of this list, or if > you feel that a member's post is inappropriate, please contact the owners or > moderators directly rather than posting on the list itself. > > Your Mac Visionaries list moderator is Mark Taylor. You can reach mark at: > macvisionaries+modera...@googlegroups.com and your owner is Cara Quinn - you > can reach Cara at caraqu...@caraquinn.com > > The archives for this list can be searched at: > http://www.mail-archive.com/macvisionaries@googlegroups.com/ > <http://www.mail-archive.com/macvisionaries@googlegroups.com/> > --- > You received this message because you are subscribed to the Google Groups > "MacVisionaries" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to macvisionaries+unsubscr...@googlegroups.com > <mailto:macvisionaries+unsubscr...@googlegroups.com>. > To post to this group, send email to macvisionaries@googlegroups.com > <mailto:macvisionaries@googlegroups.com>. > Visit this group at https://groups.google.com/group/macvisionaries > <https://groups.google.com/group/macvisionaries>. > For more options, visit https://groups.google.com/d/optout > <https://groups.google.com/d/optout>. -- The following information is important for all members of the Mac Visionaries list. If you have any questions or concerns about the running of this list, or if you feel that a member's post is inappropriate, please contact the owners or moderators directly rather than posting on the list itself. Your Mac Visionaries list moderator is Mark Taylor. You can reach mark at: macvisionaries+modera...@googlegroups.com and your owner is Cara Quinn - you can reach Cara at caraqu...@caraquinn.com The archives for this list can be searched at: http://www.mail-archive.com/macvisionaries@googlegroups.com/ --- You received this message because you are subscribed to the Google Groups "MacVisionaries" group. To unsubscribe from this group and stop receiving emails from it, send an email to macvisionaries+unsubscr...@googlegroups.com. To post to this group, send email to macvisionaries@googlegroups.com. Visit this group at https://groups.google.com/group/macvisionaries. For more options, visit https://groups.google.com/d/optout.