Consider the following code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="content-security-policy" content="frame-src 'self';" />
<title>Outer!</title>
</head>
<body>
<p>Outer</p>
<iframe srcdoc="<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Middle in srcdoc</title>
</head>
<body>
<p>Middle</p>
<iframe src="inner.html"></iframe>
</body>
</html>"></iframe>
</body>
</html>
and
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Inner</title>
</head>
<body>Inner</body>
</html>
Set both on the same server, port etc. Now we have an iframe. This contains page via srcdoc, and that one does contain another page via normal src-aatribute. The middle page inherits correctly the CSP from the outer page. In chrome we see all three layers, but in firefox the inner gets blocked by CSP. Apparently it does not know what 'self' is anymore. This seems to be a almost a bug in firefox or at least a strange quirk. Any ideas how to handle this?