fix: cached values inside attribute tags

.changeset/nine-pumas-raise.md

@@ -0,0 +1,5 @@
+---
+"@marko/tags-api-preview": patch
+---
+
+Fix issue with cached values inside attribute tags.

src/__tests__/fixtures/misc/attribute-tags/__snapshots__/misc-attribute-tags/single/node.render.expected.html

@@ -0,0 +1,18 @@
+<div
+  data-key="hello"
+  name="Frank"
+>
+  Hello Frank!
+</div>
+<div
+  data-key="hello"
+  name="Frank"
+>
+  Hello Frank!
+</div>
+<div
+  data-key="hello"
+  name="John"
+>
+  Hello John!
+</div>

src/__tests__/fixtures/misc/attribute-tags/__snapshots__/misc-attribute-tags/single/web.render.expected.html

@@ -0,0 +1,18 @@
+<div
+  data-key="hello"
+  name="Frank"
+>
+  Hello Frank!
+</div>
+<div
+  data-key="hello"
+  name="Frank"
+>
+  Hello Frank!
+</div>
+<div
+  data-key="hello"
+  name="John"
+>
+  Hello John!
+</div>

src/__tests__/fixtures/misc/attribute-tags/components/test.marko

@@ -0,0 +1,17 @@
+<!-- use tags -->
+<for|key, value| in=input>
+  <if=value>
+    <if=Array.isArray(value)>
+      <for|item| of=value>
+        <div data-key=key ...item>
+          <${item}/>
+        </div>
+      </for>
+    </if>
+    <else>
+      <div data-key=key ...value>
+        <${value}/>
+      </div>
+    </else>
+  </if>
+</for>

src/__tests__/fixtures/misc/attribute-tags/index.test.ts

@@ -0,0 +1,5 @@
+import fixture from "../../../fixture";
+
+describe("misc attribute tags", () => {
+  describe("single", fixture("./templates/single.marko"));
+});

src/__tests__/fixtures/misc/attribute-tags/templates/single.marko

@@ -0,0 +1,17 @@
+<!-- use tags -->
+<test>
+  <@hello name="Frank" onClick() {
+    console.log('Hello Frank!');
+  }>
+    Hello Frank!
+  </@hello>
+</test>
+<test>
+  <for|name| of=["Frank", "John"]>
+    <@hello name=name onClick() {
+      console.log('Hello ' + name + '!');
+    }>
+      Hello ${name}!
+    </@hello>
+  </for>
+</test>

src/transform/wrapper-component.ts

@@ -1,5 +1,11 @@
 import { types as t } from "@marko/compiler";
-import { isNativeTag, getTagDef } from "@marko/babel-utils";
+import {
+  isNativeTag,
+  isTransparentTag,
+  isAttributeTag,
+  findParentTag,
+  getTagDef,
+} from "@marko/babel-utils";
 import { taglibId } from "../util/taglib-id";
 import isApi from "../util/is-api";
 
@@ -96,6 +102,14 @@ export function ensureLifecycle(tag: t.NodePath<t.MarkoTag>, client = true) {
     isNativeTag(root as t.NodePath<t.MarkoTag>)
   );
 
+  if (isAttributeTagLike(tag)) {
+    if (isTransparentTag(root as t.NodePath<t.MarkoTag>)) {
+      root = findParentTag(root as t.NodePath<t.MarkoTag>) || program;
+    }
+
+    root = findParentTag(root as t.NodePath<t.MarkoTag>) || program;
+  }
+
   if (root.node) {
     const roots = lifecycleRootsForProgram.get(program)!;
     let extra = root.node.extra;
@@ -182,3 +196,19 @@ function buildNestedLifecycle(tag: t.NodePath<t.MarkoTag>): t.Statement[] {
 
   return result;
 }
+
+function isAttributeTagLike(tag: t.NodePath<t.MarkoTag>) {
+  if (isAttributeTag(tag)) {
+    return true;
+  }
+
+  if (isTransparentTag(tag)) {
+    for (const child of tag.get("body").get("body")) {
+      if (child.isMarkoTag() && isAttributeTagLike(child)) {
+        return true;
+      }
+    }
+  }
+
+  return false;
+}