@abide/abide 0.111.0 → 0.113.0

package/src/compiler/classifyTemplate.ts

@@ -1,7 +1,9 @@
+import { ASCII_WHITESPACE } from '#shared/ASCII_WHITESPACE.ts'
 import { escapeAttribute, escapeQuote } from '#shared/escapeText.ts'
 import { isEventName } from '#shared/isEventName.ts'
 import { safeUrl } from '#shared/safeUrl.ts'
 import { URL_ATTRIBUTES } from '#shared/URL_ATTRIBUTES.ts'
+import { decodeCharacterReferences } from './decodeCharacterReferences.ts'
 import {
     type Attribute,
     bodiesOf,
@@ -90,8 +92,11 @@ export type ClassifiedAttribute = {
           kind: 'bound'
           bind: ValueBind
           reflects: 'value' | 'checked' | 'open' | undefined
-          /** 32.8 — a group member's own `value`, which the group is compared against. */
-          own: string
+          /**
+           * 32.8 — a group member's `value` attribute, which the group is compared against —
+           * `undefined` where it has none, and the input's value is then `on`.
+           */
+          own: Attribute | undefined
       }
     // 32.9 — the node itself, which a server has none of: written out it was `bind:element=""`,
     // inert and a tell. The client does not set it either; what the value takes is the element.
@@ -102,24 +107,39 @@ export type ClassifiedAttribute = {
     // 32.10, 32.19 — a member of a `class` or `style` merge group (`MergeGroup`). `group` is set on
     // the FIRST member only, where the whole group is written, which keeps the tag in the author's
     // attribute order. `toggles` is the one class or style property a directive's binding writes,
-    // and `undefined` for the author's own plain attribute — see where that is decided.
+    // or a shared group's whole value at its first member (32.71), named by the directives'
+    // classes or properties, and `undefined` for any other member — see where that is decided.
     | {
           kind: 'merged'
           group: MergeGroup | undefined
-          toggles: { write: 'class' | 'style'; name: string } | undefined
+          toggles:
+              | {
+                    write: 'class' | 'style' | 'classGroup' | 'styleGroup'
+                    name: string
+                }
+              | undefined
       }
 )
 
 /**
  * Every attribute of an element, classified, in the order the tag carries them.
  *
- * `lowering` answers `live` (`Lowering.isLive`).
+ * `lowering` answers `live` (`Lowering.isLive`), and whether a shared `class` group can move
+ * (`Lowering.readsAnItem`: a row's item read at its top level is not live, and a row's `update`
+ * writes it).
  */
 export function classifyAttributes(
     node: ElementNode,
-    lowering: { isLive(holder: object): boolean },
+    lowering: {
+        isLive(holder: object): boolean
+        readsAnItem(holder: object): boolean
+    },
 ): ClassifiedAttribute[] {
+    refuseTwoOwners(node)
     const groups = mergeGroupsOf(node)
+    const sharing: ReturnType<typeof sharingOf>[] = []
+    for (const group of groups) sharing.push(sharingOf(group, lowering))
+    const held = heldClasses(groups)
     const written = new Set<MergeGroup>()
     const classified: ClassifiedAttribute[] = []
     for (const attribute of node.attributes) {
@@ -130,33 +150,37 @@ export function classifyAttributes(
         if (group !== undefined) {
             const leads = !written.has(group)
             written.add(group)
-            // 32.10, 32.19 — THE PLAIN `style={expr}` OR `class={expr}` BESIDE A DIRECTIVE IS LEFT
-            // UNBOUND. `setAttribute` replaces the whole merged value and takes the directives'
-            // halves with it, and the two bindings then overwrite each other in whichever order
-            // they reran.
+            // 32.71 — A SHARED GROUP IS WRITTEN WHOLE AT ITS FIRST MEMBER, through `classList` or
+            // the CSSOM, as the server merged it, and moves where any member does — so a directive
+            // keeps what the plain attribute still holds without either knowing of the other.
             //
-            // ALLOWED, rather than refused. The page still RENDERS right — the server writes both
-            // halves into the one merged attribute — so the only thing a build error would buy is
-            // breaking a page that works today for a clause that is not built. What it costs is
-            // the hole: this one attribute keeps the value standing at render where 32.3 says it
-            // moves, and nothing reports that.
-            //
-            // 32.19 IS WHAT CLOSES THE `style` HALF: an interpolated `style` lowers to `style:prop`
-            // under a static name and is never built as a string, and then there is no
-            // whole-attribute write left to clobber anything. No clause spells the same road for
-            // `class`, and until one does the two share this answer.
+            // 32.10 — A STATIC PLAIN ATTRIBUTE IS LEFT UNBOUND, and so is a directive naming one of
+            // a static `class`'s classes, which is always on. The static value is never written
+            // again, and the directives write through `classList` or the CSSOM beside it.
+            const shared = sharing[groups.indexOf(group)]
+            if (shared !== undefined) {
+                classified.push({
+                    attribute,
+                    live: leads ? shared.live : live,
+                    kind: 'merged',
+                    group: leads ? group : undefined,
+                    toggles: leads
+                        ? { write: `${group.name}Group`, name: shared.names }
+                        : undefined,
+                })
+                continue
+            }
+            const name = attribute.name.slice(group.name.length + 1)
             classified.push({
                 attribute,
                 live,
                 kind: 'merged',
                 group: leads ? group : undefined,
                 toggles:
-                    attribute === group.plain
+                    attribute === group.plain ||
+                    (group.name === 'class' && held.includes(name))
                         ? undefined
-                        : {
-                              write: group.name,
-                              name: attribute.name.slice(group.name.length + 1),
-                          },
+                        : { write: group.name, name },
             })
             continue
         }
@@ -191,7 +215,7 @@ export function classifyAttributes(
                         : bind === 'group'
                           ? 'checked'
                           : bind,
-                own: staticAttribute(node, 'value') ?? 'on',
+                own: attributeOf(node, 'value'),
             })
         else if (isElementBind(attribute.lowerName))
             classified.push({ attribute, live, kind: 'element' })
@@ -294,6 +318,85 @@ function mergeGroupsOf(node: ElementNode): MergeGroup[] {
     return groups
 }
 
+/**
+ * 32.71 — for a group whose plain attribute is an expression and where some member can move, so
+ * neither half can be written without the other: whether a member is `live`, and the directives'
+ * classes or properties, which the group owns before its first write. `undefined` for any other.
+ */
+function sharingOf(
+    group: MergeGroup,
+    lowering: Parameters<typeof classifyAttributes>[1],
+): { live: boolean; names: string } | undefined {
+    if (!group.plain?.expression) return undefined
+    let live = false
+    let moves = false
+    for (const member of group.members) {
+        if (!member.expression) continue
+        if (lowering.isLive(member)) live = moves = true
+        else if (lowering.readsAnItem(member)) moves = true
+    }
+    if (!moves) return undefined
+    const names: string[] = []
+    for (const directive of group.directives)
+        names.push(directive.name.slice(group.name.length + 1))
+    return { live, names: names.join(' ') }
+}
+
+/** 32.71 — the classes a static `class` beside a `class:name` holds, each always on. */
+function heldClasses(groups: MergeGroup[]): string[] {
+    for (const group of groups)
+        if (group.name === 'class' && group.plain && !group.plain.expression)
+            return decodeCharacterReferences(
+                group.plain.value,
+                'attribute',
+            ).split(ASCII_WHITESPACE)
+    return []
+}
+
+/**
+ * 32.72 — WHAT A `bind:` WRITES IS THE BIND'S ALONE: `checked` beside `bind:checked` or
+ * `bind:group`, `value` beside `bind:value`, any `bind:name` beside `name` — and an
+ * `<option selected>` inside a `<select bind:value>`, and a `<textarea bind:value>`'s text. Two
+ * owners of one value render whichever the browser keeps and move with whichever wrote last.
+ */
+function refuseTwoOwners(node: ElementNode): void {
+    for (const attribute of node.attributes) {
+        const lower = attribute.lowerName
+        if (!lower.startsWith('bind:') || lower === 'bind:element') continue
+        const owned =
+            lower === 'bind:group' ? 'checked' : lower.slice('bind:'.length)
+        const beside = attributeOf(node, owned)
+        if (beside !== undefined)
+            throw new Error(
+                `abide: <${node.tag}> has ${attribute.name} and ${beside.name} — one value, two owners. ${attribute.name} writes ${owned} already; drop ${beside.name}. RULEBOOK 32.72.`,
+            )
+        if (owned !== 'value') continue
+        if (node.lowerTag === 'textarea' && node.children.length > 0)
+            throw new Error(
+                `abide: <${node.tag} ${attribute.name}> has text of its own — one value, two owners. The bind writes the text; drop what stands between the tags. RULEBOOK 32.72.`,
+            )
+        if (node.lowerTag === 'select' && holdsSelectedOption(node.children))
+            throw new Error(
+                `abide: <${node.tag} ${attribute.name}> has an <option selected> — one value, two owners. The bind selects the option its value holds; drop selected. RULEBOOK 32.72.`,
+            )
+    }
+}
+
+/** Whether an `<option>` with a `selected` attribute stands anywhere among `nodes`, blocks included. */
+function holdsSelectedOption(nodes: readonly TemplateNode[]): boolean {
+    for (const node of nodes) {
+        if (
+            node.kind === 'element' &&
+            node.lowerTag === 'option' &&
+            attributeOf(node, 'selected') !== undefined
+        )
+            return true
+        for (const body of bodiesOf(node))
+            if (holdsSelectedOption(body.children)) return true
+    }
+    return false
+}
+
 /** An element's attribute by its folded name, or `undefined`. */
 export function attributeOf(
     node: ElementNode,
@@ -304,14 +407,6 @@ export function attributeOf(
     return undefined
 }
 
-/** An attribute's static value, or `undefined` where it is absent or an expression. */
-function staticAttribute(node: ElementNode, name: string): string | undefined {
-    const attribute = attributeOf(node, name)
-    return attribute === undefined || attribute.expression
-        ? undefined
-        : attribute.value
-}
-
 /**
  * Whether a tag names a component: it starts with an uppercase ASCII letter.
  *
@@ -437,11 +532,11 @@ export function isSingleRooted(children: TemplateNode[]): boolean {
     )
 }
 
-// CONTENT ONLY THE PARSER MAKES RIGHT, which is what a row the browser BUILDS cannot reproduce with
-// `createElement` and `appendChild`: an `<svg>` or `<math>` subtree lives in another namespace (and
-// the parser fixes the case of `linearGradient`), a raw-text element's contents are not decoded
-// the way body text is, and a `<template>`'s children go into its `content`. A row that touches any
-// of it is left to the parser — the general path, as the fallback it is.
+// CONTENT A ROW THE BROWSER BUILDS LEAVES TO THE PARSER: an `<svg>` or `<math>` that opens its
+// namespace inside the row (a build only carries one in, off the parent it goes into — 32.70), a
+// raw-text element's contents, which are not decoded the way body text is, and a `<template>`'s
+// children, which go into its `content`. A row that touches any of it is left to the parser — the
+// general path, as the fallback it is.
 const PARSER_OWNED = new Set([
     'svg',
     'math',

package/src/compiler/emitClient.ts

@@ -7,6 +7,11 @@ import {
 } from '#shared/ANCHORS.ts'
 import { anchorMarkup } from '#shared/anchorMarkup.ts'
 import { CHILDREN } from '#shared/CHILDREN.ts'
+import { FOREIGN_ATTRIBUTES } from '#shared/FOREIGN_ATTRIBUTES.ts'
+import {
+    HTML_NAMESPACE,
+    INTEGRATION_POINTS,
+} from '#shared/INTEGRATION_POINTS.ts'
 import { RUNTIME_SPECIFIER, SHARED_SPECIFIER } from '#shared/SPECIFIERS.ts'
 import { type CheckerAnswer, UNCHECKED } from './CheckerAnswer.ts'
 import {
@@ -21,6 +26,7 @@ import {
     classifyAttributes,
     isBound,
     isSingleRooted,
+    type MergeGroup,
     isSlot,
 } from './classifyTemplate.ts'
 import { decodeCharacterReferences } from './decodeCharacterReferences.ts'
@@ -220,9 +226,7 @@ export function emitClient(
     const registered = heads
         ? `if (${ROUTED}) ${ROUTED}.setHead(() => ${headMarkup})\n`
         : ''
-    const applied = heads
-        ? `if (${ROUTED}) ${lowering.use('applyHead')}(${ROUTED}.headMarkup()); `
-        : ''
+    const applied = heads ? `if (${ROUTED}) ${ROUTED}.reconcile(); ` : ''
     // Applied with the fill either way, so the watch's first run only subscribes: what it would
     // write is already there, from the server or from the line above.
     if (liveHeads) lines.push(`if (${ROUTED}) ${ROUTED}.followHead(${SCOPE})`)
@@ -767,6 +771,17 @@ function elementUnits(
             )
         // 32.5, 32.7, 32.8 — THE PROPERTY AND THE VALUE, IN STEP BOTH WAYS: a watch on this
         // region's scope writes the property, and a listener writes it back.
+        // 32.8 — a group compares against the input's own value, read where the value is.
+        else if (one.kind === 'bound' && one.bind === 'group')
+            binds.push(
+                `${lowering.use('bindGroup')}(${element}, ${lowering.reference(one.attribute)}, () => (${
+                    one.own === undefined
+                        ? "'on'"
+                        : one.own.expression
+                          ? lowering.binding(one.own)
+                          : JSON.stringify(one.own.value)
+                }), ${SCOPE})`,
+            )
         else if (one.kind === 'bound')
             binds.push(
                 `${lowering.use('bindProperty')}(${element}, ${JSON.stringify(one.bind)}, ${lowering.reference(one.attribute)}, ${SCOPE})`,
@@ -798,16 +813,32 @@ if (__r${slot} !== undefined) ${SCOPE}.stops.push(__r${slot})`,
                           write: 'attribute' as const,
                           name: one.attribute.name,
                       }
+            // 32.71 — A SHARED GROUP IS ONE WATCH over its whole value, which wakes for any member:
+            // a directive cannot keep what the plain attribute holds from a watch of its own.
+            const group =
+                one.kind === 'merged' && writesGroup(write)
+                    ? one.group
+                    : undefined
             // 32.67 — one reading a row's item is one of the row's item watches, on a name of its
             // own because it is installed apart from the element's other attributes.
-            if (lowering.readsOwnItem(one.attribute))
-                itemWrites.push(
-                    `${SCOPE}.itemWatch(() => ${lowering.use(WRITES[write])}(__i${slot}, ${JSON.stringify(name)}, ${lowering.binding(one.attribute)}))`,
-                )
-            else
-                writes.push(
-                    `${SCOPE}.watch(() => ${lowering.use(WRITES[write])}(__a${slot}, ${JSON.stringify(name)}, ${lowering.binding(one.attribute)}))`,
-                )
+            const asItem =
+                group === undefined
+                    ? lowering.readsOwnItem(one.attribute)
+                    : groupReadsOwnItem(group, lowering)
+            const call = writeCall(
+                write,
+                asItem ? `__i${slot}` : `__a${slot}`,
+                name,
+                group === undefined
+                    ? lowering.binding(one.attribute)
+                    : groupArguments(group, (attribute) =>
+                          lowering.binding(attribute),
+                      ),
+                lowering,
+            )
+            ;(asItem ? itemWrites : writes).push(
+                `${SCOPE}.${asItem ? 'itemWatch' : 'watch'}(() => ${call})`,
+            )
         }
     }
     if (itemWrites.length > 0)
@@ -825,14 +856,27 @@ if (__r${slot} !== undefined) ${SCOPE}.stops.push(__r${slot})`,
 const SCOPE = '__scope'
 
 // Which runtime write each kind of attribute binding is handed to. A record rather than a chain
-// of ternaries, so a fourth kind is a row here and the call site stays one line — all three take
-// the same three arguments, which is what makes them one site at all.
+// of ternaries, so a sixth kind is a row here and the call site stays one line — all take the
+// same three arguments, which is what makes them one site at all.
 const WRITES = {
     attribute: 'setAttribute',
     class: 'setClass',
     style: 'setStyleProperty',
+    classGroup: 'setClassGroup',
+    styleGroup: 'setStyleGroup',
 } as const
 
+/** One attribute binding's write: the element, the one name it owns, and the value. */
+function writeCall(
+    write: keyof typeof WRITES,
+    element: string,
+    name: string,
+    value: string,
+    lowering: Lowering,
+): string {
+    return `${lowering.use(WRITES[write])}(${element}, ${JSON.stringify(name)}, ${value})`
+}
+
 // The share scope an instance captures for its deferred mounts (10.5), named apart from the one an
 // instance OPENS (`shareScope`): a page that shares nothing still carries this for a child that does.
 const SHARE_AT = '__shareAt'
@@ -841,6 +885,9 @@ const SHARE_AT = '__shareAt'
 const PARENT = '__parent'
 // The document a built region makes its nodes with, read off `PARENT` once a build.
 const DOCUMENT = '__document'
+// The namespace a built region's top-level elements take, read off `PARENT` once a build.
+const SPACE = '__space'
+const HTML_SPACE = JSON.stringify(HTML_NAMESPACE)
 
 // A run's anchors while it holds markup (32.30), as the JS string literals a built run parses with.
 const RAW_OPEN_MARKUP = JSON.stringify(anchorMarkup(RAW_OPEN))
@@ -903,17 +950,29 @@ function emitMaker(
  *
  * A NESTED REGION IS AN EMPTY ANCHOR PAIR, filled by its own machinery on the mount's first run
  * (`fillEmpty`), and a component or a slot is the same pair filled by the child.
+ *
+ * 32.70 — AN ELEMENT IS BUILT IN THE NAMESPACE THE PARSER WOULD GIVE IT, read off the parent it goes
+ * into (`namespaceUnder`) rather than decided here: a component's root does not know it is invoked
+ * inside an `<svg>`, and a `<g>` made with `createElement` is an HTML element that draws nothing.
+ * Read once a build, and again only below an `<annotation-xml>`, which reads its children as HTML by
+ * the encoding it declares; below any other integration point (`INTEGRATION_POINTS`) a child is
+ * HTML's, and everywhere else it takes its parent's. `createElementNS` with
+ * HTML's namespace costs what `createElement` does (Chromium, 2026-10-22), and a build that makes
+ * no top-level element reads none.
  */
 function emitBuild(row: Cursor, anchored: boolean, lowering: Lowering): string {
     const lines: string[] = [
         `const ${DOCUMENT} = ${PARENT}.ownerDocument`,
         'const __built = []',
     ]
+    let readsSpace = false
     if (anchored)
         lines.push(
             `__built.push(${DOCUMENT}.createComment(${JSON.stringify(ROW_OPEN)}))`,
         )
     const render = buildRender(lowering)
+    // The expression each built element's namespace was, for its children to take.
+    const spaceOf = new Map<PlacedNode, string>()
     const into = (at: PlacedNode, node: string): string =>
         at.within === null
             ? `__built.push(${node})`
@@ -936,8 +995,19 @@ function emitBuild(row: Cursor, anchored: boolean, lowering: Lowering): string {
             for (const line of builtRun(at, lowering, into)) lines.push(line)
             continue
         }
+        const within = at.within
+        const space =
+            within === null
+                ? SPACE
+                : INTEGRATION_POINTS.has(within.tag)
+                  ? HTML_SPACE
+                  : within.tag === 'annotation-xml'
+                    ? `${lowering.use('namespaceUnder')}(${within.name})`
+                    : (spaceOf.get(within) ?? SPACE)
+        if (space === SPACE) readsSpace = true
+        spaceOf.set(at, space)
         lines.push(
-            `const ${at.name} = ${DOCUMENT}.createElement(${JSON.stringify(at.tag)})`,
+            `const ${at.name} = ${DOCUMENT}.createElementNS(${space}, ${JSON.stringify(at.tag)})`,
         )
         for (const one of classifyAttributes(
             at.holder as ElementNode,
@@ -945,7 +1015,13 @@ function emitBuild(row: Cursor, anchored: boolean, lowering: Lowering): string {
         )) {
             const value = builtAttribute(one, lowering, render)
             if (value === null) continue
-            const set = `${at.name}.setAttribute(${JSON.stringify(one.kind === 'merged' ? one.group?.name : one.attribute.name)}, `
+            const name =
+                one.kind === 'merged' ? one.group?.name : one.attribute.name
+            // 32.70 — one the parser would put in a namespace is written in it (`addAttribute`).
+            const set =
+                name !== undefined && FOREIGN_ATTRIBUTES.has(name)
+                    ? `${lowering.use('addAttribute')}(${at.name}, ${JSON.stringify(name)}, `
+                    : `${at.name}.setAttribute(${JSON.stringify(name)}, `
             // 32.37 — a whole-value attribute may be absent, which the server wrote as nothing.
             lines.push(
                 one.kind === 'dynamic'
@@ -955,6 +1031,12 @@ function emitBuild(row: Cursor, anchored: boolean, lowering: Lowering): string {
         }
         lines.push(into(at, at.name))
     }
+    if (readsSpace)
+        lines.splice(
+            1,
+            0,
+            `const ${SPACE} = ${lowering.use('namespaceUnder')}(${PARENT})`,
+        )
     lines.push('return __built')
     return lines.join('\n    ')
 }
@@ -1059,6 +1141,41 @@ function buildRender(lowering: Lowering): ValueRender {
     }
 }
 
+/** 32.71 — whether a write is a shared group's whole value. */
+function writesGroup(write: keyof typeof WRITES): boolean {
+    return write === 'classGroup' || write === 'styleGroup'
+}
+
+/** 32.71 — whether a shared group is one of a row's item watches: any member is. */
+function groupReadsOwnItem(group: MergeGroup, lowering: Lowering): boolean {
+    for (const member of group.members)
+        if (member.expression && lowering.readsOwnItem(member)) return true
+    return false
+}
+
+/**
+ * 32.71 — a shared group's write arguments: the plain attribute's value, then every directive's
+ * condition or value in the order the group names them, each read by `read`. A directive with no
+ * expression is a class that is always on, or a property's own bytes.
+ */
+function groupArguments(
+    group: MergeGroup,
+    read: (attribute: Attribute) => string,
+): string {
+    const values: string[] = []
+    for (const directive of group.directives)
+        values.push(
+            directive.expression
+                ? read(directive)
+                : group.name === 'class'
+                  ? 'true'
+                  : JSON.stringify(
+                        decodeCharacterReferences(directive.value, 'attribute'),
+                    ),
+        )
+    return `${read(group.plain as Attribute)}, [${values.join(', ')}]`
+}
+
 /**
  * Emits a region's `_build` and `_mount` pair into `helpers`, for a region nobody painted.
  *
@@ -1565,6 +1682,40 @@ function rowUpdate(
             position.holder as ElementNode,
             lowering,
         )) {
+            // 32.71 — a shared group is written whole where a member moves with the item — and
+            // where none is live, as for any attribute: a live group's watch reads the item too.
+            if (
+                one.kind === 'merged' &&
+                one.group !== undefined &&
+                one.toggles !== undefined &&
+                writesGroup(one.toggles.write)
+            ) {
+                if (one.live) continue
+                for (const member of one.group.members)
+                    if (
+                        member.expression &&
+                        !lowering.isLive(member) &&
+                        lowering.readsItem(member, block)
+                    ) {
+                        own.push(
+                            writeCall(
+                                one.toggles.write,
+                                `__a${slot}`,
+                                one.toggles.name,
+                                groupArguments(one.group, (attribute) =>
+                                    unlandable(
+                                        lowering,
+                                        attribute,
+                                        lowering.expression(attribute),
+                                    ),
+                                ),
+                                lowering,
+                            ),
+                        )
+                        break
+                    }
+                continue
+            }
             if (!one.attribute.expression || one.live) continue
             if (!lowering.readsItem(one.attribute, block)) continue
             const toggles =
@@ -1578,7 +1729,13 @@ function rowUpdate(
                       : undefined
             if (toggles === undefined) continue
             own.push(
-                `${lowering.use(WRITES[toggles.write])}(__a${slot}, ${JSON.stringify(toggles.name)}, ${lowering.expression(one.attribute)})`,
+                writeCall(
+                    toggles.write,
+                    `__a${slot}`,
+                    toggles.name,
+                    lowering.expression(one.attribute),
+                    lowering,
+                ),
             )
         }
         if (own.length === 0) continue

package/src/compiler/renderMarkup.ts

@@ -354,13 +354,9 @@ function renderPosition(
     // `<br>`, and a close tag written for one is markup no browser accepts.
     if (node.children.length === 0 && VOID_ELEMENTS.has(node.lowerTag))
         return parts.join(' + ')
-    // 32.61 — THE VALUE IN PLACE OF THE AUTHOR'S TEXT, led by the newline the parser drops after
-    // `<textarea>` so a value opening on one keeps it.
-    if (
-        within !== undefined &&
-        node.lowerTag === 'textarea' &&
-        node.children.length === 0
-    )
+    // 32.61 — THE VALUE AS THE TEXT, led by the newline the parser drops after `<textarea>` so a
+    // value opening on one keeps it. The author wrote none: 32.72 refuses it beside the bind.
+    if (within !== undefined && node.lowerTag === 'textarea')
         return [
             ...parts,
             `'\\n' + ${lowering.use('escapeAttribute')}(${within})`,
@@ -614,7 +610,17 @@ function boundMarkup(
         return `' value="' + ${lowering.use('escapeAttribute')}(${read}) + '"'`
     const on =
         written.bind === 'group'
-            ? `${lowering.use('groupHolds')}(${read}, ${JSON.stringify(written.own)})`
+            ? `${lowering.use('groupHolds')}(${read}, ${
+                  written.own === undefined
+                      ? "'on'"
+                      : written.own.expression
+                        ? unlandable(
+                              lowering,
+                              written.own,
+                              lowering.expression(written.own),
+                          )
+                        : JSON.stringify(written.own.value)
+              })`
             : read
     return `(${on} ? ' ${written.reflects}' : '')`
 }

package/src/server/commands.ts

@@ -6,6 +6,7 @@
 import { resolve } from 'node:path' // bun exposes no path helpers of its own
 import { parseArgs } from 'node:util' // bun exposes no argv parser of its own yet
 import { MCP_ADDRESS, OPENAPI_ADDRESS } from '#shared/ADDRESSES.ts'
+import { IN_PROCESS_ORIGIN } from '#shared/IN_PROCESS_ORIGIN.ts'
 import { banner } from './banner.ts'
 import { type App, type AppHandle, enterApp } from './createApp.ts'
 import { stopOnSignalOrFault } from './faultPolicy.ts'
@@ -494,7 +495,7 @@ async function surfaceAt(
     const booted = await booting(host, app, given)
     if (typeof booted === 'number') return booted
     return (init) =>
-        booted.fetch(new Request(`http://abide.local${address}`, init))
+        booted.fetch(new Request(`${IN_PROCESS_ORIGIN}${address}`, init))
 }
 
 /**

package/src/server/config.ts

@@ -49,6 +49,16 @@ export interface Config {
     APP_DATA_DIR: string
 }
 
+// What a preload derives beside 27.3's three — the test preload's principal secret (38.120). Declared
+// above `config`, which resolves as it is built — and so is invalidated by an addition.
+const ADDED: Record<string, string> = {}
+
+/** Adds `values` to the derived layer, so every `onConfig` default and the env still win (27.2). */
+export function addDerived(values: Record<string, string>): void {
+    Object.assign(ADDED, values)
+    config.invalidate()
+}
+
 /** The resolved configuration: abide's derived values, then `onConfig`'s defaults, then the env. */
 export const config = reactive(resolve, { global: true })
 
@@ -100,7 +110,8 @@ function coerce(text: string, standing: unknown): unknown {
 }
 
 /**
- * The app's name, version and data directory, off its own `package.json` and the platform.
+ * The app's name, version and data directory, off its own `package.json` and the platform, and
+ * what `addDerived` added.
  *
  * 27.3 — a layer under the other two, so a config or an environment that carries one wins.
  */
@@ -108,6 +119,7 @@ function derived(): Record<string, string> {
     const manifest = APP_PACKAGE.current
     const name = manifest.name ?? 'app'
     return {
+        ...ADDED,
         APP_NAME: name,
         APP_VERSION: manifest.version ?? '0.0.0',
         // 36.4 — A PATH, and never created: an app that wants the directory makes it.