Too many times I see Javascript authors fall into the trap of browser sniffing.
Feature detection is known to be a much better practice when it comes to creating robust scripts for general web.
Hopefully, this collection can serve as a repository of most common (non-trivial) feature tests.
Most of the tests require no presence of document.body and so can be run at any time.
Otherwise, a note about document.body requirement is mentioned in test description.
All of the tests assume the presence of global document property. Everything else is tested before it's being used.
For CSS support detection see getStyleProperty and tests.
For event support detection, see isEventSupported and tests.
Tested browsers: Interner Explorer 5.5 - 8, Firefox 1.5.0.12 - 3.5, Opera 7.54 - 10.10, Safari 2.0 - 4.0.4, Mobile Safari 3.2, Chrome 0.4.154.29 - 3.0.192.0, Camino 1.6.6 - 1.6.8, Konqueror 4.2.2, BlackBerry 9000 (Bold), 9530 (Storm)
Found an error or have a suggestion? Please, tell me about it
Source and history are available on GitHub
| Name | Value | Affected Browsers | Info |
Test code Show all / |
|---|---|---|---|---|
| IS_ELEMENT_TAGNAME_UPPERCASED | - |
element.tagName on MDC
|
show | |
| ARRAY_PROTOTYPE_SLICE_CAN_CONVERT_NODELIST_TO_ARRAY | non-IE | show | ||
| WINDOW_EVAL_EVALUATES_IN_GLOBAL_SCOPE | Firefox, Safari 3.2.1, Opera | Test whether window.eval evaluates string in global scope |
show | |
| IS_EVENT_METAKEY_PRESENT | show | |||
| IS_EVENT_RELATEDTARGET_PRESENT | MouseEvent::relatedTarget | show | ||
| IS_EVENT_PREVENTDEFAULT_PRESENT | non-IE | Test whether DOM L2 Event::preventDefault method is present on event object | show | |
| IS_EVENT_SRCELEMENT_PRESENT | IE, Opera, Chrome, Safari 2+ | Test whether Event::srcElement is present on event object | show | |
| IS_NATIVE_HAS_ATTRIBUTE_PRESENT | - | Check for actual presence of Element::hasAttribute. The test should return proper result even if method was defined/removed by 3rd party scripts | show | |
| IS_POSITION_FIXED_SUPPORTED | - |
Check if position:fixed; is supported. Requires presence of document.body
|
show | |
| IS_CONTEXTMENU_EVENT_SUPPORTED | All except Opera <=10.a and Konqueror (4.2.2) | Check if "contextmenu" event is supported. | show | |
| COMPUTED_STYLE_RETURNS_VALUES_FOR_STATICLY_POSITIONED_ELEMENTS | Opera 8.54+ | Computed style returns actual values for statically positioned elements, instead of 'auto' | show | |
| IS_RGBA_SUPPORTED | FF3+, Safari 3+ | Check whether RGBA is supported | show | |
| IS_CSS_BORDER_RADIUS_SUPPORTED | WebKit-, Gecko- and KHTML- (newer) based | Check whether CSS3 border-radius property is supported (or any of vendor proprietary extensions - "-moz-border-radius", "-webkit-border-radius", "-khtml-border-radius") | show | |
| IS_CSS_TRANSFORMATION_SUPPORTED | Chrome, Firefox 3.1+ | CSSTransforms specs | show | |
| IS_CANVAS_SUPPORTED | Most of non-IE, Opera 9.x+ | Is HTML5 canvas element supported? | show | |
| ELEMENT_CHILDREN_RETURNS_ELEMENT_NODES | Safari 2.x is buggy; IE returns comment nodes; Firefox <3.5 doesn't support `children` at all |
Is Element::children supported? If so, does it return element nodes only?
|
show | |
| IS_CSS_ENABLED |
Checks whether CSS is enabled. Requires presence of document.body. Note that certain "!important" declarations might cause this test to produce false positives.
|
show | ||
| IS_ACTIVEX_ENABLED | Checks if ActiveX controls are enabled (if available) | show | ||
| IS_QUIRKS_MODE | Checks if browser is in quirks mode. Based on technique by Google doctype. | show | ||
| IS_STRICT_MODE_SUPPORTED | Checks if ES5 strict mode is supported. | show | ||
| IS_MATCHESSELECTOR_SUPPORTED | Firefox 3.6+; WebKit (r48723+) | Checks if Element::matchesSelector is supported. | show |
| Name | Value | Affected Browsers | Info | Test code |
|---|---|---|---|---|
| GETELEMENTSBYTAGNAME_RETURNS_COMMENT_NODES | IE | Test whether getElementsByTagName returns comments nodes |
show | |
| IS_REGEXP_WHITESPACE_CHARACTER_CLASS_BUGGY | IE, Safari, Konqueror 4.2.2 |
Test whether /\s/ matches whitespace characters (\t,\v,\f, etc. including unicode ones).
See 15.10.2.12 and
whitespace deviations article.
|
show | |
| IS_STRING_PROTOTYPE_SPLIT_REGEXP_BUGGY | IE, Konqueror 4.2.2 |
Test whether String.prototype.split works with regexp capturing groups properly
|
show | |
| SETATTRIBUTE_IGNORES_NAME_ATTRIBUTE | IE <=7 |
name attribute can not be changed at runtime in IE, see
article on MSDN
|
show | |
| ELEMENT_PROPERTIES_ARE_ATTRIBUTES | IE | show | ||
| QUERY_SELECTOR_IGNORES_CAPITALIZED_VALUES | WebKit bug #19047 | show | ||
| STRING_PROTOTYPE_REPLACE_IGNORES_FUNCTIONS | Safari <=2.0.2 | WebKit bug #3294 | show | |
| ARRAY_PROTOTYPE_CONCAT_ARGUMENTS_BUGGY | Opera <9.5 | show | ||
| PROPERTIES_SHADOWING_DONTENUM_ARE_ENUMERABLE | IE | See JScript DontEnum bug description on MDC | show | |
| PRE_ELEMENTS_IGNORE_NEWLINES | IE<=7, Opera 8.54+ | show | ||
| SELECT_ELEMENT_INNERHTML_BUGGY | IE | Bug description on MSDN | show | |
| TABLE_ELEMENT_INNERHTML_BUGGY | IE, Konqueror 4.2.2 | innerHTML article on MSDN | show | |
| SCRIPT_ELEMENT_REJECTS_TEXTNODE_APPENDING | IE | show | ||
| DOCUMENT_GETELEMENTBYID_CONFUSES_IDS_WITH_NAMES | IE <=7, Opera <9.5 | document.getElementById returns elements with corresponding name attributes |
show | |
| DOCUMENT_GETELEMENTBYID_IGNORES_CASE | IE <=7 | show | ||
| BUGGY_OFFSET_VALUES_FOR_STATIC_ELEMENTS_INSIDE_POSITIONED_ONES | IE <=7, Opera <8.54 | Requires presence of document.body |
show | |
| IS_XPATH_POSITION_FUNCTION_BUGGY | Safari 3+, Opera 9.64+ | show | ||
| IS_DOCUMENT_GETELEMENTSBYNAME_BUGGY | IE6+, Opera 8.54 (and possibly earlier) - 10a | Test whether document.getElementsByName returns elements with same-named ids. See MSDN article. |
show | |
| NAMED_FUNCTION_EXPRESSION_IDENTIFIER_LEAKS_ONTO_ENCLOSING_SCOPE | IE | show | ||
| ARGUMENTS_INSTANCEOF_ARRAY | Opera | Opera bug #326 (Unofficial) | show | |
| IS_OVERFLOW_STYLE_BUGGY | Konqueror 4.2.2 (possibly earlier too) |
Konqueror (at least 4.2.2) fails to change element's style.overflow if its value was set from within HTML.
|
show | |
| IS_CONTAINS_BUGGY | Safari 2.0 - 2.0.4 (possibly earlier too) |
In older Safari (non-standard) Element::contains returns true for any unrelated element, as long as that element is not an ancestor of tested one.
|
show | |
| IS_QUERY_SELECTOR_ALL_BUGGY | IE8 |
querySelectorAll fails to match param element contained within object one
|
show |