feat(sanity): add Core UI bridge script (#8523)

Co-authored-by: Josh <[email protected]>
sanity-io · Feb 11, 2025 · 8e1ed89 · 8e1ed89
1 parent 824c791
commit 8e1ed89
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 22 deletions.
diff --git a/packages/sanity/src/_internal/cli/server/renderDocument.tsx b/packages/sanity/src/_internal/cli/server/renderDocument.tsx
@@ -119,6 +119,18 @@ export function decorateIndexWithAutoGeneratedWarning(template: string): string
   return template.replace(/<head/, `\n<!--\n${autoGeneratedWarning}\n-->\n<head`)
 }
 
+/**
+ * Decorates the given HTML template with a script
+ * tag that loads the bridge component to communicate
+ * with core-ui.
+ */
+export function decorateIndexWithBridgeScript(template: string): string {
+  return template.replace(
+    '</head>',
+    '<script src="https://core.sanity-cdn.com/bridge.js" async type="module"></script>\n</head>',
+  )
+}
+
 export function getPossibleDocumentComponentLocations(studioRootPath: string): string[] {
   return [path.join(studioRootPath, '_document.js'), path.join(studioRootPath, '_document.tsx')]
 }

diff --git a/packages/sanity/src/_internal/cli/server/runtime.ts b/packages/sanity/src/_internal/cli/server/runtime.ts
@@ -7,6 +7,7 @@ import {debug as serverDebug} from './debug'
 import {getEntryModule} from './getEntryModule'
 import {
   decorateIndexWithAutoGeneratedWarning,
+  decorateIndexWithBridgeScript,
   getPossibleDocumentComponentLocations,
   renderDocument,
 } from './renderDocument'
@@ -48,16 +49,18 @@ export async function writeSanityRuntime({
 
   async function renderAndWriteDocument() {
     debug('Rendering document template')
-    const indexHtml = decorateIndexWithAutoGeneratedWarning(
-      await renderDocument({
-        studioRootPath: cwd,
-        monorepo,
-        props: {
-          entryPath: `/${path.relative(cwd, path.join(runtimeDir, 'app.js'))}`,
-          basePath: basePath || '/',
-        },
-        isCoreApp,
-      }),
+    const indexHtml = decorateIndexWithBridgeScript(
+      decorateIndexWithAutoGeneratedWarning(
+        await renderDocument({
+          studioRootPath: cwd,
+          monorepo,
+          props: {
+            entryPath: `/${path.relative(cwd, path.join(runtimeDir, 'app.js'))}`,
+            basePath: basePath || '/',
+          },
+          isCoreApp,
+        }),
+      ),
     )
 
     debug('Writing index.html to runtime directory')

diff --git a/packages/sanity/src/_internal/cli/server/vite/plugin-sanity-build-entries.ts b/packages/sanity/src/_internal/cli/server/vite/plugin-sanity-build-entries.ts
@@ -1,6 +1,6 @@
 import {type ChunkMetadata, type Plugin} from 'vite'
 
-import {renderDocument} from '../renderDocument'
+import {decorateIndexWithBridgeScript, renderDocument} from '../renderDocument'
 import {type SanityMonorepo} from '../sanityMonorepo'
 
 interface ViteOutputBundle {
@@ -86,17 +86,19 @@ export function sanityBuildEntries(options: {
       this.emitFile({
         type: 'asset',
         fileName: 'index.html',
-        source: await renderDocument({
-          monorepo,
-          studioRootPath: cwd,
-          importMap,
-          props: {
-            basePath,
-            entryPath,
-            css,
-          },
-          isCoreApp,
-        }),
+        source: decorateIndexWithBridgeScript(
+          await renderDocument({
+            monorepo,
+            studioRootPath: cwd,
+            importMap,
+            props: {
+              basePath,
+              entryPath,
+              css,
+            },
+            isCoreApp,
+          }),
+        ),
       })
     },
   }