<!DOCTYPE html>
<script src='../../resources/testharness.js'></script>
<script src='../../resources/testharnessreport.js'></script>
<script src='../resources/shadow-dom.js'></script>

<div id='host'>
  <template data-mode='v0'>
    <content></content>
  </template>
  <div id='hostV1'>
    <template data-mode='open'>
      <div id='hostV1inV1'>
        <template data-mode='open'>
           <div id='hostV0inV1inV1'>
             <template data-mode='v0'>
               <canvas></canvas>
             </template>
           </div>
        </template>
      </div>
    </template>
  </div>
</div>

<script>
async_test((test) => {
    document.onpointerlockerror = test.unreached_func('onpointerlockerror is not expected.');

    document.onpointerlockchange = test.step_func(() => {
        // Not interested in handling before or after exitPointerLock.
        if (document.pointerLockElement === null)
            return;

        assert_equals(document.pointerLockElement, canvas, 'if it is in V0 shadow, return as it is.');
        assert_equals(host.shadowRoot.pointerLockElement, null);
        assert_equals(hostV1.shadowRoot.pointerLockElement, hostV1inV1)
        assert_equals(hostV1inV1.shadowRoot.pointerLockElement, canvas);
        assert_equals(hostV0inV1inV1.shadowRoot.pointerLockElement, null);

        document.exitPointerLock();
        test.done();
    });

    convertTemplatesToShadowRootsWithin(host);
    var hostV1inV1 = hostV1.shadowRoot.querySelector('#hostV1inV1');
    var hostV0inV1inV1 = hostV1inV1.shadowRoot.querySelector('#hostV0inV1inV1');

    test.step(() => {
        assert_equals(document.pointerLockElement, null);
        assert_equals(host.shadowRoot.pointerLockElement, null);
        assert_equals(hostV1.shadowRoot.pointerLockElement, null);
        assert_equals(hostV1inV1.shadowRoot.pointerLockElement, null);
        assert_equals(hostV0inV1inV1.shadowRoot.pointerLockElement, null);
    });

    var canvas = hostV0inV1inV1.shadowRoot.querySelector('canvas');
    canvas.requestPointerLock();
}, 'Test for pointerLockElement adjustment for Shadow DOM V0/V1 combination.');
</script>