<!DOCTYPE html>
<html>
<head>
<script src="../../../resources/js-test-pre.js"></script>
<script src="resources/shadow-dom.js"></script>
</head>
<body>
<p id="description"></p>
<div id="sandbox"></div>
<pre id="console"></pre>
<script>
description("Tests to ensure that MouseEvent's offsetX and offsetY are adjusted in re-targeting.");

function moveMouseOver(element)
{
    if (!window.eventSender || !window.internals)
        return;

    var x = element.offsetLeft + element.offsetWidth / 2;
    var y = element.offsetTop + element.offsetHeight / 2;
    eventSender.mouseMoveTo(x, y);
}

var eventRecords = {};

function recordEvent(event)
{
    var eventType = event.type
    var eventRecord = {}
    eventRecord['currentTarget'] = event.currentTarget.id
    eventRecord['target'] = event.target.id
    eventRecord['offsetX'] = event.offsetX;
    eventRecord['offsetY'] = event.offsetY;
    eventRecords[event.currentTarget.id] = eventRecord;
}

function addEventListeners(nodes)
{
    for (var i = 0; i < nodes.length; ++i) {
        var node = getNodeInShadowTreeStack(nodes[i]);
        node.addEventListener('mouseover', recordEvent, false);
    }
}

function testMouseEventOffset()
{
    var sandbox = document.getElementById('sandbox');
    sandbox.innerHTML = '';
    sandbox.appendChild(
        createDOM('div', {'id': 'top', 'style': 'padding-top: 77px;'},
                  createDOM('div', {'id': 'shadow-host', 'style': 'padding-left: 100px; padding-top: 20px'},
                            createShadowRoot(
                                createDOM('div', {'id': 'parent'},
                                          createDOM('div', {'id': 'target', 'style': 'padding-top: 10px; width: 80px'}))))));
    addEventListeners(['top', 'shadow-host', 'shadow-host/parent']);
    sandbox.offsetLeft;
    moveMouseOver(getNodeInShadowTreeStack('shadow-host/target'));

    shouldBe("eventRecords['parent']['offsetY']", "5");
    shouldBe("eventRecords['shadow-host']['offsetY']", "5 + 20");
    shouldBe("eventRecords['top']['offsetY']", "5 + 20");

    shouldBe("eventRecords['parent']['offsetX']", "80 / 2");
    shouldBe("eventRecords['shadow-host']['offsetX']", "80 / 2 + 100");
    shouldBe("eventRecords['top']['offsetX']", "80 / 2 + 100");
}

function test()
{
    if (window.testRunner)
        testRunner.dumpAsText();

    testMouseEventOffset();
}

test();
</script>
<script src="../../../resources/js-test-post.js"></script>
</body>
</html>