function getWritingMode(element, reference) {
    var style = window.getComputedStyle(reference);
    if (style.getPropertyValue("writing-mode") !== "horizontal-tb" ||
        style.getPropertyValue("direction") !== "ltr")
        throw "Reference should have writing mode horizontal-tb and ltr";

    style = window.getComputedStyle(element);
    var param =  {
        rtl: style.getPropertyValue("direction") === "rtl",
        mode: style.getPropertyValue("writing-mode")
    };

    return param;
}

function compareSize(element, reference, epsilon) {
    var param = getWritingMode(element, reference);
    var elementBox = element.getBoundingClientRect();
    var referenceBox = reference.getBoundingClientRect();

    switch(param.mode) {
    case "horizontal-tb":
        assert_approx_equals(elementBox.width, referenceBox.width, epsilon,
                             "inline size");
        assert_approx_equals(elementBox.height, referenceBox.height, epsilon,
                             "block size");
        break;
    case "vertical-lr":
    case "vertical-rl":
        assert_approx_equals(elementBox.width, referenceBox.height, epsilon,
                             "inline size");
        assert_approx_equals(elementBox.height, referenceBox.width, epsilon,
                             "block size");
        break;
    default:
        throw "compareSize: Unrecognized writing-mode value";
    }
}

function participateToParentLayout(child) {
    var style = window.getComputedStyle(child);
    return style.getPropertyValue("display") !== "none" &&
        style.getPropertyValue("position") !== "absolute" &&
        style.getPropertyValue("position") !== "fixed";
}

function childrenParticipatingToLayout(element) {
    var children = [];
    Array.from(element.children).forEach(child => {
        if (participateToParentLayout(child))
            children.push(child);
    })
    return children;
}

function compareLayout(element, reference, epsilon) {
    // Compare sizes of elements and children.
    var param = getWritingMode(element, reference);

    compareSize(element, reference, epsilon);
    var elementBox = element.getBoundingClientRect();
    var referenceBox = reference.getBoundingClientRect();

    var elementChildren = childrenParticipatingToLayout(element);
    var referenceChildren = childrenParticipatingToLayout(reference);
    if (elementChildren.length != referenceChildren.length)
        throw "Reference should have the same number of children participating to layout."

    for (var i = 0; i < elementChildren.length; i++) {
        compareSize(elementChildren[i], referenceChildren[i], epsilon);

        var childBox = elementChildren[i].getBoundingClientRect();
        var referenceChildBox = referenceChildren[i].getBoundingClientRect();

        switch(param.mode) {
        case "horizontal-tb":
            assert_approx_equals(param.rtl ?
                                 elementBox.right - childBox.right :
                                 childBox.left - elementBox.left,
                                 referenceChildBox.left - referenceBox.left,
                                 epsilon,
                                 `inline position (child ${i})`);
            assert_approx_equals(childBox.top - elementBox.top,
                                 referenceChildBox.top - referenceBox.top,
                                 epsilon,
                                 `block position (child ${i})`);
            break;
        case "vertical-lr":
        case "vertical-rl":
            assert_approx_equals(param.rtl ?
                                 elementBox.bottom - childBox.bottom :
                                 childBox.top - elementBox.top,
                                 referenceChildBox.left - referenceBox.left,
                                 epsilon,
                                 `inline position (child ${i})`);
            assert_approx_equals(elementBox.right - childBox.right,
                                 referenceChildBox.top - referenceBox.top,
                                 epsilon,
                                 `block position (child ${i})`);
            break;
        default:
            throw "compareLayout: Unrecognized writing-mode value";
        }
    }
}