Fetching

<!-- allowed by 'self' -->
<script src='/js/my_font.js'></script>

<!-- blocked as the domain is not authorized -->
<script src='https://malicious.file.com/hihi.js'></script>

<!-- blocked as inline script is not allowed -->
<script>alert('Hello there');</script>

<!-- blocked as event handlers are not allowed -->
<button onclick="alert('Hello there');">Click me</button>

<!-- allowed by 'self' -->
@font-face {
  font-family: 'MyFont';
  src: url('/fonts/font.ttf');
}

<!-- allowed by https://fonts.gstatic.com -->
@font-face {
  font-family: 'ExternalFont';
  src: url('https://fonts.gstatic.com/fonts/font.ttf');
}

<!-- blocked as the domain is not authorized -->
@font-face {
  font-family: 'MaliciousFont';
  src: url('https://malicious.file.com/font.ttf');
}

<!-- allowed by 'self' -->
<script src='/js/my_font.js'></script>

<!-- allowed by https://example.com -->
<script src='https://example.com/myfont.js'></script>

<!-- allowed by nonce -->
<script nonce='zf48z4fefDOg94qDef5EE6eFqzf15'>alert('Hello there');</script>

<!-- blocked as the domain is not authorized -->
<script src='https://malicious.file.com/hihi.js'></script>

<!-- blocked as inline script is not allowed -->
<script>alert('Hello there');</script>

<!-- blocked as event handlers are not allowed -->
<button onclick="alert('Hello there');">Click me</button>

<!-- allowed by 'sha256-xsuTGwM1pbHxJt6Bcu7KLls/Z+Q7K2yHs6kiFf8OBkA=' -->
<button onclick="alert('Hello')">Click me</button>

<!-- blocked as the hash of the script is not in the directive -->
<button onclick="alert('An other text')">Click me</button>

<!-- allowed by 'self' -->
<script src='/js/app.js'></script>

<!-- allowed by https://example.com -->
<script src='https://example.com/js/library.js'></script>

<!-- blocked as the domain is not authorized -->
<script src='https://malicious.website.com/js/script.js'></script>

<!-- blocked as inline scripts are not allowed -->
<script>alert('Hello');</script>

    <!-- allowed by 'self' -->
    <link rel='stylesheet' href='/css/style.css'>

    <!-- allowed by https://example.com -->
    <link rel='stylesheet' href='https://example.com/css/style.css'>

    <!-- allowed by nonce -->
    <style nonce="2726c7f26c">
      inline-style {background: red;}
    </style>

    <!-- allowed by 'self' -->
    <div style="display:none">Foo</div>

    <!-- blocked as the domain is not authorized -->
    <link href="https://malicious.website.com/styles/main.css" rel="stylesheet" type="text/css" />

    <!-- blocked as the domain is not authorized and no nonce -->
    <style>
      @import url("https://malicious.website.com/styles/sheet.css") ;
    </style>

    <!-- blocked as the domain is not authorized -->
    <link> href="https://malicious.website.com/styles/stylesheet.css" rel="stylesheet" type="text/css" />

<!-- allowed by hash -->
<p style="color: red;">Red text</p>

<!-- blocked as no 'unsafe-inline' and hash doesn't match -->
<span style="font-weight: bold;">Bold text</span>

<!-- allowed by 'self' -->
<link rel="stylesheet" href="/styles/main.css">

<!-- allowed by nonce -->
<style nonce="2726c7f26c">body {background-color: #f0f0f0;}</style>

<!-- allowed by cdn.example.com -->
<link rel="stylesheet" href="https://cdn.example.com/framework.css">

<!-- blocked as no 'unsafe-inline' and no matching nonce -->
<style>p {color: red;}</style>

<!-- blocked as domain not in allowed list -->
<link rel="stylesheet" href="https://cdn.otherdomain.com/styles.css">

<!-- allowed by mypolicy1 mypolicy2 'allow-duplicates' -->
<script>
  const policyFoo = trustedTypes.createPolicy('mypolicy1'', {});
  const policyFoo = trustedTypes.createPolicy('mypolicy1', {});
  const policyFoo = trustedTypes.createPolicy('mypolicy2', {});
</script>

<!-- blocked as the policy name is not allowed -->
<script>
  const policyFoo = trustedTypes.createPolicy(''mypolicy3'', {});
</script>

<!-- allowed by 'self' -->
<img src='/images/logo.png'>

<!-- allowed by 'self' -->
<link rel='icon' href='/favicon.ico'>

<!-- allowed by https://example.com -->
<link rel='icon' href='https://example.com/favicon.ico'>

<!-- blocked as the domain is not authorized -->
<img src='https://malicious.file.com/logo.png'>

<!-- blocked as the domain is not authorized -->
<link rel='icon' href='https://malicious.file.com/favicon.ico'>

<!-- allowed by 'self' -->
<iframe src="/local-frame.html"></iframe>

<!-- allowed by https://example.com -->
<iframe src="https://example.com/external-frame.html"></iframe>

<!-- allowed by 'self' -->
<script>
  var worker = new Worker('/js/worker.js');
</script>

<!-- blocked as https://malicious.website.com is not in the allowed sources -->
<iframe src="https://malicious.website.com"></iframe>

<!-- blocked as data: URI is not allowed -->
<script>
  var blockedWorker = new Worker("data:application/JavaScript, ...");
</script>

<!-- allowed by 'self' -->
<link rel="manifest" href="/manifest.json">

<!-- allowed by https://example.com -->
<link rel="manifest" href="https://example.com/manifest.json">

<!-- blocked as the domain is not authorized -->
<link rel="manifest" href="https://malicious.website.com/manifest.json">

<!-- allowed by 'self' -->
<video src='/video.mp4'></video>

<!-- allowed by https://example.com -->
<video src='https://example.com/video.mp4'></video>

<!-- allowed by 'self' -->
<audio src='/audio.mp3'></audio>

<!-- allowed by https://example.com -->
<audio src='https://example.com/audio.mp3'>
    <track kind='subtitles' src='https://example.com/captions.vtt' srclang='en'>
</audio>

<!-- blocked as the domain is not authorized -->
<video src='https://malicious.file.com/video.mp4'></video>

<!-- blocked as the domain is not authorized -->
<audio src='https://unauthorized.com/audio.mp3'></audio>

<!-- blocked as the domain is not authorized -->
<audio src='/audio.mp3'>
    <track kind='subtitles' src='https://unauthorized.com/captions.vtt' srclang='en'>
</audio>

<!-- allowed by 'self' -->
<object data='/js/my_font.js'></object>

<!-- allowed by https://example.com -->
<object data='https://example.com/myfont.js'></object>

<!-- blocked as the domain is not authorized -->
<embed src="https://malicious.website.com/flash"></embed>

<!-- blocked as the domain is not authorized -->
<object data="https://malicious.website.com/plugin"></object>

<!-- blocked as the domain is not authorized -->
<applet archive="https://malicious.website.com/java"></applet>

<!-- allowed by 'self' -->
<a href='/page.html'>Page</a>

<!-- allowed by https://example.com -->
<a href='https://example.com/page.html'>Page</a>

<!-- blocked as https://malicious.website.com is not in the allowed sources -->
<a ping='https://malicious.website.com'>Page</a>

<!-- blocked -->
<script>
 var xhr = new XMLHttpRequest();
 xhr.open('GET', 'https://malicious.website.com/');
 xhr.send();

 <!-- blocked -->
 var ws = new WebSocket('https://malicious.website.com/');

 <!-- blocked -->
 var es = new EventSource('https://malicious.website.com/');

 <!-- blocked -->
 navigator.sendBeacon('https://malicious.website.com/', {...});
</script>

<!-- allowed by application/x-java-applet -->
<object type='application/x-java-applet' data='/java/player.class'></object>

<!-- blocked as application/x-shockwave-flash is not allowed -->
<object type='application/x-shockwave-flash' data='/flash/player.swf'></object>

<!-- allowed by 'self' -->
<link rel='prefetch' href='/js/my_font.js'>

<!-- blocked as https://malicious.website.com is not in the allowed sources -->
<link rel='prefetch' href='https://malicious.website.com/js/my_font.js'>

<!-- allowed by 'self' -->
<iframe src='/iframe.html'></iframe>

<!-- allowed by https://example.com -->
<iframe src='https://example.com/iframe.html'></iframe>

<!-- blocked as https://malicious.website.com is not in the allowed sources -->
<iframe src='https://malicious.website.com/iframe.html'></iframe>

<!-- allowed by 'self' -->
<script>
  var fencedFrame = document.createElement('fencedframe');
</script>

<!-- allowed by https://example.com -->
<script>
  var fencedFrame = document.createElement('fencedframe');
  fencedFrame.src = 'https://example.com/fenced-frame.html';
</script>

<!-- blocked as data: URI is not allowed -->
<script>
  var blockedFencedFrame = document.createElement('fencedframe');
  blockedFencedFrame.src = 'data:application/JavaScript, ...';
</script>

<!-- blocked as https://malicious.website.com is not in the allowed sources -->
<script>
  var blockedFencedFrame = document.createElement('fencedframe');
  blockedFencedFrame.src = 'https://malicious.website.com/fenced-frame.html';
</script>

<!-- allowed by 'self' -->
<script>
  var worker = new Worker('/js/worker.js');
</script>

<!-- allowed by https://example.com -->
<script>
  var sharedWorker = new SharedWorker('https://example.com/shared-worker.js');
</script>

<!-- allowed by 'self' -->
<script>
  navigator.serviceWorker.register('/service-worker.js');
</script>

<!-- blocked as data: URI is not allowed -->
<script>
  var blockedWorker = new Worker("data:application/JavaScript, ...");
</script>

<!-- blocked as https://malicious.website.com is not in the allowed sources -->
<script>
  blockedWorker = new SharedWorker("https://malicious.website.com/");
</script>

<!-- blocked as https://malicious.website.com is not in the allowed sources -->
<script>
  navigator.serviceWorker.register('https://malicious.website.com/sw.js');
</script>