@barefootjs/test 0.33.0 → 0.33.2

package/dist/index.js

@@ -190096,6 +190096,7 @@ var ErrorCodes = {
   MISSING_KEY_IN_LIST: "BF023",
   MISSING_KEY_IN_NESTED_LIST: "BF024",
   UNSUPPORTED_DESTRUCTURE_REST: "BF025",
+  RETURN_VALUE_NOT_JSX: "BF027",
   PROPS_DESTRUCTURING: "BF043",
   SIGNAL_GETTER_NOT_CALLED: "BF044",
   JSX_IN_LOCAL_FUNCTION: "BF045",
@@ -190127,6 +190128,7 @@ var errorMessages = {
   [ErrorCodes.MISSING_KEY_IN_LIST]: "Missing key attribute in list rendering. Add a key prop for efficient updates",
   [ErrorCodes.MISSING_KEY_IN_NESTED_LIST]: "Nested .map() loop requires key attribute for event delegation. Add a key prop to elements in the inner loop",
   [ErrorCodes.UNSUPPORTED_DESTRUCTURE_REST]: "Computed property key in .map() callback destructure is not supported. Rewrite the callback to destructure explicit bindings (e.g., `({ a, b }) => ...`) so the compiler can rewrite references to per-item signal accessors.",
+  [ErrorCodes.RETURN_VALUE_NOT_JSX]: "Component's return value is not recognized as JSX — return the JSX expression directly instead of binding it to a local variable first.",
   [ErrorCodes.PROPS_DESTRUCTURING]: "Props destructuring in function parameters breaks reactivity. Use props object directly.",
   [ErrorCodes.SIGNAL_GETTER_NOT_CALLED]: "Signal/memo getter passed without calling it. Use getter() to read the value.",
   [ErrorCodes.JSX_IN_LOCAL_FUNCTION]: "Local function returns JSX but cannot be inlined. Extract it as a top-level PascalCase component or use a single return statement.",
@@ -190696,6 +190698,14 @@ function visitComponentBody(node, ctx) {
     }
   }
   if (isTopLevel && (import_typescript9.default.isTryStatement(node) || import_typescript9.default.isSwitchStatement(node) || import_typescript9.default.isForStatement(node) || import_typescript9.default.isForInStatement(node) || import_typescript9.default.isForOfStatement(node) || import_typescript9.default.isWhileStatement(node) || import_typescript9.default.isDoStatement(node) || import_typescript9.default.isThrowStatement(node) || import_typescript9.default.isBlock(node) && node.parent === ctx.componentBodyBlock)) {
+    if (import_typescript9.default.isBlock(node)) {
+      const returnedLocal = findBlockBodyReturnedJsxLocalName(node);
+      if (returnedLocal) {
+        ctx.errors.push(createError(ErrorCodes.RETURN_VALUE_NOT_JSX, getSourceLocation(node, ctx.sourceFile, ctx.filePath), {
+          message: `Component '${ctx.componentName ?? "(unknown)"}' return value is not recognized ` + `as JSX — return the JSX expression directly instead of binding it to a local ` + `variable first (\`return ${returnedLocal}\` after \`const ${returnedLocal} = ` + `<jsx/>\` is not resolved at return position).`
+        }));
+      }
+    }
     collectInitStatement(node, ctx);
     return;
   }
@@ -190731,6 +190741,31 @@ function unwrapJsxTransparent(expr) {
   }
   return current;
 }
+function findBlockBodyReturnedJsxLocalName(block) {
+  const stmts = block.statements;
+  const last = stmts[stmts.length - 1];
+  if (!last || !import_typescript9.default.isReturnStatement(last) || !last.expression)
+    return null;
+  const returned = unwrapJsxTransparent(last.expression);
+  if (!import_typescript9.default.isIdentifier(returned))
+    return null;
+  const name = returned.text;
+  for (const stmt of stmts) {
+    if (!import_typescript9.default.isVariableStatement(stmt))
+      continue;
+    for (const decl of stmt.declarationList.declarations) {
+      if (!import_typescript9.default.isIdentifier(decl.name) || decl.name.text !== name || !decl.initializer)
+        continue;
+      let init = decl.initializer;
+      while (import_typescript9.default.isParenthesizedExpression(init))
+        init = init.expression;
+      if (import_typescript9.default.isJsxElement(init) || import_typescript9.default.isJsxSelfClosingElement(init) || import_typescript9.default.isJsxFragment(init) || initializerShapeContainsJsx(init) || isMapLikeCallWithJsx(init)) {
+        return name;
+      }
+    }
+  }
+  return null;
+}
 function extractJsxFromExpression(expr) {
   const inner = unwrapJsxTransparent(expr);
   if (import_typescript9.default.isJsxElement(inner) || import_typescript9.default.isJsxFragment(inner) || import_typescript9.default.isJsxSelfClosingElement(inner)) {
@@ -194947,8 +194982,14 @@ function buildIRRoot(analyzer) {
   }
   ctx.isRoot = false;
   const ir = transformJsxExpression(jsxReturn, ctx);
-  if (ir === null)
+  if (ir === null) {
+    if (import_typescript13.default.isIdentifier(jsxReturn) && (analyzer.jsxConstants.has(jsxReturn.text) || analyzer.inlineableJsxConsts.has(jsxReturn.text))) {
+      analyzer.errors.push(createError(ErrorCodes.RETURN_VALUE_NOT_JSX, getSourceLocation(jsxReturn, analyzer.sourceFile, analyzer.filePath), {
+        message: `Component '${analyzer.componentName ?? "(unknown)"}' return value is not recognized ` + `as JSX — return the JSX expression directly instead of binding it to a local variable ` + `first (\`return ${jsxReturn.text}\` after \`const ${jsxReturn.text} = <jsx/>\` is not ` + `resolved at return position).`
+      }));
+    }
     return null;
+  }
   return wrapInScopeElement(ir);
 }
 function needsScopeWrapper(ir) {
@@ -195398,6 +195439,31 @@ function unwrapHoistedFragment(node) {
     return node;
   return { ...only, needsScope: true };
 }
+function markDataKeyCarrier(children) {
+  for (let i2 = 0;i2 < children.length; i2++) {
+    const marked = markCarrierIn(children[i2]);
+    if (!marked)
+      continue;
+    const out = children.slice();
+    out[i2] = marked;
+    return out;
+  }
+  return children;
+}
+function markCarrierIn(node) {
+  if (node.type === "element") {
+    return { ...node, carriesDataKey: true };
+  }
+  if (node.type === "conditional") {
+    const cond = node;
+    const whenTrue = markCarrierIn(cond.whenTrue);
+    const whenFalse = markCarrierIn(cond.whenFalse);
+    if (!whenTrue && !whenFalse)
+      return null;
+    return { ...cond, whenTrue: whenTrue ?? cond.whenTrue, whenFalse: whenFalse ?? cond.whenFalse };
+  }
+  return null;
+}
 function transformFragment(node, ctx) {
   const isFragmentRoot = ctx.isRoot;
   const isTransparent = isFragmentRoot && isTransparentFragment(node, ctx);
@@ -195408,7 +195474,7 @@ function transformFragment(node, ctx) {
   const needsScopeComment = isFragmentRoot && !isTransparent || undefined;
   return {
     type: "fragment",
-    children,
+    children: needsScopeComment ? markDataKeyCarrier(children) : children,
     transparent: isTransparent || undefined,
     needsScopeComment,
     loc: getSourceLocation(node, ctx.sourceFile, ctx.filePath)
@@ -198063,6 +198129,35 @@ function getStringValue(node) {
   }
   return null;
 }
+function unwrapTransparentTsWrappers(node) {
+  let n = node;
+  while (import_typescript13.default.isParenthesizedExpression(n) || import_typescript13.default.isAsExpression(n) || import_typescript13.default.isSatisfiesExpression(n) || import_typescript13.default.isNonNullExpression(n)) {
+    n = n.expression;
+  }
+  return n;
+}
+function expressionWrapsJsx(node) {
+  const n = unwrapTransparentTsWrappers(node);
+  if (import_typescript13.default.isJsxElement(n) || import_typescript13.default.isJsxSelfClosingElement(n) || import_typescript13.default.isJsxFragment(n))
+    return true;
+  if (import_typescript13.default.isConditionalExpression(n)) {
+    return expressionWrapsJsx(n.whenTrue) || expressionWrapsJsx(n.whenFalse);
+  }
+  if (import_typescript13.default.isArrayLiteralExpression(n)) {
+    return n.elements.some((el) => expressionWrapsJsx(import_typescript13.default.isSpreadElement(el) ? el.expression : el));
+  }
+  return false;
+}
+function reportNakedJsxWrapperProp(ctx, attr, propName, jsxExpr) {
+  const shape = import_typescript13.default.isConditionalExpression(jsxExpr) ? "a ternary" : "an array literal";
+  ctx.analyzer.errors.push(createError(ErrorCodes.UNSUPPORTED_JSX_PATTERN, getSourceLocation(attr, ctx.sourceFile, ctx.filePath), {
+    message: `Prop '${propName}' is ${shape} wrapping JSX (${jsxExpr.getText(ctx.sourceFile)}). ` + `This shape is not compiled — only a JSX element/fragment given DIRECTLY as the prop value is.`,
+    suggestion: {
+      message: `Move the conditional/array out of the prop position: compute it in a local ` + `const and pass it as the component's children instead of a named prop ` + `(e.g. const ${propName} = ${jsxExpr.getText(ctx.sourceFile)}; <Comp>{${propName}}</Comp>). ` + `Wrapping the ternary/array in a fragment at the prop position ` + `(${propName}={<>{${jsxExpr.getText(ctx.sourceFile)}}</>}) is NOT a safe escape here: it compiles, ` + `but the child's own reactive prop getter receives the branch's HTML unbranded and re-escapes it as ` + `text on the child's very next reactive run, corrupting the DOM (a narrower gap #2651's door ` + `inventory left open — tracked separately).`,
+      escape: [{ kind: "rewrite" }]
+    }
+  }));
+}
 function processComponentProps(attributes, ctx) {
   const props = [];
   for (const attr of attributes.properties) {
@@ -198074,10 +198169,7 @@ function processComponentProps(attributes, ctx) {
       continue;
     const name = attr.name.getText(ctx.sourceFile);
     if (attr.initializer && import_typescript13.default.isJsxExpression(attr.initializer) && attr.initializer.expression) {
-      let jsxExpr = attr.initializer.expression;
-      while (import_typescript13.default.isParenthesizedExpression(jsxExpr)) {
-        jsxExpr = jsxExpr.expression;
-      }
+      const jsxExpr = unwrapTransparentTsWrappers(attr.initializer.expression);
       if (import_typescript13.default.isJsxElement(jsxExpr) || import_typescript13.default.isJsxSelfClosingElement(jsxExpr) || import_typescript13.default.isJsxFragment(jsxExpr)) {
         const prevInsideComponentChildren = ctx.insideComponentChildren;
         ctx.insideComponentChildren = true;
@@ -198092,6 +198184,10 @@ function processComponentProps(attributes, ctx) {
           continue;
         }
       }
+      if ((import_typescript13.default.isConditionalExpression(jsxExpr) || import_typescript13.default.isArrayLiteralExpression(jsxExpr)) && expressionWrapsJsx(jsxExpr)) {
+        reportNakedJsxWrapperProp(ctx, attr, name, jsxExpr);
+        continue;
+      }
     }
     let value = getAttributeValue(attr, ctx);
     if (value.kind === "template") {
@@ -198474,6 +198570,10 @@ function buildIfStatementChain(analyzer, ctx, opts) {
   return alternate;
 }
 
+// ../jsx/src/ir-to-client-js/prop-handling.ts
+var _localConstantValuesCache = new WeakMap;
+var _restSpreadNamesCache = new WeakMap;
+
 // ../jsx/src/ir-to-client-js/control-flow/stringify/template-parse.ts
 var SVG_ROOT_TAGS = new Set([
   "svg",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@barefootjs/test",
-  "version": "0.33.0",
+  "version": "0.33.2",
   "description": "Test utilities for BarefootJS - IR-based component testing without a browser",
   "type": "module",
   "main": "./dist/index.js",
@@ -39,7 +39,7 @@
     "directory": "packages/test"
   },
   "dependencies": {
-    "@barefootjs/jsx": "0.33.0"
+    "@barefootjs/jsx": "0.33.2"
   },
   "devDependencies": {
     "typescript": "^5.0.0"