Bug 243349 – Setting CSP in extension manifest incorrectly blocks image loading

• Component: New Bugs
• Status: NEW

[Michael Flores]

Created attachment 461298 [details]
A repro of the issue. Remove the content_security_policy key in manifest.json and observe that images load correctly (the CSP meta tag is set in public/index.html).

In the manifest.json for my Safari Web Extension, I set a CSP like so:
```
  "content_security_policy": {
    "extension_pages": "img-src https://images.unsplash.com data:; script-src 'self'; object-src 'self';"
  },
```

On Chromium browsers, this correctly allows images from Unsplash to load. On Safari, it blocks these images with this error:

```
Refused to load https://images.unsplash.com/photo-1587830290334-020efdcbc345?crop=entropy&cs=tinysrgb&fit=max&fm=webp&ixid=MnwxNzkyODZ8MHwxfGFsbHx8fHx8fHx8fDE2MTczMjkzMDc&ixlib=rb-1.2.1&q=80&w=400 because it does not appear in the img-src directive of the Content Security Policy.
```

If I use the same CSP value and set it via meta tag instead, it correctly allows Unsplash images while correctly blocking images from other domains not of the `data:` scheme. I.e.:

```
    <meta
      http-equiv="Content-Security-Policy"
      content="img-src https://images.unsplash.com data:; script-src 'self'; object-src 'self';"
    />
```

This seems to point to a bug somewhere, as this CSP should result in the same behavior whether set in the manifest or via meta tag I believe.

[Radar WebKit Bug Importer]

<rdar://problem/97799529>

[Arnoud K]

This also applies to a WebSocket ws: connection from a browser page to localhost.