Fix importmap reload issue by inlining importmap in production bu…

…ilds. (#5808)
posit-dev · Dec 18, 2024 · 4ea5c56 · 4ea5c56
1 parent 381d39b
commit 4ea5c56
Show file tree

Hide file tree

Showing 6 changed files with 15 additions and 106 deletions.
diff --git a/build/gulpfile.vscode.js b/build/gulpfile.vscode.js
@@ -336,7 +336,6 @@ function packageTask(platform, arch, sourceFolderName, destinationFolderName, op
 		// --- Start Positron ---
 
 		// External modules (React, etc.)
-		const externalModules = gulp.src('out-build/bootstrap-external.js').pipe(rename('out/bootstrap-external.js'));
 		const moduleSources = gulp.src('src/esm-package-dependencies/**').pipe(rename(function (p) { p.dirname = path.join('out', 'esm-package-dependencies', p.dirname) }));
 
 		// Positron API
@@ -408,7 +407,6 @@ function packageTask(platform, arch, sourceFolderName, destinationFolderName, op
 			// --- Start Positron ---
 			positronApi,
 			quarto,
-			externalModules,
 			moduleSources,
 			// --- End Positron ---
 			telemetry,

diff --git a/build/secrets/.secrets.baseline b/build/secrets/.secrets.baseline
@@ -637,16 +637,6 @@
         "is_secret": false
       }
     ],
-    "src/bootstrap-external.ts": [
-      {
-        "type": "Hex High Entropy String",
-        "filename": "src/bootstrap-external.ts",
-        "hashed_secret": "b6cb3f02e20180320687f4905a9c795d72e0ad3a",
-        "is_verified": false,
-        "line_number": 72,
-        "is_secret": false
-      }
-    ],
     "src/bootstrap-window.ts": [
       {
         "type": "Hex High Entropy String",

diff --git a/src/bootstrap-external.ts b/src/bootstrap-external.ts
diff --git a/src/bootstrap-window.ts b/src/bootstrap-window.ts
@@ -235,8 +235,8 @@
 		if (Array.isArray(configuration.cssModules) && configuration.cssModules.length > 0) {
 
 			// Create import maps for React and other dependencies. This is for
-			// development mode only; for release builds, import maps are
-			// loaded earlier, in bootstrap-external.js.
+			// development mode only; for release builds, the importmap is inlined
+			// in workbench.html.
 			const style = document.createElement('style');
 			style.type = 'text/css';
 			style.media = 'screen';
@@ -257,12 +257,6 @@
 			addModule('react-dom/client');
 			addModule('react-window');
 
-			// importMap.imports['he'] = new URL('https://esm.sh/he').href;
-			// importMap.imports['react'] = new URL('https://esm.sh/react').href;
-			// importMap.imports['react-dom'] = new URL('https://esm.sh/react-dom').href;
-			// importMap.imports['react-dom/client'] = new URL('https://esm.sh/react-dom/client').href;
-			// importMap.imports['react-window'] = new URL('https://esm.sh/react-window').href;
-
 			// DEV ---------------------------------------------------------------------------------------
 			// DEV: This is for development and enables loading CSS via import-statements via import-maps.
 			// DEV: For each CSS modules that we have we defined an entry in the import map that maps to

diff --git a/src/tsec.exemptions.json b/src/tsec.exemptions.json
@@ -14,7 +14,6 @@
 		"vs/workbench/services/keybinding/test/node/keyboardMapperTestUtils.ts"
 	],
 	"ban-trustedtypes-createpolicy": [
-		"bootstrap-external.ts",
 		"bootstrap-window.ts",
 		"vs/amdX.ts",
 		"vs/base/browser/trustedTypes.ts",
@@ -42,7 +41,6 @@
 		"**/*.ts"
 	],
 	"ban-script-content-assignments": [
-		"bootstrap-external.ts",
 		"bootstrap-window.ts"
 	]
 }
diff --git a/src/vs/code/electron-sandbox/workbench/workbench.html b/src/vs/code/electron-sandbox/workbench/workbench.html
@@ -28,7 +28,7 @@
 					'self'
 					'unsafe-eval'
 					blob:
-					'nonce-0c6a828f1297'
+					'nonce-84405825-c9a7-4d5e-beac-4e5aaf0329f3'
 				;
 				style-src
 					'self'
@@ -66,6 +66,18 @@
 				;
 		"/>
 
+        <script type="importmap" nonce="84405825-c9a7-4d5e-beac-4e5aaf0329f3">
+            {
+                "imports": {
+                    "he": "../../../../esm-package-dependencies/he.js",
+                    "react": "../../../../esm-package-dependencies/react.js",
+                    "react-dom": "../../../../esm-package-dependencies/react-dom.js",
+                    "react-dom/client": "../../../../esm-package-dependencies/client.js",
+                    "react-window": "../../../../esm-package-dependencies/react-window.js"
+                }
+            }
+        </script>
+
 		<!-- Workbench CSS -->
 		<link rel="stylesheet" href="../../../workbench/workbench.desktop.main.css">
 	</head>
@@ -74,9 +86,5 @@
 	</body>
 
 	<!-- Startup (do not modify order of script tags!) -->
-	<!-- Start Positron --->
-	<!-- This script loads external ESM resources, such as React. -->
-	<script src="../../../../bootstrap-external.js"></script>
-	<!-- End Positron --->
 	<script src="./workbench.js" type="module"></script>
 </html>