<!DOCTYPE html>
<html>
  <head>
    <title>VRDisplay Canvas2D</title>
    <meta name="timeout" content="long"/>
    <meta http-equiv="Content-type" content="text/html;charset=UTF-8">
    <script src="/resources/testharness.js"></script>
    <script src="/resources/testharnessreport.js"></script>
    <script src="VRSimulationDriver.js"></script>
    <script src="runVRTest.js"></script>
  </head>
  <body>
    <script>
      "use strict";
      var vrDisplay;

      function requestPresentTest() {
        async_test(function (test) {
          vrDisplay.requestAnimationFrame(callback);

          function callback() {
            vrDisplay.resetPose();
            vrDisplay.getLayers();
            vrDisplay.submitFrame();
            vrDisplay.getEyeParameters("right");
            test.done();
          }
        }, "Finish WebVR Canvas2D requestPresentTest.");
      }

      function startTest() {
        promise_test((test) => {
          var canvas = document.createElement('canvas');
          (document.body || document.documentElement).appendChild(canvas);
          var context = canvas.getContext('2d');
          var img = document.createElement('img');
          img.src = "data:image/gif;base64,R0lGODlhAQABAAAAACw=";

          return VRSimulationDriver.AttachWebVRDisplay().then(() => {
            return navigator.getVRDisplays().then((displays) => {
              assert_equals(displays.length, 1, "displays.length must be one after attach.");
              vrDisplay = displays[0];
              var frameData = new VRFrameData();
              return vrDisplay.requestPresent([{source: canvas}]).then(() => {
                requestPresentTest();
              });
            });
          });
        }, "Finish running WebVR Canvas2D test.");
      }

      runVRTest(startTest);
    </script>
  </body>
</html>
