<html>
<head>
    <title></title>
    <script type="text/javascript">
        function log(message)
        {
            var console = document.getElementById("console");
            console.appendChild(document.createTextNode(message + "\n"));
        }

        function testShorthand(shorthand)
        {
            var element = document.createElement("div");
            element.setAttribute("style",
                "border: thin dotted purple;\
                 background: red url(/background.png) repeat-y scroll right bottom;\
                 list-style: square outside url(/marker.png);\
                 margin: 5%;\
                 -webkit-margin-collapse: collapse;\
                 -webkit-marquee: ahead small infinite slide slow;\
                 padding: 2em;\
                 -webkit-text-stroke: orange 1pt;\
                 -webkit-columns: 100px 3;\
                 -webkit-column-rule: thick dashed silver;\
                 border-spacing: 10px 20px;\
                 -webkit-border-radius: 6px 8px;\
                 overflow: scroll;");
            element.style.removeProperty(shorthand);
            log("Removing '" + shorthand + "' leaves '" + element.style.cssText +"'");
        }
        
        function test()
        {
            if (window.layoutTestController)
                layoutTestController.dumpAsText();

            var shorthands = [
                "border",
                "border-top", "border-right", "border-bottom", "border-left",
                "border-width", "border-style", "border-color",
                "background",
                "background-position",
                "list-style",
                "margin",
                "-webkit-margin-collapse",
                "-webkit-marquee",
                "padding",
                "-webkit-text-stroke",
                "-webkit-columns",
                "-webkit-column-rule",
                "border-spacing",
                "-webkit-border-radius",
                "overflow"
            ];

            for (i in shorthands)
                testShorthand(shorthands[i]);
        }
    </script>
</head>
<body onload="test()">
    <p>
        Test for <i><a href="http://bugs.webkit.org/show_bug.cgi?id=9284">http://bugs.webkit.org/show_bug.cgi?id=9284</a>
        Quirksmode (CSS1): Removing inline border styles is impossible</i>.
    </p>
    <p>
        Starting with a declaration containing all properties that are constituents of shortcuts, see what is left
        when a shortcut property is removed. The shortcut&rsquo;s constituents and only them should be removed.
    </p>
    <pre id="console"></pre>
</body>
</html>