Safari 6 breaks my JavaScript 

By David Roessli

Posted in daily

Tags :
Safari6 bug

After upgrading to Mountain Lion (Mac OS 10.8) I noticed that some of my JavaScript code stopped working in Safari 6.

For example, I'm having trouble with .scrollTop() which stopped performing as it should.

I use this function to implement a smooth scroll on hairproject.ch based on a CSS Tricks snippet. The function doesn't return any scrollable elements when run in Safari 6. I'm still looking for a workaround…

I checked the internets, and other people are complaining of a range of Safari 6 issues related to JavaScript.

To be continued.

Aug 6 update: I brushed up a quick test page at www.cybmed.com/w/safari6bug if you care to take a look.

Posted a response ? — Webmention it

This site uses webmentions. If you've posted a response and need to manually notify me, you can enter the URL of your response below.

Comments and responses

  • 24 Aug 2012

    Johnny:

    There is a related bug in Safari 6:
    When you insert an element into the DOM, you can no longer immediately do “container.scrollTop = container.scrollHeight”; it will not scroll to the absolute bottom, and will instead stop a few pixels shy, such as scrolling down to 877 pixels rather than 880 pixels. The error gets larger the more elements are in the DOM.
    .scrollHeight immediately updates properly; it’s the .scrollTop property which can no longer scroll immediately down to the new bottom, and clamps the value to some pixels before the end, if called too soon.
    The solution is to insert a small wait period, like this:
    - Insert the new element into DOM.
    - setTimeout(function(){container.scrollTop = container.scrollHeight;},1)
    This will insert a millisecond (plus some overhead) of wait before the .scrollTop change attempt, and is enough to fix the bug. The bug appeared in Safari 6 or the last Safari 5 version.
    I think it’s related to Apple doing all kinds of optimizations (as usual) on their very fast Javascript engine, and somehow screwing something up in the process.

  • 25 Aug 2012

    David Roessli:

    Thank you @Johnny for this detailed explanation!
    It will be of great help in fixing existing code until the bug iitself is corrected.

  • 25 Aug 2012

    Johnny:

    Hello David,
    I’m glad that my info managed to help; I found your blog post very helpful too in analyzing the problem. My own code ended up with a small 1 millisecond timer calling the scrolling function, and everything works perfectly until the bug is fixed. ;-)
    Good luck with your site!
    - Johnny

  • 27 Feb 2013

    Johnny:

    Safari no longer has the .scrollTop=.scrollHeight calculation bug.

Want more ? — prev/next entries