<!DOCTYPE HTML>
<html>

<head>
    <meta http-equiv="Content-Security-Policy" content="base-uri {{location[scheme]}}://{{domains[]}}:{{ports[http][0]}}/base/">

    <title>base-uri works correctly inside a sandboxed iframe.</title>
    <script src='/resources/testharness.js'></script>
    <script src='/resources/testharnessreport.js'></script>
</head>

<body>
    <h1>self is derived correctly inside inside a sandboxed iframe.</h1>
    <div id='log'></div>

    <script>
        window.addEventListener('securitypolicyviolation', function(e) {
            assert_unreached('No CSP violation report should have been fired.');
        });

        async_test(function(t) {
            var i = document.createElement('iframe');
            i.sandbox = 'allow-scripts';
            i.style.display = 'none';
            i.srcdoc = `
              <meta http-equiv="Content-Security-Policy" content="img-src 'self'">
              <body>
              <script>

              var img = document.createElement('img');
              img.src = '../support/fail.png';
              img.onerror = function() {
                top.postMessage('FAIL', '*');
              };
              img.onload = function() {
                top.postMessage('PASS', '*');
              };
              document.body.appendChild(img);
              </sc` + `ript></body>`;

            window.addEventListener('message', t.step_func(function(e) {
              if (e.source === i.contentWindow) {
                assert_equals(e.data, 'PASS');
                t.done();
              }
            }));

            document.body.appendChild(i);
        }, 'img-src \'self\' works when specified in a meta tag.');
   </script>

</body>

</html>