webview.diff

Serve webviews from the same origin

Normally webviews are served from vscode-webview.net but we would rather them be
self-hosted.

When doing this CSP will block resources (for example when viewing images) so
add 'self' to the CSP to fix that.

Additionally the service worker defaults to always trying to handle any requests
made to the current host but this will include the webview HTML itself which
means these requests will fail since the communication channel between the
webview and the main thread has not been set up yet so patch the service worker
to skip handling requests for other webview assets.

To test, open a few types of webviews (images, markdown, extension details, etc).

Index: code-server/lib/vscode/src/vs/workbench/services/environment/browser/environmentService.ts
===================================================================
--- code-server.orig/lib/vscode/src/vs/workbench/services/environment/browser/environmentService.ts
+++ code-server/lib/vscode/src/vs/workbench/services/environment/browser/environmentService.ts
@@ -176,7 +176,7 @@ export class BrowserWorkbenchEnvironment
 
 	@memoize
 	get webviewExternalEndpoint(): string {
-		const endpoint = this.options.webviewEndpoint
+		const endpoint = (this.options.webviewEndpoint && new URL(this.options.webviewEndpoint, window.location.toString()).toString())
 			|| this.productService.webviewContentExternalBaseUrlTemplate
 			|| 'https://{{uuid}}.vscode-webview.net/{{quality}}/{{commit}}/out/vs/workbench/contrib/webview/browser/pre/';
 
Index: code-server/lib/vscode/src/vs/server/node/webClientServer.ts
===================================================================
--- code-server.orig/lib/vscode/src/vs/server/node/webClientServer.ts
+++ code-server/lib/vscode/src/vs/server/node/webClientServer.ts
@@ -280,6 +280,7 @@ export class WebClientServer {
 		const data = (await util.promisify(fs.readFile)(filePath)).toString()
 			.replace('{{WORKBENCH_WEB_CONFIGURATION}}', escapeAttribute(JSON.stringify({
 				remoteAuthority,
+				webviewEndpoint: vscodeBase + '/static/out/vs/workbench/contrib/webview/browser/pre',
 				_wrapWebWorkerExtHostInIframe,
 				developmentOptions: { enableSmokeTestDriver: this._environmentService.driverHandle === 'web' ? true : undefined },
 				settingsSyncOptions: !this._environmentService.isBuilt && this._environmentService.args['enable-sync'] ? { enabled: true } : undefined,
Index: code-server/lib/vscode/src/vs/workbench/common/webview.ts
===================================================================
--- code-server.orig/lib/vscode/src/vs/workbench/common/webview.ts
+++ code-server/lib/vscode/src/vs/workbench/common/webview.ts
@@ -24,7 +24,7 @@ export const webviewResourceBaseHost = '
 
 export const webviewRootResourceAuthority = `vscode-resource.${webviewResourceBaseHost}`;
 
-export const webviewGenericCspSource = `https://*.${webviewResourceBaseHost}`;
+export const webviewGenericCspSource = `'self' https://*.${webviewResourceBaseHost}`;
 
 /**
  * Construct a uri that can load resources inside a webview
Index: code-server/lib/vscode/src/vs/workbench/contrib/webview/browser/pre/service-worker.js
===================================================================
--- code-server.orig/lib/vscode/src/vs/workbench/contrib/webview/browser/pre/service-worker.js
+++ code-server/lib/vscode/src/vs/workbench/contrib/webview/browser/pre/service-worker.js
@@ -188,9 +188,12 @@ sw.addEventListener('fetch', (event) =>
 		}
 	}
 
-	// If we're making a request against the remote authority, we want to go
-	// back through VS Code itself so that we are authenticated properly
-	if (requestUrl.host === remoteAuthority) {
+	// If we're making a request against the remote authority, we want to go back
+	// through VS Code itself so that we are authenticated properly.  Requests to
+	// other static assets in this directory (like the iframe HTML) must be
+	// fetched normally since there will not yet be a communication channel set up
+	// to retrieve them (they do not require authentication anyway).
+	if (requestUrl.host === remoteAuthority && !requestUrl.pathname.startsWith(rootPath)) {
 		switch (event.request.method) {
 			case 'GET':
 			case 'HEAD':