<!DOCTYPE html>
<html>
<head>
    <title>Geometry Interfaces: DOMRect and DOMRectReadOnly interface tests.</title>
    <link rel="author" title="Dirk Schulze" href="mailto:simon.fraser@apple.com" />
    <link rel="help" href="http://www.w3.org/TR/geometry-1/#DOMRect">
    <link rel="help" href="https://drafts.fxtf.org/geometry/#DOMRect">
    <script src="../resources/testharness.js"></script>
    <script src="../resources/testharnessreport.js"></script>
</head>
<body>
    <p>Test DOMRect and DOMRectReadOnly interfaces</p>
    <div id="log"></div>
    <script>
        test(function() {
            checkDOMRect(new DOMRectReadOnly(), { x:0, y:0, width:0, height:0 });
        },'testDOMRectReadOnlyConstructor0');
        test(function() {
            var x = 10;
            var y = 12;
            var width = 99;
            var height = 102;
            checkDOMRect(new DOMRectReadOnly(x, y, width, height), { x, y, width, height });
        },'testDOMRectReadOnlyConstructor4Args');
        test(function() {
            var x = 10;
            var y = 12;
            var width = 99;
            var height = 102;
            checkDOMRect(new DOMRectReadOnly(x), { x, y:0, width:0, height:0 });
        },'testDOMRectReadOnlyConstructor1Arg');
        test(function() {
            var x = 10;
            var y = 12;
            var width = 99;
            var height = 102;
            checkDOMRect(new DOMRectReadOnly(x, y), { x, y, width:0, height:0 });
        },'testDOMRectReadOnlyConstructor2Args');
        test(function() {
            var x = 10;
            var y = 12;
            var width = 99;
            var height = 102;
            checkDOMRect(new DOMRectReadOnly(x, y, width), { x, y, width, height:0 });
        },'testDOMRectReadOnlyConstructor3Args');
        test(function() {
            x = Math.PI;
            y = Math.SQRT2;
            width = Math.E;
            height = Math.LN10;
            checkDOMRect(new DOMRectReadOnly(x, y, width, height), { x, y, width, height });
        },'testDOMRectReadOnlyConstructorDoublePrecision');
        test(function() {
            var x = 10;
            var y = 12;
            var width = -99;
            var height = 102;
            checkDOMRect(new DOMRectReadOnly(x, y, width, height), { x, y, width, height });
        },'testDOMRectReadOnlyConstructorNegativeWidth');
        test(function() {
            var x = 10;
            var y = 12;
            var width = 99;
            var height = -102;
            checkDOMRect(new DOMRectReadOnly(x, y, width, height), { x, y, width, height });
        },'testDOMRectReadOnlyConstructorNegativeHeight');
        test(function() {
            var x = 1;
            var y = NaN;
            var width = NaN;
            var height = -200;
            checkDOMRect(new DOMRectReadOnly(x, y, width, height), { x, y, width, height });
        },'testDOMRectReadOnlyConstructorNaN1');
        test(function() {
            var x = NaN;
            var y = 2;
            var width = 99;
            var height = NaN;
            checkDOMRect(new DOMRectReadOnly(x, y, width, height), { x, y, width, height });
        },'testDOMRectReadOnlyConstructorNaN2');
        test(function() {
            var x = Infinity;
            var y = -102;
            var width = 304;
            var height = -Infinity;
            checkDOMRect(new DOMRectReadOnly(x, y, width, height), { x, y, width, height });
        },'testDOMRectReadOnlyConstructorInf1');
        test(function() {
            var x = 23;
            var y = -Infinity;
            var width = Infinity;
            var height = -99;
            checkDOMRect(new DOMRectReadOnly(x, y, width, height), { x, y, width, height });
        },'testDOMRectReadOnlyConstructorInf2');
        test(function() {
            var x = 10;
            var y = 12;
            var width = 99;
            var height = 102;
            var domRect = new DOMRectReadOnly(x, y, width, height);
            domRect.x = 1200;
            domRect.height = 300;
            checkDOMRect(domRect, { x, y, width, height });
        },'testDOMRectReadOnlyIsReadOnly');
        test(function() {
            var x = 10;
            var y = 12;
            var width = 99;
            var height = 102;
            checkDOMRect(DOMRectReadOnly.fromRect({ x, y, width, height }), { x, y, width, height });
        },'testDOMRectReadOnlyFromRect');
        test(function() {
            assert_true(DOMRectReadOnly.fromRect({ x:11, y:22, width:33, height:44 }) instanceof DOMRectReadOnly)
        },'testFromRectReturnsDOMRectReadOnly');
        test(function() {
            var x = 10;
            var width = 99;
            checkDOMRect(DOMRectReadOnly.fromRect({ x, width }), { x, y:0, width, height:0 });
        },'testDOMRectReadOnlyFromRectPartial');
        test(function() {
            var x = 10;
            var y = 12;
            var width = 99;
            var height = -102;
            checkDOMRect(DOMRectReadOnly.fromRect({ x, y, width, height }).toJSON(), { x, y, width, height });
        },'testDOMRectReadOnlySerialization');

        test(function() {
            var x = 10;
            var y = 12;
            var width = 99;
            var height = 102;
            checkDOMRect(new DOMRect(x, y, width, height), { x, y, width, height });
        },'testDOMRectConstructor0');
        test(function() {
            var x = 10;
            var y = 12;
            var width = 99;
            var height = 102;
            var domRect = new DOMRect(x, y, width, height);
            domRect.x = 1200;
            domRect.height = 300;
            checkDOMRect(domRect, { x:1200, y, width, height:300 });
        },'testDOMRectIsWritable');
        test(function() {
            var x = 10;
            var y = 12;
            var width = 99;
            var height = 102;
            var domRect = new DOMRect(x, y, width, height);
            domRect.x = NaN;
            domRect.height = NaN;
            checkDOMRect(domRect, { x:NaN, y:12, width:99, height:NaN });
        },'testDOMRectIsWritableWithNaN');
        test(function() {
            assert_true(DOMRect.fromRect({ x:11, y:22, width:33, height:44 }) instanceof DOMRect)
        },'testFromRectReturnsDOMRect');
        test(function() {
            var x = 10;
            var y = 12;
            var width = 99;
            var height = 102;
            checkDOMRect(DOMRect.fromRect({ x, y, width, height }), { x, y, width, height });
        },'testDOMRectFromRect');
        test(function() {
            var x = 10;
            var y = 12;
            var width = 99;
            var height = -102;
            checkDOMRect(DOMRect.fromRect({ x, y, width, height }).toJSON(), { x, y, width, height });
        },'testDOMRectSerialization');

        function checkDOMRect(r, exp) {
            assert_equals(r.x, exp.x, "Expected value for x is " + exp.x);
            assert_equals(r.y, exp.y, "Expected value for y is " + exp.y);
            assert_equals(r.width, exp.width, "Expected value for width is " + exp.width);
            assert_equals(r.height, exp.height, "Expected value for height is " + exp.height);

            assert_equals(r.left, Math.min(exp.x, exp.x + exp.width), "Expected value for left is " + Math.min(exp.x, exp.x + exp.width));
            assert_equals(r.right, Math.max(exp.x, exp.x + exp.width), "Expected value for right is " + Math.max(exp.x, exp.x + exp.width));
            assert_equals(r.top, Math.min(exp.y, exp.y + exp.height), "Expected value for top is " + Math.min(exp.y, exp.y + exp.height));
            assert_equals(r.bottom, Math.max(exp.y, exp.y + exp.height), "Expected value for bottom is " + Math.max(exp.y, exp.y + exp.height));
        }
    </script>
</body>
</html>