tutuca 0.9.110 → 0.9.112

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tutuca",
-  "version": "0.9.110",
+  "version": "0.9.112",
   "type": "module",
   "description": "SPA framework with immutable state and virtual DOM; dependency-free browser bundle",
   "main": "./dist/tutuca.js",
@@ -34,7 +34,7 @@
     "sync-docs-storybook": "bun scripts/sync-docs-storybook.js",
     "build-skill": "bun scripts/build-skill.js",
     "clean-skill": "rm -rf skill",
-    "test": "bun test test/*.test.js",
+    "test": "bun run dist && bun run dist-ext && bun test test/*.test.js",
     "test-watch": "bun test --watch test/*.test.js",
     "format": "bunx @biomejs/biome format --write",
     "lint": "bunx @biomejs/biome lint",

package/skill/tutuca/testing.md

@@ -157,8 +157,10 @@ you want to test them as a pipeline: filter + loop-data + enrichment
 together produce a list of bindings the view sees. Use
 `collectIterBindings` for that — a functional implementation only ships
 in the dev build (`tutuca/dev`); the core `tutuca` build exports a no-op
-stub. `tutuca test` redirects the bare `tutuca` import to the dev build
-automatically, so test modules can import it as below:
+stub that returns `[]`. Both commands that run `getTests()` in the
+terminal — `tutuca test` and `tutuca storybook` (including `--dry-run`) —
+redirect the bare `tutuca` import to the dev build automatically, as does
+the browser storybook's import map. So test modules can import it as below:
 
 ```js
 import { collectIterBindings } from "tutuca";
@@ -180,6 +182,10 @@ const r = collectIterBindings(MyComp, c, c.items, {
 - The `compInstance` is `this` for every handler. Pass
   `MyComp.make({ field: ... })` so handlers that read `this.field` see
   the value you want.
+- The redirect uses Node's `module.register`, which is how the `tutuca`
+  bin runs. Under a Bun-driven CLI it degrades to the no-op stub — if you
+  see `collectIterBindings` return `[]`, import it from `tutuca/dev`
+  explicitly.
 
 Example:
 

package/skill/tutuca-source/tutuca.ext.js

@@ -540,7 +540,6 @@ var PREDICATES = {
 
 class ValParser {
   constructor() {
-    this.bindValIt = new BindVal("it");
     this.nullConstVal = new ConstVal(null);
   }
   const(v) {
@@ -2086,7 +2085,7 @@ function parseXOp(attrs, childs, opIdx, px) {
       node = px.addNodeIf(RenderNode, parseXOpVal(name, value, px, vp.parseComponent), as);
       break;
     case "render-it":
-      node = px.addNodeIf(RenderItNode, vp.bindValIt, as);
+      node = px.addNode(RenderItNode, as);
       break;
     case "render-each":
       node = parseRenderEach(px, value, as, attrs);
@@ -2269,7 +2268,7 @@ function parseRenderEach(px, value, as, attrs) {
   const seqVal = parseXOpVal("render-each", value, px, vp.parseSequence);
   if (seqVal === null)
     return null;
-  const renderIt = px.addNodeIf(RenderItNode, vp.bindValIt, as);
+  const renderIt = px.addNode(RenderItNode, as);
   const attrParser = getAttrParser(px);
   const eachAttr = attrParser.eachAttr = attrParser.pushWrapper("each", value, seqVal);
   const when = attrs.getNamedItem("@when") ?? attrs.getNamedItem("when");
@@ -2469,6 +2468,12 @@ class ParseContext {
     }
     return null;
   }
+  addNode(Class, extra) {
+    const nodeId = this.nodes.length;
+    const node = new Class(nodeId, null, extra);
+    this.nodes.push(node);
+    return node;
+  }
   registerEvents() {
     const id = this.events.length;
     const events = new NodeEvents(id);
@@ -2900,7 +2905,7 @@ class Stack {
     return new Stack(comps, it, binds, newDynBinds, views, viewsId, ctx);
   }
   static root(comps, it, ctx) {
-    const binds = [new BindFrame(it, { it }, true), null];
+    const binds = [new BindFrame(it, {}, true), null];
     const dynBinds = [new ObjectFrame({}), null];
     const views = ["main", null];
     return new Stack(comps, it, binds, dynBinds, views, "", ctx)._pushProvides();
@@ -3532,6 +3537,7 @@ class App {
     this._compiled = false;
     this._renderOpts = { document: rootNode.ownerDocument };
     this._renderState = null;
+    this.rootViewName = null;
   }
   get state() {
     return this.transactor.state;
@@ -3643,7 +3649,7 @@ class App {
     const root = this.state.val;
     const stack = this.makeStack(root);
     const { renderer, rootNode, _renderOpts, _renderState } = this;
-    const newState = render(renderer.renderRoot(stack, root), rootNode, _renderOpts, _renderState);
+    const newState = render(renderer.renderRoot(stack, root, this.rootViewName), rootNode, _renderOpts, _renderState);
     this._renderState = newState;
     return newState.dom;
   }