@wix/origami-site 0.1.2 → 0.1.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/origami-site",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "description": "Runs an exported Wix origami site: file-based routing, Wix dynamic pages, popups and build checks. Use with @wix/origami-site-astro or @wix/origami-site-express.",
   "type": "module",
   "files": [
@@ -9,14 +9,16 @@
   "scripts": {
     "build": "tsc --noEmit",
     "lint": "oxlint .",
-    "test": "node --test test/*.spec.js && tsc --noEmit -p tsconfig.test.json"
+    "test": "node --test test/*.spec.js && tsc --noEmit -p tsconfig.test.json && vitest run --config vitest.config.js"
   },
   "devDependencies": {
     "@types/node": "^22.0.0",
     "typescript": "^6.0.3",
     "vite": "^8",
     "@vitejs/plugin-react": "^5.2.0",
-    "postcss": "^8.5.3"
+    "postcss": "^8.5.3",
+    "jsdom": "^23.0.1",
+    "vitest": "^4.1.11"
   },
   "publishUnscoped": false,
   "publishConfig": {
@@ -77,5 +79,5 @@
   "peerDependencies": {
     "vite": "^8"
   },
-  "falconPackageHash": "c7e37593d4cdf506898d4bc2680d2948adb3027e23c106ffad08d458"
+  "falconPackageHash": "69ad67bddf0c45dc3c8fd3dcebfb36083391808674c0ac438126d4c7"
 }

package/src/browser/index.d.ts

@@ -1,10 +1,14 @@
 import type { PageData } from '../server/index.js'
-// PLAN-QUESTION: mountPage options follow the example; page modules remain unknown until milestone 1.7.
+import type { ComponentType } from 'react'
+
+export type PageModule = { default: ComponentType }
 export type MountPageOptions = {
-  pages: Record<string, () => Promise<unknown>>
+  pages: Record<string, () => Promise<PageModule>>
   popups: Record<string, () => Promise<unknown>>
   seoUriByPageId: Record<string, string>
   beforeMount: () => Promise<unknown>
 }
 export function mountPage(element: Element | null, options: MountPageOptions): Promise<() => void>
-export function readPageData(): PageData
+/** Cached per page load. Warns once and returns undefined if the block is missing.
+ * Throws an Error with the parse failure as its cause for invalid JSON. */
+export function readPageData(): PageData | undefined

package/src/browser/index.js

@@ -1 +1,57 @@
-export {}
+import { createElement, StrictMode } from 'react'
+import { createRoot } from 'react-dom/client'
+import { PilerPage } from '@wix/builder-piler-components'
+
+let hasReadPageData = false
+/** @type {import('../server/index.js').PageData | undefined} */
+let pageData
+/** @type {Error | undefined} */
+let pageDataError
+
+/** Read the adapter's JSON block without evaluating it as JavaScript.
+ * @returns {import('../server/index.js').PageData | undefined}
+ */
+export function readPageData() {
+    if (!hasReadPageData) {
+        hasReadPageData = true
+        const script = document.getElementById('origami-page')
+        if (!script) {
+            console.warn('Missing #origami-page data block')
+        } else {
+            try {
+                pageData = JSON.parse(script.textContent ?? '')
+            } catch (cause) {
+                pageDataError = new Error('Invalid JSON in #origami-page', { cause })
+            }
+        }
+    }
+    if (pageDataError) throw pageDataError
+    return pageData
+}
+
+/** @param {Element | null} element
+ * @param {import('./index.js').MountPageOptions} options
+ * @returns {Promise<() => void>}
+ */
+export async function mountPage(element, { pages, beforeMount }) {
+    if (!element) throw new Error('Cannot mount page: root element is missing')
+    const data = readPageData()
+    const pageKey = data?.page
+    const loadPage = (typeof pageKey === 'string' && Object.hasOwn(pages, pageKey) && pages[pageKey])
+        || (Object.hasOwn(pages, 'pages/error404') && pages['pages/error404'])
+        || (Object.hasOwn(pages, '@wix/origami-site/default-error-404') && pages['@wix/origami-site/default-error-404'])
+    if (typeof loadPage !== 'function') {
+        throw new Error('Cannot mount page: requested page and default 404 are missing')
+    }
+
+    try {
+        await beforeMount()
+    } catch (error) {
+        console.error(error)
+    }
+    // Generated page providers read PageData.services during this import.
+    const { default: Page } = await loadPage()
+    const root = createRoot(element)
+    root.render(createElement(StrictMode, null, createElement(PilerPage, { Page })))
+    return () => root.unmount()
+}

package/src/server/index.d.ts

@@ -9,7 +9,7 @@ export type SiteOptions = {
   mode: 'dev' | 'prod'
   table?: SiteRouteTable                 // prod: the table from the build. dev: omitted, the core scans.
   wix: { clientId: string; siteId: string }   // from VITE_WIX_CLIENT_ID / VITE_WIX_SITE_ID
-  tokens?: TokenProvider             // default: builderAuthTokenProvider (3.3)
+  tokens?: TokenProvider             // default: rejects until router support (stage 2)
   access?: AccessSource              // default: noAccessRules (4)
   accessHandlers?: AccessHandler[]   // default: []
   fetch?: typeof fetch               // tests inject a fake
@@ -78,4 +78,3 @@ export function runInRequestContext<T>(ctx: RequestContext, fn: () => Promise<T>
 export function getRequestContext(): RequestContext
 export function getAccessToken(): Promise<string>
 export function serializePageData(data: PageData): string
-export function builderAuthTokenProvider(options: { clientId: string; siteId: string }): TokenProvider

package/src/server/index.js

@@ -1,2 +1,5 @@
 export { readSiteTree } from './site-tree/readSiteTree.js'
 export { SiteTreeError } from './requests/errors.js'
+export { createSite, noAccessRules } from './requests/createSite.js'
+export { runInRequestContext, getRequestContext, getAccessToken } from './requests/context.js'
+export { serializePageData } from './requests/pageData.js'

package/src/server/requests/canBePagePath.js

@@ -0,0 +1,3 @@
+// DM page slugs contain only letters, marks, digits and hyphens, so dotted paths
+// cannot name pages. Skip their dev safety-net rescans without changing matching.
+export const canBePagePath = path => !path.includes('.')

package/src/server/requests/context.js

@@ -0,0 +1,22 @@
+import { AsyncLocalStorage } from 'node:async_hooks'
+
+/** @type {AsyncLocalStorage<{ context: import('../index.js').RequestContext, token?: Promise<string> }>} */
+const storage = new AsyncLocalStorage()
+
+/** @template T @param {import('../index.js').RequestContext} ctx @param {() => Promise<T>} fn */
+export function runInRequestContext(ctx, fn) {
+    return storage.run({ context: ctx }, fn)
+}
+
+export function getRequestContext() {
+    const state = storage.getStore()
+    if (!state) throw new Error('No Origami request context is active.')
+    return state.context
+}
+
+export function getAccessToken() {
+    const context = getRequestContext()
+    const state = /** @type {NonNullable<ReturnType<typeof storage.getStore>>} */ (storage.getStore())
+    state.token ??= Promise.resolve().then(() => context.tokens.getAccessToken(context.request))
+    return state.token
+}

package/src/server/requests/createSite.js

@@ -0,0 +1,93 @@
+import { createSiteTree } from '../site-tree/createSiteTree.js'
+import { readSiteTree } from '../site-tree/readSiteTree.js'
+import { SiteTreeError } from './errors.js'
+import { normalizeRequestPath } from './urlPath.js'
+import { canBePagePath } from './canBePagePath.js'
+import { runInRequestContext } from './context.js'
+import { errorPage } from './errorPage.js'
+
+/** @type {import('../index.js').AccessSource} */
+export const noAccessRules = { async load() { return new Map() } }
+const unavailableTokens = { async getAccessToken() { throw new Error('Default access tokens are not available until router support.') } }
+const defaultLogger = {
+    warn: (...args) => console.warn('[origami]', ...args),
+    error: (...args) => console.error('[origami]', ...args),
+}
+
+/** @param {import('../index.js').SiteOptions} options @returns {Promise<import('../index.js').OrigamiSite>} */
+export async function createSite(options) {
+    const { root, mode, access = noAccessRules, accessHandlers = [], tokens = unavailableTokens, logger = defaultLogger } = options
+    /** @param {import('@wix/origami-types').SiteRouteTable} table */
+    async function prepare(table) {
+        const rules = await access.load(table, root)
+        const pages = table.pages.map(page => ({ ...page, access: rules.get(page.key) ?? page.access }))
+        for (const page of pages) for (const rule of page.access) {
+            if (!accessHandlers.some(handler => handler.type === rule.type)) {
+                throw new SiteTreeError('UNSUPPORTED_ACCESS_RULE', [page.itemPath], `No access handler for rule type "${rule.type}".`)
+            }
+        }
+        return { ...table, pages }
+    }
+    const tree = mode === 'dev' ? createSiteTree(root, prepare) : null
+    const productionTable = tree ? null : await prepare(options.table ?? await readSiteTree(root))
+    let closed = false
+    async function table() {
+        if (closed) throw new Error('Site is closed.')
+        return tree ? tree.table() : /** @type {import('@wix/origami-types').SiteRouteTable} */ (productionTable)
+    }
+    try { await table() } catch (error) {
+        if (mode !== 'dev' || !(error instanceof SiteTreeError)) { await tree?.close(); throw error }
+    }
+    /** @param {string | undefined} path @param {import('@wix/origami-types').SiteRouteTable} current @returns {import('../index.js').RouteMatch} */
+    function matchPath(path, current) {
+        if (path === undefined) return { kind: 'notFound' }
+        if (path === '/_origami' || path.startsWith('/_origami/')) return { kind: 'reserved', path }
+        const route = current.pages.find(page => page.url === path)
+        return route ? { kind: 'page', route } : { kind: 'notFound' }
+    }
+    return {
+        table,
+        async match(url) { return matchPath(normalizeRequestPath(url.pathname), await table()) },
+        fileChanged(path) { tree?.fileChanged(path) },
+        onTableChange(listener) { return tree?.onTableChange(listener) ?? (() => {}) },
+        async close() { closed = true; await tree?.close() },
+        async handle(request) {
+            try {
+                const url = new URL(request.url)
+                const context = { request, url, tokens, locals: new Map() }
+                return await runInRequestContext(context, async () => {
+                    if (request.method !== 'GET' && request.method !== 'HEAD') {
+                        return { kind: 'response', response: new Response(null, { status: 405, headers: { Allow: 'GET, HEAD' } }) }
+                    }
+                    const path = normalizeRequestPath(url.pathname)
+                    if (path === '/_origami' || path?.startsWith('/_origami/')) {
+                        return { kind: 'response', response: new Response(null, { status: 404 }) }
+                    }
+                    let current = await table()
+                    let match = matchPath(path, current)
+                    if (match.kind === 'notFound' && path !== undefined && tree && canBePagePath(path)) {
+                        tree.fileChanged('src/pages')
+                        current = await table()
+                        match = matchPath(path, current)
+                    }
+                    if (match.kind === 'page') {
+                        for (const rule of match.route.access) {
+                            const handler = accessHandlers.find(candidate => candidate.type === rule.type)
+                            if (!handler) throw new SiteTreeError('UNSUPPORTED_ACCESS_RULE', [match.route.itemPath], `No access handler for rule type "${rule.type}".`)
+                            const response = await handler.check(rule, request, context)
+                            if (response) return { kind: 'response', response }
+                        }
+                    }
+                    const found = match.kind === 'page'
+                    const route = match.kind === 'page' ? match.route : current.notFound
+                    const page = { key: route.key, title: route.title, ...(route.itemPath === undefined ? {} : { itemPath: route.itemPath }) }
+                    return {
+                        kind: 'page', status: found ? 200 : 404, page,
+                        data: { page: page.key, route: { kind: found ? 'page' : 'notFound', url: path ?? url.pathname }, services: {} },
+                        headers: new Headers(),
+                    }
+                })
+            } catch (error) { return errorPage(error, 500, mode, logger) }
+        },
+    }
+}

package/src/server/requests/errorPage.js

@@ -0,0 +1,15 @@
+const escapeHtml = value => String(value).replace(/[&<>"']/g, char => ({
+    '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;',
+})[char])
+
+/** Plain HTML: builder-error-pages exports React components, not server HTML. */
+export function errorPage(error, status, mode, logger) {
+    // Logging must not turn a handled failure into a rejected request.
+    try { logger.error(error instanceof Error ? error.stack ?? error.message : String(error)) } catch {}
+    const title = status === 503 ? 'Service unavailable' : 'Internal server error'
+    const detail = mode === 'dev' ? `<pre>${escapeHtml(error instanceof Error ? error.message : error)}</pre>` : ''
+    return { kind: /** @type {const} */ ('response'), response: new Response(
+        `<!doctype html><html lang="en"><head><meta charset="utf-8"><title>${title}</title></head><body><h1>${title}</h1>${detail}</body></html>`,
+        { status, headers: { 'content-type': 'text/html; charset=utf-8', 'cache-control': 'no-store' } },
+    ) }
+}

package/src/server/requests/pageData.js

@@ -0,0 +1,4 @@
+/** @param {import('../index.js').PageData} data */
+export function serializePageData(data) {
+    return JSON.stringify(data).replace(/[<>&\u2028\u2029]/g, char => `\\u${char.charCodeAt(0).toString(16).padStart(4, '0')}`)
+}

package/src/server/requests/urlPath.js

@@ -0,0 +1,63 @@
+// URL path normalization shared by route declarations and incoming requests. A normalized path is
+// absolute, percent-decoded, and free of anything that could escape the route table: traversal
+// segments, embedded separators, control characters.
+
+const RESERVED_IN_RAW_PATH = /[\\?#]/
+const SEGMENT_SEPARATORS = '\\/?#'
+const HIGHEST_CONTROL_CODE = 0x1f
+const DELETE_CODE = 0x7f
+
+export class UrlPathError extends Error {
+    constructor(reason) {
+        super(reason)
+        this.name = 'UrlPathError'
+        this.reason = reason
+    }
+}
+
+const hasUnsafeCharacter = value => {
+    for (let index = 0; index < value.length; index += 1) {
+        const code = value.charCodeAt(index)
+        if (code <= HIGHEST_CONTROL_CODE || code === DELETE_CODE) return true
+        if (SEGMENT_SEPARATORS.includes(value[index])) return true
+    }
+    return false
+}
+
+const decodeSegment = segment => {
+    let decoded
+    try {
+        decoded = decodeURIComponent(segment)
+    } catch {
+        throw new UrlPathError('unsafe-segment')
+    }
+    if (decoded === '.' || decoded === '..' || hasUnsafeCharacter(decoded)) throw new UrlPathError('unsafe-segment')
+    return decoded
+}
+
+export const normalizeUrlPath = value => {
+    if (
+        typeof value !== 'string' ||
+        !value.startsWith('/') ||
+        RESERVED_IN_RAW_PATH.test(value) ||
+        value.includes('//')
+    ) {
+        throw new UrlPathError('not-absolute')
+    }
+
+    const trimmed = value === '/' ? value : value.replace(/\/+$/, '')
+    if (trimmed === '/') return trimmed
+
+    return `/${trimmed.slice(1).split('/').map(decodeSegment).join('/')}`
+}
+
+// The Web Request URL parser has already normalized url.pathname. Reject encoded
+// separators, control characters and leftover traversal segments; bad input becomes a 404.
+export const normalizeRequestPath = requestUrl => {
+    if (typeof requestUrl !== 'string' || !requestUrl.startsWith('/')) return undefined
+    try {
+        return normalizeUrlPath(requestUrl.split(/[?#]/, 1)[0])
+    } catch {
+        return undefined
+    }
+}

package/src/server/site-tree/createSiteTree.js

@@ -2,7 +2,7 @@ import { relative, resolve, sep } from 'node:path'
 import { readSiteTree, siteRoot } from './readSiteTree.js'
 
 /** Internal live table; adapters supply file events, never a second watcher. */
-export const createSiteTree = root => {
+export const createSiteTree = (root, prepare = async table => table) => {
     const rootPath = siteRoot(root)
     let dirty = true
     let closed = false
@@ -20,7 +20,7 @@ export const createSiteTree = root => {
                 dirty = false
                 // Serialize rescans, including recovery after a rejected scan.
                 pending = (pending ?? Promise.resolve()).catch(() => {}).then(async () => {
-                    const next = await readSiteTree(rootPath)
+                    const next = await prepare(await readSiteTree(rootPath))
                     const nextSignature = JSON.stringify(next)
                     if (signature !== nextSignature) {
                         const hadTable = current !== undefined