1.1.0 - Reality Strikes Back

March 18th 2016. We're continuing our journey to make accessibility simpler. Version 1.1.0 - the first major update - follows 4 months after making ally.js public in November 2015. In this time we've released 5 beta versions and pushed about 330 commits in an effort to increase browser support and fix the myriad of bugs typically encountered in version one of any software.

The highlights

• We got rid of those pesky console warnings triggered by the library's initial tests.
• We added full support for Internet Explorer 9 and made the library loadable but not executable in IE8 and NodeJS.
• While version 1.0.0 was targeting specific browsers, version 1.1.0 is targeting rendering engines and thereby adding support for blink based Opera and Yandex Browser, as well as WebKit based browsers.
• We've considerably increased compatibility with browser behavior in regard to what's "focusable". The test suite we used in version 1.0.0 was flawed in many ways. A complete rewrite of the browser tests and the subsequent overhaul of the what browsers consider focusable tables now paint a much more accurate picture of what's going on. And all of that is covered by ally.js, as the new tables differences between browsers and ally.js show.

Even though this is a "stability release" a few new features snuck in, most notably:

• The improved ally.when.key now supports modifier keys (shift, alt, control, meta) in a simple notation.
• With ally.maintain.tabFocus we can now trap TAB focus in the tabsequence.

The numbers

• ☻ We've increased test coverage from ~93% to ~99%
• ☹ The library grew from ~20KB to ~28KB gzipped (~80KB to ~126KB minified) - yes, we grew by 50%

A few numbers explaining the increased file size:

• ~20KB added for ever more tests and logic to identify what's focus-relevant/focusable/tabbable
• ~6KB added by sorting mechanisms for ally.query.tabsequence
• ~3KB added by domtokenlist
• ~3KB added for improved ShadowDOM support
• ~2KB added for improved keyboard event handling

The changes

The following lists show the changes to the library grouped by domain.

Browsers

• Adding full support for Internet Explorer 9 - issue #71
• Adding full support for Microsoft Edge 12, 13
• Adding full support for Opera 34 (Blink based, behaves like Chrome)
• Adding manual focusable tests for Safari 6 and 8 on OSX
• Dropping manual focusable tests for Safari on iOS 8, keeping Safari on iOS 9
• Dropping manual focusable tests for Mobile Chrome on Android 4.4, keeping Mobile Chrome on Android 5.1

Dependencies

• upgrading css.escape to version 1.5.0 to work around WebKit 149175
• upgrading platform.js to version 1.3.1
• adding domtokenlist-shim for IE9 DOM classList and SVG classList in IE11

Browser Behavior

• fixing ally.fix.pointerFocusChildren to use focus identity exceptions - issue #103
• fixing ally.fix.pointerFocusInput to properly target nested content of <button> and <label> elements

Focusable detection

• adding ally.get.focusRedirectTarget to identify elements focus is forwarded to
• adding ally.is.activeElement to identify if an element is the activeElement within its context
• adding option includeOnlyTabbable to ally.query.firstTabbable, ally.query.focusable, ally.query.tabbable, ally.query.tabsequence - issue #100
• changing ally.is.focusRelevant and ally.is.focusable to regard <keygen> and <embed> focus-relevant but not focusable - issue #82
• changing ally.is.validArea to properly handle <area href="…"> vs. <area> - issue #72
• changing ally.is.focusRelevant to properly handle <object type="application/x-shockwave-flash"> in IE9 - Issue #71
• refactoring ally.is.focusRelevant to identify all elements that are either focusable, tabbable, only-tabbable or redirect focus
• refactoring ally.query.tabsequence to extract util/merge-dom-order and util/sort-dom-order
• fixing ally.is.focusRelevant to identify Flexbox Layout in IE10 and IE11
• fixing ally.is.focusRelevant to consider Shadow DOM host elements
• fixing ally.is.focusRelevant to properly identify scrollable containers in Internet Explorer
• fixing ally.is.focusRelevant to consider all <area> elements focus relevant, moving the focusable to verification to ally.is.focusable
• fixing ally.is.focusRelevant to properly identify SVG links in IE9
• fixing ally.is.focusable, ally.is.tabbable and ally.is.onlyTabbable to consider the state of the hosting <iframe> or <object> element
• fixing ally.is.focusable to compensate Chrome being able to focus hidden <object> elements - Blink 586191
• fixing ally.is.tabbable to consider <iframe> elements not tabbable
• fixing ally.is.onlyTabbable to not consider <object> elements only tabbable anymore
• fixing ally.is.onlyTabbable to not require elements to satisfy ally.is.visible
• fixing ally.is.visible to consider the state of the hosting <iframe> or <object> element
• fixing ally.is.disabled to properly handle <form disabled> in IE9 - IE11
• fixing ally.get.focusTarget to resolve elements redirecting focus to other elements
• fixing ally.query.tabsequence to return <area> elements at the correct position - issue #5
• fixing ally.query.tabsequence to properly sort within Shadow DOM - issue #6

Keyboard support

• adding ally.maintain.tabFocus to trap TAB focus in the tabsequence - issue #63
• changing ally.when.key to handle modifier keys and respect context and filter options - issue #59
• changing ally.map.keycode to provide alphanumeric keys and aliasing

Various

• adding ally.query.shadowHosts to find elements hosting ShadowRoots - issue #110
• adding ally.observe.shadowMutations to register MutationObservers across nested ShadowRoots - issue #110
• fixing ally.maintain.disabled to properly handle tabindex attribute changes
• fixing ally.maintain.disabled to properly disengage within ShadowHosts - issue #107, PR #108
• fixing ally.maintain.disabled to properly observe within ShadowHosts - issue #110
• fixing ally.maintain.disabled to handle initially disabled elements - issue #123
• fixing ally.get.parents to resolve ancestry for SVGElement in Internet Explorer
• fixing ally.style.focusWithin to support SVG in IE10 and IE11

Internals

• adding ally/util/get-content-document to obtain the browsing context of <object> and <iframe> elements
• adding ally/util/get-frame-element to obtain the host element (<object> or <iframe>) of browsing context elements
• adding supports/focus-in-hidden-iframe to identify if content within a hidden iframe is focusable
• adding supports/focus-object-svg-hidden to identify if a hidden <object> element is focusable
• changing modules to be able to load in non-browser environments - issue #92
• changing user agent sniffing from detecting browser to rendering engine - issue #97
• refactoring is/is.util.js to extract image map related functions into utils/image-map
• refactoring is/focus-relevant and is/tabbable to allow running the identification with execptions via is/focus-relevant.rules and is/tabbable.rules, while maintaining module signature
• refactoring console.log() to go through util/logger
• refactoring selector/focusable to extract util/select-in-shadows
• fixing ally.is.* to work with other documents (e.g. iframes) - issue #78
• fixing supports/* to not raise network errors - issue #68
• fixing supports/* to run when required instead of on script load, restore scroll position - issue #60
• fixing supports/supports-cache to respect ally.js version change
• fixing supports/focus-label-tabindex in Chrome 49
• fixing ShadowDOM related unit tests in WebKit
• fixing SVGElement.prototype.focus to identify Microsoft Edge 13

Testing

Intern unit and functional tests have been run for the following browsers, covering 99% of the library's code:

• Internet Explorer 9, 10, 11
• Edge 13
• Safari 6.2, 7.1, 8, 9
• Chrome 47
• Firefox 42, 42 with ShadowDOM enabled

Sources

• renamed src/util/sort-elements-by-tabindex.js to src/query/tabsequence.sort-tabindex.js