<!DOCTYPE html>
<html>
  <head>
    <script src='/common/media.js'></script>
    <script src='/resources/testharness.js'></script>
    <script src='/resources/testharnessreport.js'></script>
    <script src="/resources/testdriver.js"></script>
    <script src="/resources/testdriver-vendor.js"></script>
    <script src='../resources/picture-in-picture.js'></script>
  </head>
  <body>
    <script>
const check_report_format = (reports, observer) => {
  const report = reports[0];
  assert_equals(report.type, "permissions-policy-violation");
  assert_equals(report.url, document.location.href);
  assert_equals(report.body.featureId, "picture-in-picture");
  assert_equals(report.body.sourceFile, document.location.href);
  assert_equals(typeof report.body.lineNumber, "number");
  assert_equals(typeof report.body.columnNumber, "number");
  assert_equals(report.body.disposition, "enforce");
};

const loadVideo = () => new Promise(resolve => {
    const video = document.createElement('video');
    video.src = getVideoURI('/media/movie_5');
    video.addEventListener('loadedmetadata', () => {
      resolve(video);
    }, { once: true });
});

promise_pip_test(async (t) => {
  const report = new Promise(resolve => {
    new ReportingObserver((reports, observer) => resolve([reports, observer]),
                          {types: ['permissions-policy-violation']}).observe();
  });
  const videoElement = await loadVideo();
  await test_driver.bless('picture-in-picture');
  await promise_rejects_dom(t, 'SecurityError', videoElement.requestPictureInPicture(),
                        "Picture-in-Picture should not be allowed in this document.");
  const [reports, observer] = await report;
  check_report_format(reports, observer);
}, "Picture-in-Picture Report Format");
    </script>
  </body>
</html>
