<!DOCTYPE html>

<link rel="author" href="mtrzos@google.com" title="Maciek Trzos">
<script src=/resources/testharness.js></script>
<script src=/resources/testharnessreport.js></script>
<script src=/fetch/metadata/resources/helper.js></script>
<script src=/common/utils.js></script>
<body>
</body>
<script>
  let nonce = token();

  function createVideoElement() {
    let el = document.createElement('video');
    el.src = "/media/movie_5.mp4";
    el.setAttribute("controls", "");
    el.setAttribute("crossorigin", "");
    return el;
  }

  function createTrack() {
    let el = document.createElement("track");
    el.setAttribute("default", "");
    el.setAttribute("kind", "captions");
    el.setAttribute("srclang", "en");
    return el;
  }

  promise_test(t => {
    return new Promise((resolve, reject) => {
      let key = "track-same-origin" + nonce;
      let video = createVideoElement();
      let el = createTrack();
      el.src = "https://{{host}}:{{ports[https][0]}}/fetch/metadata/resources/record-header.py?file=" + key;
      el.onload = t.step_func(_ => {
        expected = {
          "site": "same-origin",
          "user": "",
          "mode": "cors", // Because the `video` element has `crossorigin`
          "dest": "track"
        };
        validate_expectations(key, expected, "Same-Origin track")
            .then(_ => resolve());
      });
      video.appendChild(el);
      document.body.appendChild(video);
    });
  }, "Same-Origin track");

  promise_test(t => {
    return new Promise((resolve, reject) => {
      let key = "track-same-site" + nonce;
      let video = createVideoElement();
      let el = createTrack();
      el.src = "https://{{hosts[][www]}}:{{ports[https][0]}}/fetch/metadata/resources/record-header.py?file=" + key;
      el.onload = t.step_func(_ => {
        expected = {
          "site": "same-site",
          "user": "",
          "mode": "cors", // Because the `video` element has `crossorigin`
          "dest": "track"
        };
        validate_expectations(key, expected, "Same-Site track")
            .then(resolve)
            .catch(reject);

      });
      video.appendChild(el);
      document.body.appendChild(video);
    });
  }, "Same-Site track");

  promise_test(t => {
    return new Promise((resolve, reject) => {
      let key = "track-cross-site" + nonce;
      let video = createVideoElement();
      let el = createTrack();
      el.src = "https://{{hosts[alt][www]}}:{{ports[https][0]}}/fetch/metadata/resources/record-header.py?file=" + key;
      el.onload = t.step_func(_ => {
        expected = {
          "site": "cross-site",
          "user": "",
          "mode": "cors", // Because the `video` element has `crossorigin`
          "dest": "track"
        };
        validate_expectations(key, expected,"Cross-Site track")
            .then(resolve)
            .catch(reject);
      });
      video.appendChild(el);
      document.body.appendChild(video);
    });
  }, "Cross-Site track");

  promise_test(t => {
    return new Promise((resolve, reject) => {
      let key = "track-same-origin-cors" + nonce;
      let video = createVideoElement();

      // Unset `crossorigin` to change the CORS mode:
      video.crossOrigin = undefined;

      let el = createTrack();
      el.src = "https://{{host}}:{{ports[https][0]}}/fetch/metadata/resources/record-header.py?file=" + key;
      el.onload = t.step_func(_ => {
        expected = {
          "site":"same-origin",
          "user":"",
          "mode": "same-origin",
          "dest": "track"
        };
        validate_expectations(key, expected, "Same-Origin, CORS track")
            .then(_ => resolve());
      });
      video.appendChild(el);
      document.body.appendChild(video);
    });
  }, "Same-Origin, CORS track");
</script>