[staging] VS Code simple-browser layout is broken in Firefox

[jankeromnes]

Bug description

When you open the VS Code mini-browser in Firefox, its layout appears broken in staging, while it looks fine in production. Also, it looks fine in Chrome in both staging and production, so this is Firefox-specific.

Staging (broken)

Production (works)

Steps to reproduce

1. Open https://github.com/techwithtim/NEAT-Flappy-Bird in staging

Or,

1. Run python3 -m http.server 1337 in a staging workspace, then open port 1337 in a preview

Expected behavior

No response

Example repository

No response

Anything else?

No response

[JanKoehnlein]

Looks like main.css and codicon.css from the webview cannot be loaded in FF due to CSP:

Content Security Policy: The page’s settings blocked the loading of a resource at https://vscode-remote+rose-mouse-braatohu.ws-eu06.gitpod-staging.com.vscode-resource.vscode-webview.net/ide/extensions/simple-browser/media/codicon.css (“style-src”). node.js:604:16
...
Content Security Policy: The page’s settings blocked the loading of a resource at https://vscode-remote+rose-mouse-braatohu.ws-eu06.gitpod-staging.com.vscode-resource.vscode-webview.net/ide/extensions/simple-browser/media/main.css (“style-src”). node.js:604:16

[akosyakov]

I think it is a bug in FF, CSP is correct: *.vscode-webview.net meaning vscode-webview.net and its subdomains. vscode-remote+rose-mouse-braatohu.ws-eu06.gitpod-staging.com.vscode-resource.vscode-webview.net should match it, but some reason it is not.

[akosyakov]

It works if the parent domain of service worker is matching to the parent domain of webview resources. I will have to hack a bit internals of VS Code Web for it, otherwise they hardcode vscode-webview.net which is managed by MS and used to serve webview bootstrap code.

[akosyakov]

We decided to rewrite vscode-webview.net in the blobserve.

[csweichel]

solved in #4666