Refined-github: `embed-gist-inline` fails

[fregante]

Gists fail to load due to CSP

Live example

https://gist.github.com/sompylasar/99b5d307da3168b833c1119fb95caf11

Screenshot

[dotconnor]

Looks like this is an issue when Chrome instead. Firefox blocks the request because of CSP. Chrome, however, allows it, but it seems as though it only allows the request when it is executed in an extension context only.

Relevant Error from Firefox:

Content Security Policy: The page’s settings blocked the loading of a resource at https://gist.github.com/sompylasar/99b5d307da3168b833c1119fb95caf11.json (“connect-src”).
TypeError: NetworkError when attempting to fetch resource.

TypeError: "NetworkError when attempting to fetch resource."
    embedGist embed-gist-inline.tsx:20
    embed_gist_inline_init embed-gist-inline.tsx:49
    features_run features.tsx:124
    add features.tsx:192
    onAjaxedPages features.tsx:59
    onAjaxedPagesRaw features.tsx:53
    onAjaxedPages features.tsx:57
    add features.tsx:192
    ts embed-gist-inline.tsx:52

Github's connect-src policy for reference:

'self'
uploads.github.com
www.githubstatus.com
collector.githubapp.com
api.github.com
www.google-analytics.com
github-cloud.s3.amazonaws.com github-production-repository-file-5c1aeb.s3.amazonaws.com
github-production-upload-manifest-file-7fdce7.s3.amazonaws.com
github-production-user-asset-6210df.s3.amazonaws.com
wss://live.github.com

[fregante]

We had this issue before, it may be worth finding the bugzilla page to see the status of this limitation and if they’re gonna fix it soon. It’s probably not worth setting up messaging with background.js just for this

[fregante]

This is a weird bug because technically "Content script requests happen in the context of extension, not content page" in Firefox, but then the content page's CSP applies to said requests. The worst of both worlds.

Perhaps the solution is to add a CSP to the extension itself, but I don't think that's currently possible

[yakov116]

This no longer works in chrome

[fregante]

Fixing this means setting up a proxy through background.ts. Worth it or drop it?

[yakov116]

@fregante I think worth it. It was a really good feature.

[fregante]

You can probably copy: https://github.com/npmhub/npmhub/blob/53364f49d23cf6f0f6aec3dd32f44105eb57edf5/source/background.js#L32-L48

Except it needs to be adjusted to use browser.* APIs