<!DOCTYPE HTML>
<html>
<head>
<script src="../../resources/js-test-pre.js"></script>
<script src="../../resources/accessibility-helper.js"></script>
</head>
<body>

<button id="button1" onaccessibleclick="accessibleclickCallback(true)">Click</button>
<button id="button2">Click</button>
<p id="p1">
<button id="button3">Click</button>
</p>

<ul id="ul">
<li id="li">
<button id="button4">Click</button>
</li>
</ul>

<p id="description"></p>
<div id="console"></div>

<script>
    description("This tests accessibility-specific events.");
    if (window.accessibilityController) {
        var node;
        var axNode;
        var receivedDOMLevel1Event;
        var receivedAXEvent;
        var receivedFallbackEvent;

        testAccessibleClick();
        testPreventDefault();
        testEventBubbling();
        testEventCapturingAndBubbling();
    }

    function accessibleclickCallback(domLevel1) {
        if (domLevel1)
            receivedDOMLevel1Event = true;
        else
            receivedAXEvent = true;
    }

    function testAccessibleClickDOMLevel1() {
        debug("\nonaccessibleclick attribute support");
        axNode = accessibilityController.accessibleElementById("button0");
        receivedAXEvent = false;
        axNode.syncPress();
        shouldBeTrue("receivedAXEvent");
    }

    function testAccessibleClick() {
        debug("\nonaccessibleclick support");
        node = document.getElementById("button1");
        axNode = accessibilityController.accessibleElementById("button1");

        // DOM Level 1 event
        receiveDOMLevel1Event = false;
        axNode.syncPress();
        shouldBeTrue("receivedDOMLevel1Event");
        // DOM Level 2 event
        receivedAXEvent = false;
        receivedFallbackEvent = false;
        node.onaccessibleclick = function() {
            accessibleclickCallback();
        };
        node.onclick = function() {
            receivedFallbackEvent = true;
        };
        axNode.syncPress();
        shouldBeTrue("receivedAXEvent");
        shouldBeTrue("receivedFallbackEvent");
    }
    
    function testPreventDefault() {
        debug("\nTest preventDefault");
        node = document.getElementById("button2");
        axNode = accessibilityController.accessibleElementById("button2");
        
        receivedAXEvent = false;
        receivedFallbackEvent = false;
        node.onaccessibleclick = function(evt) {
            receivedAXEvent = true;
            evt.preventDefault();
        };
        node.onclick = function() {
            receivedFallbackEvent = true;
        };
        axNode.syncPress();
        shouldBeTrue("receivedAXEvent");
        shouldBeFalse("receivedFallbackEvent");
    }
    
    function testEventBubbling() {
        debug("\nTest event bubbling");
        node = document.getElementById("p1");
        axNode = accessibilityController.accessibleElementById("button3");

        node.onaccessibleclick = function() {
            receivedAXEvent = true;
        };
        axNode.syncPress();
        shouldBeTrue("receivedAXEvent");
    }

    function testEventCapturingAndBubbling() {
        debug("\nTest event capturing and bubbling");
        var ul = document.getElementById("ul");
        var li = document.getElementById("li");
        var button = document.getElementById("button4");
        axNode = accessibilityController.accessibleElementById("button4");
        
        var seq = [];
        
        // Add event listeners to each layer
        ul.addEventListener("accessibleclick", function() {
            seq.push("AX capture UL");
        }, true);
        ul.addEventListener("accessibleclick", function() {
            seq.push("AX bubble UL");
        }, false);
        li.addEventListener("accessibleclick", function() {
            seq.push("AX capture LI");
        }, true);
        li.addEventListener("accessibleclick", function() {
            seq.push("AX bubble LI");
        }, false);
        button.addEventListener("accessibleclick", function() {
            seq.push("AX main event listener BUTTON");
        }, false);

        axNode.syncPress();
        seq.forEach(function (entry) {
            debug(entry);
        });
    }

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