diff --git a/iron-focusables-helper.html b/iron-focusables-helper.html
index 79e5c16..31d46d3 100644
--- a/iron-focusables-helper.html
+++ b/iron-focusables-helper.html
@@ -14,6 +14,10 @@
(function() {
'use strict';
+ var p = Element.prototype;
+ var matches = p.matches || p.matchesSelector || p.mozMatchesSelector ||
+ p.msMatchesSelector || p.oMatchesSelector || p.webkitMatchesSelector;
+
Polymer.IronFocusablesHelper = {
/**
@@ -50,26 +54,25 @@
// Referring to these tests with tabbables in different browsers
// http://allyjs.io/data-tables/focusable.html
- var name = element.localName;
- // These elements cannot be focused if they have [disabled] attribute.
- if (/^(input|select|textarea|button|object)$/.test(name)) {
- return !element.disabled;
+ // Elements that cannot be focused if they have [disabled] attribute.
+ if (matches.call(element, 'input, select, textarea, button, object')) {
+ return matches.call(element, ':not([disabled])');
}
- // These elements can be focused even if they have [disabled] attribute.
- return name === 'iframe' ||
- (/^(a|area)$/.test(name) && element.hasAttribute('href')) ||
- element.hasAttribute('tabindex') ||
- element.hasAttribute('contenteditable');
+ // Elements that can be focused even if they have [disabled] attribute.
+ return matches.call(element,
+ 'a[href], area[href], iframe, [tabindex], [contentEditable]');
},
/**
- * Returns if a element is tabbable. To be tabbable, a element must be focusable
- * and visible.
+ * Returns if a element is tabbable. To be tabbable, a element must be
+ * focusable, visible, and with a tabindex !== -1.
* @param {!HTMLElement} element
* @return {boolean}
*/
isTabbable: function(element) {
- return this._normalizedTabIndex(element) >= 0 && this._isVisible(element);
+ return this.isFocusable(element) &&
+ matches.call(element, ':not([tabindex="-1"])') &&
+ this._isVisible(element);
},
/**