@wix/origami-site-express 0.1.2 → 0.1.3

package/README.md

@@ -18,3 +18,5 @@ through Vite; set `HOST=0.0.0.0` to reach it from another machine or a container
 - In dev each request imports the core through Vite's module runner, so a linked core reloads on edit
   without a restart. An installed core loads once.
 - HMR runs on the site's own port (`server.ws.server`).
+- The page's essential Wix custom embeds (`resolution.embeds`) go at the end of `<head>`, first in `<body>` and
+  last in `<body>`; in dev after `vite.transformIndexHtml`.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/origami-site-express",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "Run an exported Wix origami site on Node with Express and Vite.",
   "type": "module",
   "files": [
@@ -65,5 +65,5 @@
       ]
     }
   },
-  "falconPackageHash": "3470a27832e07e4b9235a2df50d0c09302d980f76639e8987884ee39"
+  "falconPackageHash": "455a5d4751b360861bad538b9622e269cf9952063df493f85de30eb9"
 }

package/src/server/dev.js

@@ -4,7 +4,7 @@ import { createServer as createViteServer, isRunnableDevEnvironment, loadEnv } f
 import react from '@vitejs/plugin-react'
 import { coreEntry, importCoreBuild, importCoreNode, importCoreServer } from './core.js'
 import { catchAll } from './bridge.js'
-import { pageHtml } from './shell.js'
+import { pageHtml, plantEmbeds } from './shell.js'
 import { host, port, siteOptions } from './env.js'
 import { serve } from './lifecycle.js'
 import { createCurrentSite } from './currentSite.js'
@@ -41,10 +41,10 @@ export async function dev({ root }) {
     app.use(vite.middlewares)
     app.use(catchAll({
         mode: 'dev', errorResponse, node, getSite: currentSite,
-        renderPage: (resolution, request) => vite.transformIndexHtml(new URL(request.url).pathname, pageHtml(resolution, {
+        renderPage: async (resolution, request) => plantEmbeds(await vite.transformIndexHtml(new URL(request.url).pathname, pageHtml(resolution, {
             serializePageData,
             body: '<script type="module" src="/src/site/_generated/client.jsx"></script>',
-        })),
+        })), resolution.embeds),
     }))
     httpServer.on('request', app)
     await serve(httpServer, { port: port(), host: host('dev'), onClose: async () => { await vite.close(); await site()?.close() } })

package/src/server/prod.js

@@ -4,7 +4,7 @@ import { join } from 'node:path'
 import express from 'express'
 import { importCoreNode, importCoreServer } from './core.js'
 import { catchAll } from './bridge.js'
-import { pageHtml } from './shell.js'
+import { pageHtml, plantEmbeds } from './shell.js'
 import { readManifest } from './manifest.js'
 import { port, siteOptions } from './env.js'
 import { serve } from './lifecycle.js'
@@ -26,7 +26,7 @@ export async function start({ root }) {
     app.use(express.static(join(root, 'dist/client'), { index: false, redirect: false }))
     app.use(catchAll({
         mode: 'prod', errorResponse, node, getSite: async () => site,
-        renderPage: async resolution => pageHtml(resolution, { serializePageData, ...assetsFor(resolution.page) }),
+        renderPage: async resolution => plantEmbeds(pageHtml(resolution, { serializePageData, ...assetsFor(resolution.page) }), resolution.embeds),
     }))
     await serve(createServer(app), { port: port(), onClose: () => site.close() })
 }

package/src/server/shell.js

@@ -21,3 +21,16 @@ export function pageHtml({ page, data }, { serializePageData, head = '', body })
   </body>
 </html>`
 }
+
+/** Plants the page's Wix embeds at the end of <head>, the start of <body> and the end of <body>. Positions are
+ * found in the shell before anything is inserted, so embed HTML can never move the next slot. In dev this runs
+ * after vite.transformIndexHtml, so Vite never rewrites an embed's inline scripts.
+ * @param {string} html @param {import('@wix/origami-site/types').PageEmbeds | undefined} embeds */
+export function plantEmbeds(html, embeds) {
+    if (!embeds || (!embeds.head && !embeds.bodyStart && !embeds.bodyEnd)) return html
+    const headEnd = html.indexOf('</head>')
+    const bodyStart = html.indexOf('>', html.indexOf('<body')) + 1
+    const bodyEnd = html.lastIndexOf('</body>')
+    return html.slice(0, headEnd) + `${embeds.head}\n  ` + html.slice(headEnd, bodyStart) + `\n${embeds.bodyStart}` +
+        html.slice(bodyStart, bodyEnd) + `${embeds.bodyEnd}\n  ` + html.slice(bodyEnd)
+}