<!DOCTYPE html>
<html>
<head>
    <title>REGRESSION(r143727): Clicking / selecting inside an embed is broken - bug 111217</title>
    <script src="../../../resources/js-test.js"></script>
    <script src="resources/nodesFromRect.js"></script>
    <style>
        body { margin: 0px; }
        #sandbox {
            width: 400px;
            height: 200px;
        }
        #sandbox embed {
            float: right;
            display: block;
            box-sizing: border-box;
            width: 200px;
            height: 200px;
            border: none;
        }
        #sandbox object {
            display: block;
            box-sizing: border-box;
            width: 200px;
            height: 200px;
            border: none;
        }
    </style>
</head>
<body id="body">
    <div id=sandbox>
        <embed id="childframe1" src="resources/child-frame.html"></embed>
        <object id="childframe2" type="text/html" data="resources/child-frame.html"></object>
    </div>

    <p id='description'></p>
    <div id="console"></div>
    <script type="application/javascript">
        function runTest()
        {
            description(document.title);

            // Set up shortcut access to elements
            var e = {};
            ['sandbox', 'layer'].forEach(function(a) {
                e[a] = document.getElementById(a);
            });

            checkPoint(20, 20, "DIV#left");
            checkPoint(140, 20, "DIV#right");

            checkPoint(220, 20, "DIV#left");
            checkPoint(340, 20, "DIV#right");

            checkRect(25, 25, 100, 100, "DIV#right, DIV#left, HTML");
            checkRect(250, 20, 100, 70, "DIV#right, DIV#left, HTML");

            checkRect(150, 50, 100, 100, "DIV#right, HTML, #document, OBJECT#childframe2, DIV#left, HTML, #document, EMBED#childframe1, DIV#sandbox");


            e.sandbox.display = 'none';
            finishJSTest();
        }
        jsTestIsAsync = true;
        window.onload = runTest;
    </script>
</body>
</html>