Compatibility/Mobile/Libraries

Mobile Frameworks and Libraries

This wiki exists to document some of the research that the Web Compat team is doing around compatibility with existing and new (mobile) libraries and frameworks (i.e., jQuery Mobile, Zepto). Feel free to add links to issues or bugs, or start a new section. The end goal is to document current compatibility with Firefox OS and Firefox for Android and advocate within Mozilla for fixes to libraries where compatibility can be improved upon.

The commitgrep tool may be useful in this line of research.

jQuery

• "Incorrect $(window).width() in Firefox" [investigate][needsbug]
  • http://bugs.jquery.com/ticket/14210: closed invalid, seems a dupe of
  • http://bugs.jquery.com/ticket/4687*no2: closed WFM but comments suggest it might still be an issue
• ".children does not return direct child, but .find does [Firefox only]" [fixed][bugzilla-fixed][workaround]
  • http://bugs.jquery.com/ticket/13894
  • https://bugzilla.mozilla.org/show_bug.cgi?id=872853
  • fixed in 2f2e045ea66f320eee62b149a6b11f22aadb816b
• "Query doesn't work in a non-HTML document in UAs that have innerHTML on Element and create non-HTML elements via createElement" [fixed][bugzilla-fixed][workaround]
  • http://bugs.jquery.com/ticket/13754
  • https://bugzilla.mozilla.org/show_bug.cgi?id=858850*c8
  • fixed in c6a694e1c262acb941b7fd86663f186656496bbc
• ""no element found" in Firefox when $.post reply has no Content-Type" [open][bugzilla-open]
  • http://bugs.jquery.com/ticket/13450
  • https://bugzilla.mozilla.org/show_bug.cgi?id=884693
• "Resize event is triggered in the middle of a running function called by setTimeout, when calling elem.height()" [cantfix][bugzilla-open]
  • http://bugs.jquery.com/ticket/13376
  • https://bugzilla.mozilla.org/show_bug.cgi?id=840412 (apparently a regression)
• "Firefox focus and blur events not firing when calling focus() and blur()"[cantfix][needs-bugzilla]
  • http://bugs.jquery.com/ticket/13363 and http://jsfiddle.net/vKDe2/9/ (see note about possibly needing an iframe)
  • http://bugs.jquery.com/ticket/10557
• "document.ready not firing on Firefox, Opera with XSLT and XML" [open][bugzilla-open]
  • http://bugs.jquery.com/ticket/13193
  • https://bugzilla.mozilla.org/show_bug.cgi?id=325891
• "$(el).position().left returns wrong value in webkit browsers" [cantfix][bugzilla-open]
  • http://bugs.jquery.com/ticket/11813
  • http://bugs.jquery.com/ticket/11110
  • https://bugzilla.mozilla.org/show_bug.cgi?id=381328

jQuery Mobile

• "iframes with a link to a page on the same document causes the full document to be loaded in the iframe on FF" [open][buzilla-open]
  • https://github.com/jquery/jquery-mobile/issues/5972
  • https://bugzilla.mozilla.org/show_bug.cgi?id=927842

Zepto.js

• https://github.com/madrobby/zepto/search?q=firefox&ref=cmdform&type=Issues

• "Zepto framework platform detection doesn't detect FF mobile as Android" [fixed]
  • https://bugzilla.mozilla.org/show_bug.cgi?id=812197
  • Fixed by https://github.com/madrobby/zepto/commit/d21ce64170873d3c691fbfad9ac7c698de887fdb

• "webkit will report a proper scrollTop() value on $('body') but will always be 0 on $('html') and FF will report a proper scrollTop() value on $('html') but will always be 0 on $('body')."
  • https://github.com/madrobby/zepto/issues/392

Sencha Touch

Tracking bug https://bugzilla.mozilla.org/show_bug.cgi?id=895485

Testing with Sencha Touch 2.3.0 (GPL): http://www.sencha.com/products/touch/download/sencha-touch-2.3.0/2920

"Sencha Touch is the only framework that enables developers to build powerful apps that work on iOS, Android, BlackBerry, Windows Phone, and Internet Explorer 10."

JS / DOM

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/microloader/development.js#L65 would fail for "Mobile;" tokens in FxOS and F4A. Also found in https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/core/class/Class.js#L534-L551

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/chart/interactions/Abstract.js#L175-L180 isMultiTouch, need to check Ext.os.is.MultiTouch to see if we might fail here (hopefully is doing actual feature detection).

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/core/class/Loader.js#L24 (is this possible in Gecko out of the box?)

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/data/proxy/Sql.js If an app is using the WebSQL proxy... there's not much to be done.

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/device/SQLite.js, more SQLite as a possible compat issue

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/dom/Element.static.js#L313-L323 has a fallback for non window.orientation supporting devices (presumably for WinPhone compat). I wonder what version this was introduced in?

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/env/OS.js#L16 Do we want to add FxOS?

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/env/OS.js#L34 will probably fail for FxforAndroid, as the UA string has "Android;".

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/event/publisher/TouchGesture.js#L31-L65, so long as the default for `screenPositionRatio` is sane, probably not a problem. But lots of workarounds for WebKit browsers to be aware of.

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/field/Select.js#L352 platform specific heights.

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/fx/animation/Wipe.js#L44-L94 only including -webkit-gradients here.

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/util/translatable/CssTransform.js#L20 missing other prefixes

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/viewport/Android.js, do any of these Android assumptions make sense in Firefox for Android? (see also https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/viewport/Viewport.js#L20)

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/Anim.js#L206 Starting at line 206, there are tons of -webkit-only transform related props.

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/Media.js#L72-L75 is this true for Fennec?

• Do we have a perf bug open for this? https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/src/XTemplateCompiler.js#L15-L18

CSS

Note: these would all be fixed in the themes/stylesheets/sencha-touch/base/src/_Foo.scss files (I think).

• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/resources/css-debug/apple.css#L1260 should be updated to -moz-user-select: none;
• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/resources/css-debug/apple.css#L1260 missing -moz-user-select: text;
• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/resources/css-debug/apple.css#L2234-L2238, -webkit-box only styles.
• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/resources/css-debug/apple.css#L3382-L3399, -webkit-mask-* properties
• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/resources/css-debug/apple.css#L4443-L4454, only has -webkit-appearance: none, and a .x-ie class that gets background: transparent; instead.
• https://github.com/miketaylr/sencha-touch-2.3.0-gpl/blob/master/resources/css-debug/apple.css#L589-L608, there's an x-firefox class that's being used to hide .x-dock-body (width:0, height:0). Unsure why...

iScroll

Tracking bug: https://bugzilla.mozilla.org/show_bug.cgi?id=941076

0 results from commitgrep, http://miketaylr.github.io/commitgrep/iscroll.html