Advanced CSS `zoom` test

Primarily for researching ZeroClipboard, Bug #149: https://github.com/zeroclipboard/ZeroClipboard/issues/149

by James Greene

HTML

<h1>CSS `zoom` Test</h1>

<div id="outerContainer"><div id="container"></div></div>
<div id="results"></div>

CSS

body {
    padding: 0px;
    margin: 0px;
    position: relative;
    display: block;
}
#outerContainer, #container {
    position: absolute;
    top: 100px;
    left: 0;
    zoom: 1.0;
    height: 100px;
/*
    THEORY:
    If the `width` is explicitly set, then `zoom` will affect it in Chrome/WebKit. If not, then it will NOT affect it. The same may also be true for `height`.
*/
    width: 300px;
}
#outerContainer {
    background: yellow;
}
#container {

    background: green;
}
#results {
    border-top: 2px dashed black;
    position: absolute;
    top: 250px;
    left: 0;
}
#summary {
    font-weight: bold;
    font-style: italic;
    display: inline-block;
}
#details > li {
    margin-bottom: 20px;
}
.good {
    background-color: #66FF99;
}
.bad {
    background-color: #FF3333;
}

JavaScript

"use strict";

function _getRect(obj) {
    var rect = obj.getBoundingClientRect();
    if (!("height" in rect)) {
        rect.height = rect.bottom - rect.top;
    }
    if (!("width" in rect)) {
        rect.width = rect.right - rect.left;
    }
    return rect;
}

var _getStyle = (function () {

    var _camelizeCssPropName = (function () {
        var matcherRegex = /\-([a-z])/g,
            replacerFn = function (match, group) {
                return group.toUpperCase();
            };
        return function (prop) {
            return prop.replace(matcherRegex, replacerFn);
        };
    })();

    return function _getStyle(el, prop) {
        var value, camelProp, tagName, possiblePointers, i, len;
        if (window.getComputedStyle) {
            value = window.getComputedStyle(el, null).getPropertyValue(prop);
        } else {
            camelProp = _camelizeCssPropName(prop);
            if (el.currentStyle) {
                value = el.currentStyle[camelProp];
            } else {
                value = el.style[camelProp];
            }
        }
        if (prop === "zoom" && typeof value === "string") {
            if (value === "normal" || !value) {
                value = 1.0;
            } else if (value.slice(-1) === "%") {
                value = parseFloat(value) / 100.0;
            }
            // Oh, Safari....
            else if (value !== "reset") {
                value = parseFloat(value);
            }
        }
        return value;
    };

})();

function _computeCssZoom(el) {
    var zoomFactor = 1.0;
    while (el && el.nodeType === 1 && "zoom" in el.style) {
        var elZoom = _getStyle(el, "zoom");
        // Oh, Safari....
        if (elZoom === "reset") {
            el = null;
        } else {
            zoomFactor = zoomFactor * elZoom;
            el = el.parentNode;
        }
    }
    return zoomFactor;
};


// dimension to number
function _d2n(dimen) {
    if (typeof dimen === "string" && dimen.slice(-2) ===...