@solidjs/babel-plugin 2.0.0-rc.11 → 2.0.0-rc.14

package/.turbo/turbo-build.log

@@ -7,4 +7,4 @@ src/shared/transform.ts -> src/dom/element.ts -> src/universal/element.ts -> src
 src/shared/transform.ts -> src/ssr/element.ts -> src/shared/transform.ts
 src/shared/transform.ts -> src/shared/component.ts -> src/shared/transform.ts
 src/shared/transform.ts -> src/shared/fragment.ts -> src/shared/transform.ts
-created index.js in 3s
+created index.js in 3.2s

package/CHANGELOG.md

@@ -1,5 +1,32 @@
 # @solidjs/babel-plugin
 
+## 2.0.0-rc.14
+
+### Patch Changes
+
+- 59fb244: SSR `hoistProps` skips TypeScript type positions when collecting captures, so on authored TSX (types parsed, stripped later) a `typeof x` query or a type named like a value no longer captures that value, or forces the literal fallback when it is reassigned (#3828).
+- 3c1f809: Preserve `/* istanbul ignore … */` and `/* c8 ignore … */` block comments written as JSX children on the generated component `children` getter. Line comments are not carried.
+- 98b916d: Fix compiled SSR output that renders `style=""` or `class=""` for `null` and `undefined`. Babel and the native compiler now omit these attributes on elements without a spread.
+- 98d35b9: Fix computed keys in compiled SSR `style` objects (builds without `serverComponents`). A computed key's name got no `;`, so `style={{ color: "red", [k]: v }}` rendered `color:redtop:1px` and the browser dropped both declarations. Hydration keeps the server's inline style, so they stayed dropped. A nullish first value also no longer leaves a leading `;`. Both compilers now pass a multi-entry object to a new `ssrStyleProperties(name, value, …)` helper, which writes the separator only between the entries it writes; a single entry keeps `ssrStyleProperty`.
+- 4f67697: **Breaking:** only `on` followed by an uppercase letter (`onClick`, `onPointerDown`) is an event handler. Lowercase `on*` names (`onclick`, `onmouseover`) are plain attributes everywhere:
+  - Both compilers compile `onclick={expr}` like any other attribute (`setAttribute`, reactive when `expr` is dynamic) instead of binding a delegated or native event, and SSR renders it as an escaped attribute instead of dropping it. A leftover 1.x `on:click={fn}` is likewise a plain namespaced attribute (it previously compiled to `addEventListener(":click", fn)`).
+  - `@solidjs/web` `spread`/`assign` set lowercase `on*` keys as attributes, the server spread walk renders them, and `useHead` applies lowercase `on*` attributes (camelCase handler names stay skipped). `ssrAttribute` escapes a function value instead of interpolating its source raw.
+  - `@solidjs/html` and `@solidjs/h` elements wrap a function passed to a lowercase `on*` in a getter like any other attribute; only `onXxx` and `ref` are exempt.
+  - `@solidjs/html` components follow `@solidjs/h`'s rule: every zero-argument function prop, `onXxx` handlers and `ref` included, is a getter, so a component handler must declare its event argument (`onClick=${e => …}`).
+  - New dev-only check `LOWERCASE_EVENT_ATTRIBUTE` (added to the `DiagnosticCode` union): warns once per attribute name when a function is set on a lowercase `on*` (or `on:`) attribute, naming the camelCase handler to use.
+
+- 7513131: Preserve the source location of captured references in SSR props constructors so source maps point to the authored expression, including dynamic TSRX tags.
+
+## 2.0.0-rc.13
+
+## 2.0.0-rc.12
+
+### Patch Changes
+
+- ad1ecc5: `serverComponents` (SSR): keep attribute-slot positions bindable on intrinsic elements. A dynamic `class` or `style` now compiles to a whole-attribute `_$ssrElementAttribute` hole instead of a value inside the template's quotes, so a server component's `class={{ selected: filters.all }}` can mark the class name a client attribute slot owns; `ref`/`on*` positions compile, as before, to one guarded `_$ssrClaim` hole per element, which now emits `_s:on:*`/`_s:ref` markers for slot reads (the `_bnd` behavior-claim marker is gone). A spread element compiles its named `ref`/`on*` (`<button {...rest} onClick={row.go} ref={row.el} />`, wherever they sit relative to the spreads) to the same claim map — `{ click: expr, ref: [a, b] }`, duplicate refs merged, a duplicate handler last-wins as on the template path — keyed by the index of the source each attribute sits before (`<b {...a} onClick={go} {...b}>` → `{ 1: { click: go } }`) and handed to `_$ssrElement` as a seventh argument, a thunk the runtime reads only inside a server component's render, so plain SSR never evaluates the expressions (they used to drop with no marker and no finding); the runtime settles each handler position in source order, as the client's `spread`/`merge()` do (the last source that has the key owns it, `undefined` included). A `ref` beside a lone spread goes through the sources loop under the option (a dynamic spread call is thunked there, as it is beside any other attribute). The event name is always the lowercased `on*` remainder (`onClick` → `click`); `on:`/`oncapture:` are not 2.0 syntaxes and are no longer special-cased. Both compilers share the `attributeSlots` server-components fixture; plain SSR output is unchanged.
+- 077c787: A `<textarea>` with a dynamic `value`/`defaultValue` no longer desyncs hydration ids for the siblings after it (#3691). The server folds the value into the textarea's text content, and that fold was taking the `_$scope` hydration-id reservation a dynamic child hole gets — but the client writes the value as a plain property effect that never allocates an id, so every component after the textarea hydrated one id off and its updates targeted detached DOM. The fold is now treated like the `innerHTML`/`textContent` redirects (#3015): opaque content, no id reservation, in both the Babel plugin and the native compiler.
+- c71486d: DOM output: an element's `ref` now runs after its attributes and spread are applied, and still before its children. A ref's own attribute writes now survive client creation the way they already survived hydration (#3685).
+
 ## 2.0.0-rc.11
 
 ## 2.0.0-rc.10

package/README.md

@@ -253,7 +253,7 @@ Inline style attributes in templates when the value is a string or `Record<strin
 - Type: `boolean`
 - Default: `false`
 
-SSR-only: emit behavior-claim (`_bnd`) markers for `ref` / `on*` on intrinsic elements.
+SSR-only: keep attribute-slot positions on intrinsic elements bindable — `ref` / `onXxx` handlers compile to a guarded `ssrClaim` hole instead of dropping, and a dynamic `class` / `style` compiles to a whole-attribute `ssrElementAttribute` hole instead of a value inside template quotes.
 
 ### hoistProps
 
@@ -329,7 +329,7 @@ const Parent = () => {
 
 ### on(eventName)
 
-CamelCase attributes such as `onClick` are event handlers. The compiler delegates events that bubble or compose, otherwise it uses Level 1 `on_____` properties.
+CamelCase attributes such as `onClick` are event handlers. The compiler delegates events that bubble or compose, otherwise it uses Level 1 `on_____` properties. Only `on` followed by an uppercase letter is an event: lowercase names such as `onclick` are plain attributes, compiled (and server-rendered) like any other attribute.
 
 Pass an array to bind a value: the second item is the first argument to the handler, the event is second.
 

package/index.js

@@ -427,13 +427,38 @@ path)
 
 }
 
+const coverageIgnoreCommentData = "solid.coverageIgnoreComments";
+
+function getCoverageIgnoreComments(path) {
+  return path.getData(coverageIgnoreCommentData);
+}
+
 // remove unnecessary JSX Text nodes
 function filterChildren(children) {
-  return children.filter(
-    ({ node: child }) =>
-    !(t__namespace.isJSXExpressionContainer(child) && t__namespace.isJSXEmptyExpression(child.expression)) && (
-    !t__namespace.isJSXText(child) || !/^[\r\n]\s*$/.test(child.extra?.raw ?? ""))
-  );
+  const filtered = [];
+  let pendingCoverageIgnoreComments = [];
+
+  for (const path of children) {
+    const child = path.node;
+    if (t__namespace.isJSXExpressionContainer(child) && t__namespace.isJSXEmptyExpression(child.expression)) {
+      pendingCoverageIgnoreComments.push(
+        ...(child.expression.innerComments?.filter(
+          (comment) =>
+          comment.type === "CommentBlock" && /^\s*(istanbul|c8)\s+ignore\b/.test(comment.value)
+        ) ?? [])
+      );
+      continue;
+    }
+    if (t__namespace.isJSXText(child) && /^[\r\n]\s*$/.test(child.extra?.raw ?? "")) {
+      continue;
+    }
+    if (pendingCoverageIgnoreComments.length) {
+      path.setData(coverageIgnoreCommentData, pendingCoverageIgnoreComments);
+      pendingCoverageIgnoreComments = [];
+    }
+    filtered.push(path);
+  }
+  return filtered;
 }
 
 function checkLength(children) {
@@ -461,6 +486,12 @@ function trimWhitespace(text) {
   return text.replace(/\s+/g, " ");
 }
 
+// Only `on` + an uppercase letter is an event handler. Lowercase `on*`
+// names (`onclick`) are plain attributes.
+function isEventName(name) {
+  return /^on[A-Z]/.test(name);
+}
+
 function toEventName(name) {
   return name.slice(2).toLowerCase();
 }
@@ -1047,6 +1078,13 @@ isSSR)
         child.extra = { raw: text, rawValue: text };
       } else {
         child = t__namespace.jsxExpressionContainer(value);
+        // The folded value is the textarea's text content on the server, but
+        // the client writes it as a plain `value` property effect that never
+        // allocates a hydration id. Flag it like the innerHTML/textContent
+        // redirects (#3015) so the SSR child pipeline skips the `_$scope` id
+        // reservation — otherwise the reservation shifts every keyed sibling
+        // after the textarea by one id (#3691).
+        child._childProperty = true;
       }
       path.node.children = [child];
       attr.remove();
@@ -2230,6 +2268,7 @@ results)
     hasChildren = path.node.children.length > 0,
     hasSpread = attributes.some((attribute) => t$1.isJSXSpreadAttribute(attribute.node)),
     config = getConfig(path);
+  const refs = [];
 
   // preprocess spreads
   if (hasSpread) {
@@ -2709,7 +2748,7 @@ results)
           binding.kind === "const" || binding.kind === "module");
         if (!isConstant && t$1.isLVal(value.expression)) {
           const refIdentifier = path.scope.generateUidIdentifier("_ref$");
-          results.exprs.unshift(
+          refs.push(
             t$1.variableDeclaration("var", [t$1.variableDeclarator(refIdentifier, value.expression)]),
             t$1.expressionStatement(
               t$1.conditionalExpression(
@@ -2738,7 +2777,7 @@ results)
         t$1.isFunction(value.expression) ||
         t$1.isArrayExpression(value.expression))
         {
-          results.exprs.unshift(
+          refs.push(
             t$1.expressionStatement(
               t$1.callExpression(
                 registerImportMethod(path, "ref", getRendererConfig(path, "dom").moduleName),
@@ -2748,7 +2787,7 @@ results)
           );
         } else {
           const refIdentifier = path.scope.generateUidIdentifier("_ref$");
-          results.exprs.unshift(
+          refs.push(
             t$1.variableDeclaration("var", [t$1.variableDeclarator(refIdentifier, value.expression)]),
             t$1.expressionStatement(
               t$1.logicalExpression(
@@ -2775,7 +2814,7 @@ results)
         }
       } else if (key === "children") {
         children = value;
-      } else if (key.startsWith("on")) {
+      } else if (isEventName(key)) {
         const ev = toEventName(key);
         if (
         config.delegateEvents && (
@@ -2978,6 +3017,9 @@ results)
     path.node.children.push(children);
   }
   if (spreadExpr) results.exprs.push(...(Array.isArray(spreadExpr) ? spreadExpr : [spreadExpr]));
+  // Refs run after the element's attributes and spread are applied, so a ref's
+  // own writes survive client creation the way they survive hydration.
+  results.exprs.push(...refs);
 
   results.hasHydratableEvent = results.hasHydratableEvent || hasHydratableEvent;
 }
@@ -4060,6 +4102,7 @@ function takeHoistedProps(program) {
 
 
 
+
 function keyName(node) {
   if (node.computed) return undefined;
   if (t__namespace.isIdentifier(node.key)) return node.key.name;
@@ -4078,6 +4121,20 @@ function insideRealFunction(path, stop) {
   return false;
 }
 
+/** Type positions are erased before the code runs: a name there (the `x` of
+ * `typeof x`, or a type that shares a value's name) is not a value the
+ * constructor can be handed. `TSType` covers `implements`/`extends` heritage. */
+function isTypePosition(path) {
+  return (
+    path.isTSType() ||
+    path.isTSTypeAnnotation() ||
+    path.isTSTypeParameterDeclaration() ||
+    path.isTSTypeParameterInstantiation() ||
+    path.isTSInterfaceDeclaration() ||
+    path.isTSTypeAliasDeclaration());
+
+}
+
 /** Is `binding` initialized by the time the site constructs its props? The
  * getter read it lazily; the constructor reads it now. A parameter or a
  * hoisted function always is. Otherwise the declaration must precede the
@@ -4163,6 +4220,10 @@ function hoistSite(p, state) {
           if (q.node.meta.name === "new" && !insideRealFunction(q, m)) fallback = true;
           return;
         }
+        if (isTypePosition(q)) {
+          q.skip();
+          return;
+        }
         if (!q.isIdentifier()) return;
         const name = q.node.name;
         let write = false;
@@ -4195,7 +4256,7 @@ function hoistSite(p, state) {
         }
         let capture = captures.get(binding);
         if (!capture) {
-          capture = { binding, name, index: captures.size };
+          capture = { binding, name, reference: q.node, index: captures.size };
           captures.set(binding, capture);
         }
         uses.add(binding);
@@ -4217,7 +4278,9 @@ function hoistSite(p, state) {
   for (const capture of captures.values()) {
     const param = scope.generateUidIdentifier("p");
     params.push(param);
-    args.push(t__namespace.identifier(capture.name));
+    const argument = t__namespace.identifier(capture.name);
+    argument.loc = capture.reference.loc;
+    args.push(argument);
     body.push(
       t__namespace.expressionStatement(
         t__namespace.assignmentExpression(
@@ -4852,10 +4915,12 @@ info)
   const hasChildren = path.node.children.length > 0,
     attributes = normalizeAttributes(path);
   let children;
-  // Server-components claims: ref/on* positions on server-rendered
-  // intrinsics collect here and emit as one guarded whole-attribute hole
-  // (` _bnd="..."` or "") after the loop. Evaluation is gated on the render
-  // context's claims flag so plain SSR never runs the expressions.
+  // Server-components handler positions: ref/on* expressions on
+  // server-rendered intrinsics collect here and emit as one guarded
+  // whole-attribute hole after the loop, where `ssrClaim` turns attribute-slot
+  // reads into `_s:on:*` / `_s:ref` markers (and drops server-local
+  // functions). Evaluation is gated on the render context's claims flag so
+  // plain SSR never runs the expressions.
   const claims = [];
 
   attributes.forEach((attribute) => {
@@ -4897,14 +4962,11 @@ info)
         return;
       }
       if (key.startsWith("prop:")) return;
-      if (key.startsWith("on")) {
-        // Capture-phase variants can't ride delegation; v1 drops them as
-        // before. `on:x` keeps the raw name, `onXxx` lowercases — the same
-        // event-name derivation as the client runtime.
-        if (info.serverComponents && !key.startsWith("oncapture:")) {
-          const pos = key.startsWith("on:") ? key.slice(3) : key.slice(2).toLowerCase();
-          if (pos) claims.push([pos, value.expression]);
-        }
+      if (isEventName(key)) {
+        // `onXxx` lowercases to the event name — the client runtime's own
+        // derivation (`onClick` -> `click`); the position is bound under it.
+        if (info.serverComponents)
+        claims.push([toEventName(key), value.expression]);
         return;
       }
       if (ChildProperties.has(key)) {
@@ -4938,6 +5000,56 @@ info)
           checkMember: true,
           checkTags: true
         });
+        // Server components (principles §9.2.3) need a whole-attribute
+        // serializer that can emit a position marker for a binding-slot
+        // value. The ordinary class/style serializers cannot bind slots.
+        // Object literals stay objects (no inlining) so a slot used as a
+        // property's value can also emit its marker.
+        if (info.serverComponents && (key === "class" || key === "style")) {
+          const attr = t.callExpression(registerImportMethod(path, "ssrElementAttribute"), [
+          t.stringLiteral(key),
+          value.expression]
+          );
+          results.template.push("");
+          results.templateValues.push(
+            isDynamicValue ?
+            hoistExpression(path, results, t.arrowFunctionExpression([], attr), {
+              group: true
+            }) :
+            attr
+          );
+          return;
+        }
+        if ((key === "class" || key === "style") && !t.isObjectExpression(value.expression)) {
+          // The whole attribute must be absent for nullish values. Keep the
+          // ordinary serializers: ssrElementAttribute would also bind slots
+          // without serverComponents. Capture the value once before testing it.
+          const id = path.scope.generateUidIdentifier("v$");
+          const attr = t.callExpression(
+            t.arrowFunctionExpression(
+              [id],
+              t.conditionalExpression(
+                t.binaryExpression("==", t.cloneNode(id), t.nullLiteral()),
+                t.stringLiteral(""),
+                t.callExpression(registerImportMethod(path, "ssrAttribute"), [
+                t.stringLiteral(key),
+                t.callExpression(
+                  registerImportMethod(path, key === "class" ? "ssrClassName" : "ssrStyle"),
+                  [t.cloneNode(id)]
+                )]
+                )
+              )
+            ),
+            [value.expression]
+          );
+          results.template.push("");
+          results.templateValues.push(
+            isDynamicValue ?
+            hoistExpression(path, results, t.arrowFunctionExpression([], attr), { group: true }) :
+            attr
+          );
+          return;
+        }
         let doEscape = true;
         let isBoolean =
         t.isBooleanLiteral(value) ||
@@ -4952,52 +5064,48 @@ info)
             if (value.expression.properties.length === 0) {
               return;
             }
-            const props = value.expression.properties.flatMap((p, i) => {
-              if (t.isSpreadElement(p) || t.isObjectMethod(p)) return [];
+            const entries = value.expression.properties.filter(
+              (p) => t.isObjectProperty(p)
+            );
+            // One entry is `ssrStyleProperty(name, value)`; several go to
+            // `ssrStyleProperties`, which writes the `;` only between the
+            // entries it writes, so a nullish one leaves no separator behind.
+            const helper = registerImportMethod(
+              path,
+              entries.length === 1 ? "ssrStyleProperty" : "ssrStyleProperties"
+            );
+            const args = entries.flatMap((p) => {
+              let name;
               if (p.computed) {
                 // Computed keys are user-controlled at runtime; wrap with
-                // `_$escape(..., true)` so ssrStyleProperty can stay a pure
-                // string concat helper (literal-key path is already safe).
-                const escape = registerImportMethod(path, "escape");
-                return t.callExpression(registerImportMethod(path, "ssrStyleProperty"), [
-                t.binaryExpression(
+                // `_$escape(..., true)` so the style helpers can stay pure
+                // string concat (the literal-key path is already safe).
+                name = t.binaryExpression(
                   "+",
-                  t.callExpression(escape, [
+                  t.callExpression(registerImportMethod(path, "escape"), [
                   p.key,
                   t.booleanLiteral(true)]
                   ),
                   t.stringLiteral(":")
-                ),
-                escapeExpression(
-                  path,
-                  p.value,
-                  true,
-                  true
-                )]
+                );
+              } else {
+                name = t.stringLiteral(
+                  (t.isIdentifier(p.key) ?
+                  p.key.name :
+                  p.key.value) + ":"
                 );
               }
-              return t.callExpression(registerImportMethod(path, "ssrStyleProperty"), [
-              t.stringLiteral(
-                (i ? ";" : "") + (
-                t.isIdentifier(p.key) ?
-                p.key.name :
-                p.key.value) +
-                ":"
-              ),
+              return [
+              name,
               escapeExpression(
                 path,
                 p.value,
                 true,
                 true
-              )]
-              );
-            });
+              )];
 
-            let res = props[0];
-            for (let i = 1; i < props.length; i++) {
-              res = t.binaryExpression("+", res, props[i]);
-            }
-            value.expression = res;
+            });
+            value.expression = t.callExpression(helper, args);
           } else {
             value.expression = t.callExpression(registerImportMethod(path, "ssrStyle"), [
             value.expression]
@@ -5081,23 +5189,7 @@ info)
     }
   });
   if (claims.length) {
-    // Duplicate event keys were already last-wins-stripped above; `ref` is
-    // exempt from that pass (client semantics fire every ref), so multiple
-    // refs merge into an array value.
-    const byPos = new Map();
-    for (const [pos, expr] of claims) {
-      let list = byPos.get(pos);
-      if (!list) byPos.set(pos, list = []);
-      list.push(expr);
-    }
-    const map = t.objectExpression(
-      [...byPos].map(([pos, exprs]) =>
-      t.objectProperty(
-        t.stringLiteral(pos),
-        exprs.length === 1 ? exprs[0] : t.arrayExpression(exprs)
-      )
-      )
-    );
+    const map = claimMap(claims);
     // `_$sharedConfig.context && _$sharedConfig.context.claims
     //    ? _$ssrClaim({...}) : ""`
     // — the claims flag is only set inside a server component's render
@@ -5243,7 +5335,7 @@ results,
 
 function createElement(
 path,
-{ topLevel, hydratable })
+{ topLevel, hydratable, serverComponents })
 {
   const tagName = getTagName(path.node),
     config = getConfig(path),
@@ -5296,6 +5388,21 @@ path,
     const node = attribute.node;
     return !(t.isJSXAttribute(node) && t.isJSXIdentifier(node.name) && node.name.name === "ref");
   });
+  // Server components (principles §9.2.3): the named `ref`/`on*` attributes
+  // of a spread element are handler positions like a template element's,
+  // and compile to the same claim map — `{ click: expr, ref: [a, b] }`,
+  // duplicate refs merged, a duplicate handler last-wins as the template
+  // path strips it — keyed by the index of the source each attribute sits
+  // before (`<b {...a} onClick={go} {...b}>` → `{ 1: { click: go } }`, the
+  // spreads being sources 0 and 2), and handed to `ssrElement` as a thunk
+  // it reads only inside a server component's render (the gate the template
+  // path's `ssrClaim` guard reads), so plain SSR never evaluates the
+  // expressions. The runtime settles each handler position in source order,
+  // as the client's `spread(el, [a, { onClick: go }, b])` does — a spread at
+  // that index or later that HAS the key owns it — and merges every ref.
+  // Plain SSR output is unchanged (dropped, as a server element has no
+  // handlers to run).
+  const claims = [];
 
   let props;
   // Attributes written AFTER the last spread are markup, not a source: no
@@ -5316,7 +5423,13 @@ path,
   // keys.
   const tail = [];
   const skipKeys = [];
-  if (propAttributes.length === 1 && t.isJSXSpreadAttribute(propAttributes[0].node)) {
+  if (
+  propAttributes.length === 1 &&
+  t.isJSXSpreadAttribute(propAttributes[0].node) &&
+  // A `ref` beside the lone spread is a claim under `serverComponents`;
+  // the loop below places it.
+  !(serverComponents && attributes.length > 1))
+  {
     props = [propAttributes[0].node.argument];
   } else {
     props = [];
@@ -5362,8 +5475,29 @@ path,
           node.name.name;
 
         if (hasChildren && key === "children") return;
-        if (key === "ref") return;
-        if (key.startsWith("prop:") || key.startsWith("on")) return;
+        if (key === "ref" || isEventName(key)) {
+          if (serverComponents && t.isJSXExpressionContainer(value)) {
+            const expression = value.expression;
+            const pos = key === "ref" ? "ref" : toEventName(key);
+            if (
+            !(
+            t.isJSXEmptyExpression(expression) ||
+            t.isStringLiteral(expression) ||
+            t.isNumericLiteral(expression) ||
+            t.isBooleanLiteral(expression)))
+
+            {
+              // The index of the source this attribute sits before: the
+              // sources pushed so far, plus the running literal if it will
+              // be pushed ahead of the next spread. The literal never
+              // carries a handler key, so a spread's index is either below
+              // this or at/after it — never ambiguous.
+              claims.push([props.length + (runningObject.length ? 1 : 0), pos, expression]);
+            }
+          }
+          return;
+        }
+        if (key.startsWith("prop:")) return;
         if (i > lastSpread) {
           const part = tailAttribute(path, tagName, key, node);
           if (part !== undefined) {
@@ -5440,10 +5574,65 @@ path,
     }
     args.push(registerSkip(path, skipKeys), markup);
   }
+  if (claims.length) {
+    if (!skipKeys.length) args.push(t.identifier("undefined"), t.identifier("undefined"));
+    args.push(t.arrowFunctionExpression([], claimSegments(claims)));
+  }
   const exprs = [t.callExpression(registerImportMethod(path, "ssrElement"), args)];
   return { exprs, template: "", declarations: [], dynamics: [], spreadElement: true };
 }
 
+/**
+ * A spread element's claim map by source index (`createElement`): `{ 1: {
+ * click: go }, 3: { ref: el } }`. A handler position keeps its LAST named
+ * attribute only — the template path's duplicate strip, applied here to the
+ * claims (a later attribute wins whatever sits between, so the earlier one
+ * is never read on either side); refs merge within a segment as `claimMap`
+ * merges them, and across segments at the runtime.
+ */
+function claimSegments(
+claims)
+{
+  const lastHandler = new Map();
+  claims.forEach(([, pos], i) => {
+    if (pos !== "ref") lastHandler.set(pos, i);
+  });
+  const segments = new Map();
+  claims.forEach(([index, pos, expr], i) => {
+    if (pos !== "ref" && lastHandler.get(pos) !== i) return;
+    let list = segments.get(index);
+    if (!list) segments.set(index, list = []);
+    list.push([pos, expr]);
+  });
+  return t.objectExpression(
+    [...segments].map(([index, list]) => t.objectProperty(t.numericLiteral(index), claimMap(list)))
+  );
+}
+
+/**
+ * The compiled claim map of an element's handler positions, `{ click: expr,
+ * ref: [a, b] }`: duplicate event keys were last-wins-stripped by the
+ * template path's duplicate strip (or `claimSegments`); `ref` is exempt from
+ * that pass (client semantics fire every ref), so multiple refs merge into
+ * an array value.
+ */
+function claimMap(claims) {
+  const byPos = new Map();
+  for (const [pos, expr] of claims) {
+    let list = byPos.get(pos);
+    if (!list) byPos.set(pos, list = []);
+    list.push(expr);
+  }
+  return t.objectExpression(
+    [...byPos].map(([pos, exprs]) =>
+    t.objectProperty(
+      t.stringLiteral(pos),
+      exprs.length === 1 ? exprs[0] : t.arrayExpression(exprs)
+    )
+    )
+  );
+}
+
 /**
  * What an attribute after an element's last spread contributes to
  * `ssrElement`'s attribute string. A static is written as the template path
@@ -5926,14 +6115,14 @@ path)
       t__namespace.isFunction(childResult[0]) ?
       childResult[0].body :
       childResult[0];
-      runningObject.push(
-        t__namespace.objectMethod(
-          "get",
-          t__namespace.identifier("children"),
-          [],
-          t__namespace.isExpression(body) ? t__namespace.blockStatement([t__namespace.returnStatement(body)]) : body
-        )
+      const getter = t__namespace.objectMethod(
+        "get",
+        t__namespace.identifier("children"),
+        [],
+        t__namespace.isExpression(body) ? t__namespace.blockStatement([t__namespace.returnStatement(body)]) : body
       );
+      if (childResult[2]?.length) getter.leadingComments = childResult[2];
+      runningObject.push(getter);
     } else runningObject.push(t__namespace.objectProperty(t__namespace.identifier("children"), childResult[0]));
   }
   if (runningObject.length || !props.length) props.push(propsLiteral(runningObject));
@@ -5994,9 +6183,11 @@ config)
   if (!filteredChildren.length) return;
   let dynamic = false;
   let pathNodes = [];
+  let coverageIgnoreComments;
 
   let transformedChildren = filteredChildren.reduce(
     (memo, path) => {
+      coverageIgnoreComments ||= getCoverageIgnoreComments(path);
       if (t__namespace.isJSXText(path.node)) {
         const v = htmlEntities.decode(trimWhitespace(path.node.extra?.raw ?? ""));
         if (v.length) {
@@ -6053,7 +6244,7 @@ config)
     transformedChildren = t__namespace.arrowFunctionExpression([], t__namespace.arrayExpression(transformedChildren));
     dynamic = true;
   }
-  return [transformedChildren, dynamic];
+  return [transformedChildren, dynamic, coverageIgnoreComments];
 }
 
 function transformFragmentChildren(

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@solidjs/babel-plugin",
   "description": "Babel compiler plugin for Solid templates",
-  "version": "2.0.0-rc.11",
+  "version": "2.0.0-rc.14",
   "author": "Ryan Carniato",
   "license": "MIT",
   "repository": {