Safari Bug: wrong offsetTop on TD

# EDIT: This bug will be fixed soon. See WebKit Bugzilla 19094. It’s fixed already on Nightly. If you do have a tweak for this bug, (such as me) you need to add another sniff like follows.

var webkit = indow.navigator.userAgent.match(/WebKit\/([0-9]{3})/);
if (webkit && parseInt(webkit[1]) < 528) {
...
}

---

Most of JavaScript library comes with a method that returns pixel position of the given element. For example, jQuery has jQuery.offset(), MochiKit has MochiKit.Style.getElementPosition(), MooTools has Element.getPosition(). They work well in most cases, but today i found the situation that doesn't work and that, I think, is a Safari's bug.

Before going into detail, here's the condition that pixel position getter method doesn't work.

1. The browser is Safari
2. The element you try to work on is TD (or display:table-cell)
3. It set vertical-align NOT as top (maybe middle or bottom)

Here I made examples for this case: Safaribug: wrong offsetTop on TD. When you click each table cell, it will return the pixel position of the clicked TD. Open the page with Safari and other browsers. There are differences.

How it happens? Let me introduce how JS lib calculate the pixel position of any given element. I found a nice code with comments on Google doctype project.

PageOffset: How to calculate the position of an element on the page (goog.style.getPageOffset)

It's really step-by-step good explain, you should go through with it. Here I extract how Safari runs the code:

function getPageOffset(el) {
    var pos = {
        x: 0,
        y: 0
    };
    var viewportElement = document;
    if (el == viewportElement) {
        return pos;
    }

    var parent = null;
    var box;

    pos.x = el.offsetLeft;
    pos.y = el.offsetTop;

    parent = el.offsetParent;
    if (parent != el) {
        while (parent) {
            pos.x += parent.offsetLeft;
            pos.y += parent.offsetTop;
            parent = parent.offsetParent;
        }
    }

    if (el.style.position == 'absolute') {
        pos.y -= doc.body.offsetTop;
    }

    parent = el.offsetParent;
    while (parent && parent != document.body) {
        pos.x -= parent.scrollLeft;
        parent = parent.offsetParent;
    }

    return pos;
};

The problem happens on the very first access to el.offsetTop on line 15. It should be 0, since it's a table cell and no padding/margin/border set, but it seems Safari returns the vertical offset to the descendant element on that property.

I don't come up with any smart way to solve it... so I just tweak it.. Please WebKit, fix this bug!!