parsing-object-position.html | Explore in Territory

<!DOCTYPE html>
<html>
    <head>
        <script src="../../resources/js-test.js"></script>
    </head>
    <body>
        <script>
            description("This tests checks that all of the input values for object-position parse correctly.");

            function test(value)
            {
                var div = document.createElement("div");
                div.setAttribute("style", value);
                document.body.appendChild(div);

                var result = div.style.getPropertyValue("object-position");
                document.body.removeChild(div);
                return result;
            }

            function testComputedStyle(value)
            {
                var div = document.createElement("div");
                div.setAttribute("style", value);
                document.body.appendChild(div);

                var result = window.getComputedStyle(div).objectPosition;
                document.body.removeChild(div);
                return result;
            }

            shouldBeEqualToString('testComputedStyle(";")', '50% 50%');
            shouldBeEqualToString('testComputedStyle("object-position: 10px;")', '10px 50%');
            shouldBeEqualToString('testComputedStyle("object-position: 10px 10px;")', '10px 10px');
            shouldBeEqualToString('testComputedStyle("object-position: right top;")', '100% 0%');
            shouldBeEqualToString('testComputedStyle("object-position: top right;")', '100% 0%');
            shouldBeEqualToString('testComputedStyle("object-position: left 20px bottom 50%;")', '20px 50%');
            shouldBeEqualToString('testComputedStyle("object-position: right 50% bottom 25%;")', '50% 75%');
            shouldBeEqualToString('testComputedStyle("object-position: bottom 20px right 12px;")', 'calc(100% - 12px) calc(100% - 20px)');

            shouldBeEqualToString('test("object-position: inherit;")', 'inherit');
            shouldBeEqualToString('test("object-position: initial;")', 'initial');
            shouldBeEqualToString('test("object-position: left;")', 'left center');
            shouldBeEqualToString('test("object-position: top;")', 'center top');
            shouldBeEqualToString('test("object-position: top right;")', 'right top');
            shouldBeEqualToString('test("object-position: right top;")', 'right top');
            shouldBeEqualToString('test("object-position: center center;")', 'center center');
            shouldBeEqualToString('test("object-position: center;")', 'center center');
            shouldBeEqualToString('test("object-position: bottom center;")', 'center bottom');
            shouldBeEqualToString('test("object-position: left center;")', 'left center');
            shouldBeEqualToString('test("object-position: bottom center;")', 'center bottom');
            shouldBeEqualToString('test("object-position: center left;")', 'left center');
            shouldBeEqualToString('test("object-position: center bottom;")', 'center bottom');
            shouldBeEqualToString('test("object-position: 100px;")', '100px center');
            shouldBeEqualToString('test("object-position: 100px 100px;")', '100px 100px');
            shouldBeEqualToString('test("object-position: 100px 200px;")', '100px 200px');
            shouldBeEqualToString('test("object-position: -50% 0;")', '-50% 0px');
            shouldBeEqualToString('test("object-position: 3em 0;")', '3em 0px');
            shouldBeEqualToString('test("object-position: left 33px;")', 'left 33px');
            shouldBeEqualToString('test("object-position: center 33px;")', 'center 33px');
            shouldBeEqualToString('test("object-position: 33px center;")', '33px center');
            shouldBeEqualToString('test("object-position: 33px bottom;")', '33px bottom');
            shouldBeEqualToString('test("object-position: 1vh 1vw;")', '1vh 1vw');
            shouldBeEqualToString('test("object-position: left 20px bottom 50%;")', 'left 20px bottom 50%');
            shouldBeEqualToString('test("object-position: right 50% bottom 25%;")', 'right 50% bottom 25%');
            shouldBeEqualToString('test("object-position: bottom 20px right 12px;")', 'right 12px bottom 20px');

            shouldBeEqualToString('test("object-position: 100px 100px 100px;")', '');
            shouldBeEqualToString('test("object-position: 100px 100px 200px 200px;")', '');
            shouldBeEqualToString('test("object-position: center bottom 25%;")', '');
            shouldBeEqualToString('test("object-position: top left center;")', '');
            shouldBeEqualToString('test("object-position: top top;")', '');
            shouldBeEqualToString('test("object-position: top bottom;")', '');
            shouldBeEqualToString('test("object-position: 33px left;")', '');
            shouldBeEqualToString('test("object-position: top 33px;")', '');
            shouldBeEqualToString('test("object-position: inherit inherit;")', '');
            shouldBeEqualToString('test("object-position: initial initial;")', '');
            shouldBeEqualToString('test("object-position: -webkit-fill-available;")', '');
            shouldBeEqualToString('test("object-position: min-content;")', '');
            shouldBeEqualToString('test("object-position: intrinsic;")', '');
            shouldBeEqualToString('test("object-position: auto;")', '');
            shouldBeEqualToString('test("object-position: none;")', '');
            shouldBeEqualToString('test("object-position: fill;")', '');
        </script>
    </body>
</html>
chromium/third_party/blink/web_tests/fast/css/parsing-object-position.html
