<!DOCTYPE html>
<html>
<head>
<script src="../../../resources/js-test-pre.js"></script>
<script src="resources/shadow-dom.js"></script>
</head>
<body>
<p>This tests that pressing Tab key should traverse into iframe and shadow tree, and pressing Shift-Tab should reverse the order.</p>
<pre id="console"></pre>
<script>
function createTextInputElement(doc, id, tabIndex) {
    var input = doc.createElement('input');
    input.type = 'text';
    input.id = id;
    input.tabIndex = tabIndex;
    return input;
}

if (window.testRunner) {
    testRunner.dumpAsText();
    var doc = document;

    doc.body.appendChild(createTextInputElement(doc, 'input-01', 1));
    doc.body.appendChild(createTextInputElement(doc, 'input-02', 0));

    function addShadowHost(doc) {
        var shadowHost = doc.createElement('p');
        shadowHost.id = 'host-01';
        shadowHost.tabIndex = -1;
        var shadow = internals.ensureShadowRoot(shadowHost);
        doc.body.appendChild(shadowHost);
        shadow.appendChild(createTextInputElement(doc, 'input-03', 0));
    }
    addShadowHost(doc);

    doc.body.appendChild(createTextInputElement(doc, 'input-04', 0));

    function addIframe(doc) {
        var iframe = doc.createElement('iframe');
        iframe.id = 'iframe';
        doc.body.appendChild(iframe);
        doc = iframe.contentDocument;

        doc.body.appendChild(createTextInputElement(doc, 'input-05', 0));
        doc.body.appendChild(createTextInputElement(doc, 'input-06', 1));
        doc.body.appendChild(createTextInputElement(doc, 'input-07', -1));

        function addShadowHost(doc) {
            var shadowHost = doc.createElement('p');
            shadowHost.id = 'host-02';
            shadowHost.tabIndex = 1;
            var shadow = internals.ensureShadowRoot(shadowHost);
            doc.body.appendChild(shadowHost);

            shadow.appendChild(createTextInputElement(doc, 'input-08', 0));
            shadow.appendChild(createTextInputElement(doc, 'input-09', 1));
            shadow.appendChild(createTextInputElement(doc, 'input-10', -1));
        }
        addShadowHost(doc);

        doc.body.appendChild(createTextInputElement(doc, 'input-11', 2));
        doc.body.appendChild(createTextInputElement(doc, 'input-12', 1));
    }
    addIframe(doc);

    doc.body.appendChild(createTextInputElement(doc, 'input-13', 1));
    doc.body.appendChild(createTextInputElement(doc, 'input-14', 0));
    doc.body.appendChild(createTextInputElement(doc, 'input-15', 2));

    testFocusNavigationFowrad([
        'input-01',
        'input-13',
        'input-15',
        'input-02',
        'host-01/input-03',
        'input-04',
        'iframe/input-06',
        'iframe/host-02',
        'iframe/host-02/input-09',
        'iframe/host-02/input-08',
        'iframe/input-12',
        'iframe/input-11',
        'iframe/input-05',
        'input-14',
    ]);

    testFocusNavigationBackward([
        'input-14',
        'iframe/input-05',
        'iframe/input-11',
        'iframe/input-12',
        'iframe/host-02/input-08',
        'iframe/host-02/input-09',
        'iframe/host-02',
        'iframe/input-06',
        'input-04',
        'host-01/input-03',
        'input-02',
        'input-15',
        'input-13',
        'input-01',
    ]);

   log('\nTest finished.');
}
</script>
</body>
</html>