In Safari on iOS8, Wired, Crocs, lululemon, and other websites built using the Mobify.js framework scroll a quarter way down the page upon render of each page
| Originator: | shawn | ||
| Number: | rdar://18375200 | Date Originated: | 17-Sep-2014 06:16 PM |
| Status: | Open | Resolved: | |
| Product: | iOS | Product Version: | 8 |
| Classification: | Reproducible: | Yes |
In Safari on iOS8, Wired, Crocs, lululemon, and other websites built using the Mobify.js framework scroll a quarter way down the page upon render of each page As of iOS 8.0 (12A365), all Mobify.js sites unexpectedly scroll down the page after load. Sometimes this happens on first load, and happens almost 100% of the time after navigating to another page on the website by clicking a link. A minimal test case has been attached and can be found in ios8_bug.html. On an iOS device: 1. Open attached io8_bug.html on an iOS8 device or iOS8 Simulator. 2. Notice that the initial rendering of the page is scrolled down. 3. Refresh to repeat. or 1. Go to any of the sites listed below and browse around. The initial rendering of the page should not be scrolled down. The initial rendering of the page is scrolled down. iPhone 5S (iOS8), and iOS8 Simulator Xcode 6.0.1 iOS 8.0 [12A365] The minimal test case is attached. The minimal test case shows how the page is being scrolled after dynamically attaching the meta viewport tag. The reason this is related to mobify.js is because it uses a technique we call "capturing" - which does the following to the page: 1. Inserts a plaintext tag to capture the contents of the page in order to prevent resources from loading. 2. Creates an interstitial document that we use to query against in an effort to create a new HTML page for that specific route. 3. Creates the new page by rendering the mobile template chosen by the router using dust.js. 4. Renders that new page to the DOM by using document.open/write. Since the document string is being written later on, and that document string almost always has the meta viewport tag in it, we end up running into the same issue exhibited by the minimal test case. We believe whatever issue plaguing the test case is the same issue we are running into with websites running Mobify.js. Here is a list of websites effected by this issue. These are just a few of the many sites effected. We estimate that there are over 1000 websites more that are unlisted: AnnTaylor.com BeyondTheRack.com Bosch-Home.com BT.com CallawayGolf.com Coastal.com Ideeli.com Loft.com Lululemon.com www.menshealth.com Neff.de Siemens-Home.com MyStarbucksIdea.force.com Techvibes.com Thermador.com Threadless.com TommyBahama.com TriaBeauty.com VirginWines.co.uk Wired.com WomensHealthMag.com WSJWine.com AICPA.org ArchitecturalDigest.com BET.com BurlingtonCoatFactory.com CTShirts.com Chewy.com Christies.com CoastHotels.com Crocs.co.uk Epicurious.com TravelNow.com css-tricks.com Foxhead.com Garmin.com GQ.com iOffer.com Ivivva.com LHW.com Outrigger.com Patheos.com Perfumania.com SharperImage.com StellaDot.com Style.com Superdry.com TeenVogue.com TheKnot.com Theory.com
Comments
Please note: Reports posted here will not necessarily be seen by Apple. All problems should be submitted at bugreport.apple.com before they are posted here. Please only post information for Radars that you have filed yourself, and please do not include Apple confidential information in your posts. Thank you!
You can find a minimal test case here: https://dl.dropboxusercontent.com/u/76629/ios8_bug.html