Platform/Layout/WebkitPrefixEmulation
From MozillaWiki
< Platform | Layout
Revision as of 18:54, 29 January 2015 by Dholbert (talk | contribs) (→9. http://dianping.com: Add descriptions of)
This page tracks the status of a project to emulate a subset of "-webkit" prefixed properties, for an extremely-strict list of sites that are broken on Firefox mobile builds & for which we've been unsuccessful at getting the sites to fix themselves. (bug 1107378)
The top 10 fixlist sites are listed on the bug page, with screenshots provided by the China team.
I've listed these sites below, and intend to provide labels for each one indicating their current brokenness state.
Contents
- 1 1. http://m.taobao.com
- 2 2. http://map.baidu.com webkit-box-reliance
- 3 3. http://music.baidu.com fx-unrelated-bug
- 4 4. http://3g.163.com
- 5 5. http://hao123.com
- 6 6. http://3g.qq.com
- 7 7. http://shucheng.baidu.com
- 8 8. http://mogujie.com broken-moz-box other-engine-unrelated-bug
- 9 9. http://dianping.com
- 10 10. http://m.qunar.com broken-moz-box
1. http://m.taobao.com
(actual URL after splash pages: http://h5.m.taobao.com/index2.html )
2. http://map.baidu.com webkit-box-reliance
- (Lots of horizontal menus end up as vertical, in unpatched firefox, due to "display:-webkit-box" containers rendering as "display:block")
- I can't reproduce the bad rendering in the China team's screenshots. Maybe the site has been fixed?
- Minor non-prefixing-related UI bugs:
- 2nd tab for "rings" has linewrapping issue -- filed bug 1127107
- 3rd tab for "artists" is missing arrow ">" icon at right edge of buttons-- not sure what's happening there, no bug filed yet
- 3rd tab for "artists" only shows 1 row of artist photos, vs. 2 rows on Chrome. This seems intentional (though strange) - the site creates a fixed-height "gallery" div to contain these, and it gives the gallery a larger specified height to in Firefox vs. Chrome (in the style attribute).
4. http://3g.163.com
5. http://hao123.com
6. http://3g.qq.com
7. http://shucheng.baidu.com
- Navbar of pink circled icons don't show up in Firefox, due to "-moz-box" behavior bug 668837
- Photo tiles don't show up in Firefox -- but that's because the site is unintentionally relying on a Blink/WebKit animation bug.
9. http://dianping.com
- UI issue: searchbar is pushed out of top bar
- UI issue: at http://m.dianping.com/citylist, "返回" (back) is centered (incorrectly) and title-text is overlaid on line below.
10. http://m.qunar.com broken-moz-box
- UI Quirk: If you adjust viewport-size (e.g. by rotating phone from landscape to portrait), button-tiles in grid don't adjust to fit new viewport. (Fixed if you replace "-moz-box" with "flex" in rule for ".qn_nav li")
Status Key for classification of UI issues that we're hitting
- fx-unrelated-bug: Site has a UI issue caused by a Firefox bug (not prefixing-related).
- other-engine-unrelated-bug: Site has a UI issue caused by accidental dependency on a bug in Blink/WebKit.
- webkit-box-reliance: Site has a UI issue caused by dependency on "-webkit-box" styles, with no fallback, & is fixed by emulating -webkit-box support.
- broken-moz-box: Site has a UI issue caused by misguided expectation that "-moz-box" behaves like "-webkit-box". (This generally prevents us from seeing "-webkit-box" & trying to emulate it, if "-moz-box" stuff comes after "-webkit-box" in their stylesheet.)