Compliance Chart

Note: I have only examined the compliance of the methods supported by picoQuery. This has has the effect that the summary is biased in favor of picoquery. However, it does show that the methods which are supported by picoQuery are significantly more compliant than the respective methods in Zepto and Cash

Compliance summary:

picoQuery 0.5.0
Zepto 1.2.0
Cash 1.3.0
 = Full compliance
 = Almost full compliance
 = Partial compliance
 = Not supported


picoQuery 0.5.0 Zepto 1.2.0 Cash 1.3.0
constructor Special jQuery selectors such as :odd are not supported jQuery( selector, context [ Array of elements ] ) does not get the order right. Does not strictly comply in a few edge cases Special jQuery selectors such as :odd are not supported jQuery( selector, context [ Element ] ) is buggy: It finds elements that are parent to the selection. Ie $​("body li", document.​getElementById​("item3")) returns unexpected matches. The bug is because with the querySelector method, the entire hierarchy counts. To fix this shortcoming, the library has to do something similar to this shim jQuery( selector, context [ jQuery ] ) does not remove duplicates, when there is a match in several contexts Array-like structures are not supported, ie jQuery( [HTMLCollection] ) and jQuery( [NodeList] ) jQuery( html, ownerDocument) is not supported - behaves as jQuery( html ) jQuery( html, attributes) does not support all instance methods. Actually zepto complies with jQuery 1.4-1.7, where only the following instance methods were supported: ('val', 'css', 'html', 'text', 'data', 'width', 'height', 'offset' and events). In jQuery 1.8, all instance methods are supported jQuery( selector, context [ Array of elements ] ) does not get the order right. Does not strictly comply in some edge cases Special jQuery selectors such as :odd are not supported jQuery( selector, context [ Element ] ) is buggy: It finds elements that are parent to the selection. Ie $​("body li", document.​getElementById​("item3")) returns unexpected matches. The bug is because with the querySelector method, the entire hierarchy counts. To fix this shortcoming, the library has to do something similar to this shim jQuery( selector, context [ jQuery ] ) is not supported. Doing gives various results. jQuery( html, ownerDocument) is not supported - behaves as jQuery( html ) jQuery( callback ) is buggy: Callback does not receive a reference to $ which can be used to write failsafe jQuery code jQuery( selector, context [ Element ] ) returns matches root element of context, though it should not. Ie $​("#item3", document.​getElementById​("item3"​)​) returns a match jQuery( html ) does not handle self-containing container-tags in HTML5, such as <div/>. These are actually invalid in HTML5, but jQuery uses them in several examples The elements have a parent, in jQuery they dont. Does not strictly comply in a few edge cases
.add() jQuery sorts in Document order. picoQuery does not sort jQuery sorts in Document order. Zepto 1.2.0 does not sort jQuery sorts in Document order. Cash 1.3.0 does not sort
.addBack() jQuery sorts in Document order. picoQuery does not sort
.addClass() Does not comply in some edge cases Does not comply in some edge cases .addClass( function ) signature is unsupported Does not comply in some edge cases
.after() .after( function ) signature is unsupported .after( function-html ) signature is unsupported .after( [Text] ) signature is unsupported. Ie you cannot do: $(el).after("some text") .after( content [,content] ) only supports one piece of content .after( function ) signature is unsupported .after( function-html ) signature is unsupported
.andSelf() jQuery sorts in Document order. picoQuery does not sort
.append() When a node is appended to multiple targets, the node is cloned behind the scenes. As the .clone() method doesnt support copying data and event listeners yet, these clones will erroursly not get these .append( function ) signature is unsupported weird result in the test "Is appended node detached from previous position in DOM?" When a node is appended to multiple targets, the node is cloned behind the scenes. As the .clone() method doesnt support copying data and event listeners, these clones will erroursly not get these .append( content [,content] ) only supports one piece of content .append( function ) signature is unsupported When a node is appended to multiple targets, the node is cloned behind the scenes. As the .clone() method doesnt support copying data and event listeners, these clones will erroursly not get these .append( [ Text Node ] ) signature is unsupported (and array of text nodes)
.appendTo() Does not support appending to multiple targets Does not support appending to multiple targets
.attr() Does not implement any attrHooks Most notably attrHook is the one dealing with a problem in IE<=11+, which is that an input loses its value after becoming a radio Does not comply in some edge cases Does not implement attrHooks Most notably attrHook is the one dealing with a problem in IE<=11+, which is that an input loses its value after becoming a radio Does not comply in an edge case .attr( attributeName, function ) signature is unsupported Does not support removing attributes with null Does not implement attrHooks Most notably attrHook is the one dealing with a problem in IE<=11+, which is that an input loses its value after becoming a radio Does not comply in some edge cases
.before() .before( function ) signature is unsupported .before( function-html ) signature is unsupported .before( [Text] ) signature is unsupported. Ie you cannot do: $(el).before("some text") .before( content [,content] ) only supports one piece of content .before( function ) signature is unsupported .before( function-html ) signature is unsupported
.children()
.click() See .on() and .trigger() See .on() and .trigger() See .on() and .trigger()
.clone() Does not copy data and events Does not copy data and events Does not copy data and events
.closest() .closest( selector, context ) is non-compliant or buggy. Its probably the non-compliance in the constructor that comes into play .closest( selector, context ) is non-compliant or buggy. Its probably the non-compliance in the constructor that comes into play .closest( selection ) is unsupported .closest( element ) is unsupported
.css() jQuery has quite a few "cssHooks" which handles certain css properties in specific ways. These are not supported (the hook that handles marginLeft is supported, though) Automatic using vendor prefixed version when available is not supported. When height or width is set to auto, picoQuery returns "0px", but should return the correctly calculated number of pixels Does not comply in a few edge cases Does not support getting property in camelCased form, unless it has been set with .css( property, value ) or inline style jQuery has quite a few "cssHooks" which handles certain css properties in specific ways. These are not supported. Setting a property to a unitless string generally has no effect in jQuery. But Zepto sets the property to empty string Does not support omitting "px" for widths etc. Ie. .css("width", "123") (but does support it, when type is number, ie .css("width", 123)) .css( propertyName, function ) is not supported cssText is buggy - first property is ignored when trying to set cssText Fails complying when a external style overrides style attribute with !important Sets width and height wrong, when given as a unitless string (as an exception to the general rule of ignoring unitless strings, jQuery allows to set width and height with unitless strings) Automatic using vendor prefixed version when available is not supported. When height, margin-left etc is set to "auto", Zepto returns "auto", but should return calculated pixels value. This error causes position() not to work on auto either (because it relies on css('margin-left') and css('margin-top') to return pixel values) Does not comply in a few edge cases Does not support getting or setting property in dasherized form. Only supports camelCased form. Ie $​("li​​)​.css​("font-style"​) does not work jQuery has quite a few "cssHooks" which handles certain css properties in specific ways. These are not supported. Does not support setting a numeral property like this: .css​("fontSize", 10​) .css( properties) signature is not supported. That is: does not support getting several properties in one call .css( propertyName, function ) is not supported .css( propertyNames [Array] ) signature is not supported. Sets width and height wrong, when given as a unitless string (as an exception to the general rule of ignoring unitless strings, jQuery allows to set width and height with unitless strings) Automatic using vendor prefixed version when available is not supported. When height is "auto", .css( "height" ) must return the height in pixels, not "auto" When margin-left is set to auto, Cash returns "0px" in some browsers (ie FF), but should return the number of pixels it is indented Does not comply in a few edge cases
.data() .data( key, value ) is not implemented. .data( object ) is not implemented either. So you can not set data, only read those set in "data-xxx" attributes .data( ) is not implemented Setting data changes the "data-xxx" attribute of the node. It should not Memory-leaking. Data is not deleted from nodes when .empty(), .remove(), .html() and .replaceWith() methods are called. .data( obj ) has no effect, when the element has data-attributes .data( ) is not implemented
.detach() .detach( selector ) does not support nested selectors. For example "* > b" does not match when performed on a "b" element .detach( selector ) signature is not supported (all elements are detachd) .detach( selector ) signature is not supported (all elements are detachd)
.each() Callback receives the two arguments in wrong order Does not support iterating normal arrays
.empty() Event listeners on the old HTML are not removed. It is concidered best practise to remove event listeners, but according to this article, it is not strictly required for modern browsers:
.end() $( selector ) does not add the document to the pushstack
.eq()
.filter() .filter( element ) signature is not supported .filter( elements [Array] ) signature is not supported .filter( selection ) signature is not supported .filter( function ) signature is buggy - the function does not receive the second argument .filter( element ) signature is not supported .filter( elements [Array] ) signature is not supported .filter( selection ) signature is not supported .filter( function ) signature is buggy: The callback receives the arguments in wrong order
.find() .find( selector ) signature is buggy: In some circumstances it returns duplicates .find( selector ) is buggy: It finds elements that are parent to the selection. Ie $​("#item3"​)​.find​("body li"​) can give a result. The bug is because with the querySelector method, the entire hierarchy counts. To fix this shortcoming, the library has to do something similar to this shim .find( selector [Array of Elements] ) does not support when selector is merely array-like (ie a HTMLCollection) .find( selector ) is buggy: It finds elements that are parent to the selection. Ie $​("#item3"​)​.find​("body li"​) can give a result. The bug is because with the querySelector method, the entire hierarchy counts. To fix this shortcoming, the library has to do something similar to this shim .find( selector [jQuery] ) is not supported .find( selector [Element] ) is not supported
.first() Does not work with ordinary arrays. Ie, $​([3,4]​)​.first​(​) does not return 3 Does not work with ordinary arrays. Ie, $​([3,4]​)​.first​(​) does not return 3
.focus() See .on() and .trigger() See .on() and .trigger() See .on() and .trigger()
.get()
.hasClass() HTML may not contain newline
.hide() Animation is not supported Does not store display value before setting it to "none", so .show() cannot restore it correctly. Ie. $(tempEl).css("display", "table-cell").hide().show().css("display") returns "block", but should return "table-cell" Animation is not supported
.html() Does not comply in an edge case html( function ) signature is not implemented Does not comply in an edge case Event listeners on the old HTML are not removed. It is concidered best practise to remove event listeners, but according to this article, it is not strictly required for modern browsers:
.insertAfter() .insertAfter( [ htmlString ] ) does not comply. But that signature hardly makes sense. .insertAfter( [ Array of elements ] ) signature is not supported .insertAfter( [ htmlString ] ) does not comply. But that signature hardly makes sense.
.insertBefore() .insertBefore( [ htmlString ] ) does not comply. But that signature hardly makes sense .insertBefore( [ Array of elements ] ) signature is not supported .insertBefore( [ htmlString ] ) does not comply. But that signature hardly makes sense
.keyup()
.last() Does not work with ordinary arrays. Ie, $​([3,4]​)​.last​(​) does not return 3 Does not work with ordinary arrays. Ie, $​([3,4]​)​.last​(​) does not return 3
.map() Very buggy. The function retrieves arguments (element, index) instead of (index, element). The 'this' does not point to the element, but to window
.next() Only works on one element (the rest is dropped) .next( selector ) is not supported, that is: no filtering
.offset() .offset( ) returns wrong coordinates .offset( coordinates ) sets wrong coordinates .offset( ) always uses current window, also for iframes etc .offset( ) in many cases returns wrong coordinates .offset( coordinates ) is not supported. So setting coordinates is not supported, only getting .offset( function ) is not supported .offset( ) always uses current window, also for iframes etc
.offsetParent() When no parents are positioned, the body element is returned, but jQuery returns the document element When element is hidden, the body element is returned, but jQuery returns the document element Does not skip table elements with position:static When no parents are positioned, the body element is returned, but jQuery returns the document element When element is hidden, an empty selection is returned, but jQuery returns the document element When no elements are in set, we get an error Does not handle operating on multiple elements
.on() Multiple events are NOT SUPPORTED - only one event name may be specified Event propagation may not be correct Custom events are not supported Namespaces such as "keydown.myPlugin" are not supported Has not been investigated. But it seems events are very well supported Has not been investigated
.parent() If you try to get the parent of a jQuery selection which hasnt been appended to document, you will get a containing div - in jQuery you get an empty selection .parent( selector ) signature is not supported - so no filtering parent of a document returns the documentElement, but in jQuery, it returns an empty selection If you try to get the parent of a jQuery selection which hasnt been appended to document, you will get a containing div - in jQuery you get an empty selection
.position() Does not get it right, when there is border Does not get it right, when position is fixed margin:auto fails in some browsers (it ie fails in FF 49, but not in Chromium 53) Does not get html node quite right (it must always return (0,0) margin:auto fails in some browsers (it ie fails in FF 49, but not in Chromium 53) Decimal precision is lost Coordinates are returned in opposite order
.prepend() When a node is prepended to multiple targets, the node is cloned behind the scenes. As the .clone() method doesnt support copying data and event listeners yet, these clones will erroursly not get these .prepend( function ) signature is unsupported weird result in the test "Is prepended node detached from previous position in DOM?" When a node is prepended to multiple targets, the node is cloned behind the scenes. As the .clone() method doesnt support copying data and event listeners, these clones will erroursly not get these .prepend( content [,content] ) only supports one piece of content .prepend( function ) signature is unsupported When a node is prepended to multiple targets, the node is cloned behind the scenes. As the .clone() method doesnt support copying data and event listeners, these clones will erroursly not get these .prepend( [ Text Node ] ) signature is unsupported (and array of text nodes)
.prependTo() Does not support prepending to multiple targets Does not support prepending to multiple targets
.prev() Only works on one element (the rest is dropped) .prev( selector ) is not supported, that is: no filtering
.pushStack()
.ready() The ready handler should be passed a reference to the jQuery object that called the method, but no arguments is passed
.remove() .remove( selector ) does not support nested selectors. For example "* > b" does not match when performed on a "b" element .remove( selector ) signature is not supported (all elements are removed) .remove( selector ) signature is not supported (all elements are removed) Event listeners on the old HTML are not removed. It is concidered best practise to remove event listeners, but according to this article, it is not strictly required for modern browsers:
.removeAttr() Does not handle when argument is null or undefined Can only remove one attribute at a time (space separated list of attribute names is not supported)
.removeClass() Does not remove a class name defined more than once .removeClass( function ) is not supported Does not remove extra spaces in HTML (fixed in 0.5.0)
.replaceWith() .replaceWith( function ) is not supported .replaceWith( function ) is not supported Event listeners on the old HTML are not removed. It is concidered best practise to remove event listeners, but according to this article, it is not strictly required for modern browsers:
.show() Animation is not supported Data regarding old display value does not survive all jQuery operations. Doesnt restore display value to the value before .hide() or .toggle() has been called. Ie. $(tempEl).css("display", "table-cell").show().show().css("display") returns "block", but should return "table-cell" Animation is not supported Does not comply in some edgecases
.text() Does not comply when jQuery set is empty .text( function ) signature is not supported Does not work on a set larger than one Throws error when jQuery set is empty
.toArray()
.toggle() Animation is not supported Data regarding old display value does not survive all jQuery operations. Does not comply in some edge cases, but to do so, we would have to recreate a buggy behaviour in jQuery Doesnt restore display value to the value before .hide() or .toggle() has been called. Ie. $(tempEl).css("display", "table-cell").show().show().css("display") returns "block", but should return "table-cell" Animation is not supported Does not comply in some edge cases, but to do so, we would have to recreate a buggy behaviour in jQuery
.trigger() Might not be compatible with all target browsers Event propagation may not be correct .trigger( event, [extraParameters] ): extraParameters are not supported Relies on .initEvent, which has been removed from the web standards. So we cannot rely on it to be supported by future (or even current?) browsers. However, initEvent is probably going to be supported quite a while. Has not been investigated. But it seems events are very well supported Relies on .initEvent, which has been removed from the web standards. So we cannot rely on it to be supported by future (or even current?) browsers. However, initEvent is probably going to be supported quite a while. Has not been investigated