<script>
if (window.testRunner) {
    testRunner.dumpAsText();
    testRunner.waitUntilDone();
}

function log(msg)
{
    let p = document.createElement("p");
    p.textContent = msg;
    document.body.appendChild(p);
}

function runTest()
{
    log("We should see three changed events.");

    let changedEventsSeen = 0;

    let handleChangedEvent = (event) => {
        log("Saw webglcontextchanged event.");
        let gl = event.target.getContext("webgl");
        gl.clearColor(0, 1, 0, 1);
        gl.clear(gl.COLOR_BUFFER_BIT);
        changedEventsSeen++;
        if (changedEventsSeen == 3) {
            if (window.testRunner)
                testRunner.notifyDone();
            else
                log("Test done.");
        }
    }

    document.querySelectorAll("canvas").forEach((c) =>
    {
        c.addEventListener("webglcontextchanged", handleChangedEvent, false);
        let gl = c.getContext("webgl");
        gl.clearColor(1, 0, 0, 1);
        gl.clear(gl.COLOR_BUFFER_BIT);
    });

    document.querySelectorAll("canvas").forEach((c) => {
        let gl = c.getContext("webgl");
        if (window.internals)
            window.internals.simulateEventForWebGLContext("ContextChange", gl);
    });
    if (!window.internals)
        log("To run the test, trigger a GPU change manually.");
}


window.addEventListener("load", runTest, false);
</script>

<canvas></canvas>
<canvas></canvas>
<canvas></canvas>