@wix/origami-site-express 0.1.2 → 0.1.4

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.4",
   "description": "Run an exported Wix origami site on Node with Express and Vite.",
   "type": "module",
   "files": [
@@ -65,5 +65,5 @@
       ]
     }
   },
-  "falconPackageHash": "3470a27832e07e4b9235a2df50d0c09302d980f76639e8987884ee39"
+  "falconPackageHash": "c747f0aab95a2845e2ad63b387beb5dde7b4e28c62baceff7b05fc63"
 }

package/src/adapter/driver.js

@@ -12,7 +12,7 @@ async function spawnBin(command, root, env) {
     const { spawn } = await import('node:child_process')
     const child = spawn(process.execPath, [binPath(root), command], {
         cwd: root, stdio: ['ignore', 'pipe', 'pipe'],
-        env: { ...process.env, ...env, ...(command === 'start' ? { NODE_ENV: 'production' } : {}) },
+        env: { ...process.env, ...env, ...(command === 'dev' ? {} : { NODE_ENV: 'production' }) },
     })
     let output = ''
     child.stdout.on('data', chunk => { output += chunk })

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'
@@ -12,7 +12,7 @@ import { createCurrentSite } from './currentSite.js'
 /** `origami-site-express dev`: Vite in middleware mode, Express, and the core in dev mode, all live.
  * @param {{ root: string }} options */
 export async function dev({ root }) {
-    const env = loadEnv('development', root, ['VITE_', 'ORIGAMI_'])
+    const env = loadEnv('development', root, ['VITE_', 'ORIGAMI_', 'PORT', 'HOST'])
     const { errorResponse, serializePageData } = await importCoreServer(root)
     const { origamiVitePlugins } = await importCoreBuild(root)
     const node = await importCoreNode(root)
@@ -41,11 +41,11 @@ 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() } })
+    await serve(httpServer, { port: port(env), host: host('dev', env), onClose: async () => { await vite.close(); await site()?.close() } })
 }

package/src/server/env.js

@@ -7,9 +7,10 @@ export function siteOptions(env) {
     }
 }
 
-export const port = () => Number(process.env.PORT ?? 3000)
+/** An empty PORT= means the default, not a random port. @param {Record<string, string | undefined>} [env] */
+export const port = (env = process.env) => Number(env.PORT || 3000)
 
 /** Dev serves the site's source through Vite, so it stays on this machine unless HOST says otherwise.
  * 127.0.0.1, not localhost: on macOS localhost binds only ::1. Start listens on every interface so the deployed site is reachable.
- * @param {'dev' | 'prod'} mode */
-export const host = mode => process.env.HOST || (mode === 'dev' ? '127.0.0.1' : undefined)
+ * @param {'dev' | 'prod'} mode @param {Record<string, string | undefined>} [env] */
+export const host = (mode, env = process.env) => env.HOST || (mode === 'dev' ? '127.0.0.1' : undefined)

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)
+}