why would the internal x-effect have a timing to output an empty $data

[debuggedme]

<section x-data="{section: {}}"
 x-effect="console.log('section', $data);"
 x-html="$data.section.html ? $data.section.html : $el.innerHTML" 
>
 <template 
  x-effect="console.log('template', $data); if ($data.main && $data.main.md) $data.section.html = $data.main.md.render($el.content.textContent)"
 >
 </template>
</section>

console out

section Proxy(Object) {objects: Array(2)}
template Proxy(Object) {objects: Array(2)}
template Proxy(Object) {objects: Array(0)}[[Handler]]: Object[[Target]]: Object[[IsRevoked]]: false
template Proxy(Object) {objects: Array(2)}

Why was the x-data output empty in line:3?

[ekwoka]

Because the element was rapidly added and removed and it resulted in the effect running once when the element was no in the page at all, so it didn't have a datastack.

This code is really strange though...

[debuggedme]

I understand that even with quick additions and deletions, the template node at this time can still see the x-data space of the outer elements, such as $data.section and the even outermost one (which is not written here) $data.main, because no matter how additions and deletions occur, they happen on child elements.

Additionally, what is the strange point?

[debuggedme]

It seems to have nothing to do with the template tag, as all tags behave similarly. So why would the internal x-effect have a timing to output an empty $data?

[SimoTod]

Everything mentioned in the effect will trigger the effect when changed so you should never set anything in qlan effect but always do it on the nextTick otherwise you get an effect that calls itslef. As mentioned above, your effect "deletes" the template itself which creates a leak where your template only exists in memory but is not linked to a component anymore so it will pront an empty data.

Not sure what the code is trying to achieve but ot looks like you could just use x-if.

[ekwoka]

he template node at this time can still see the x-data space of the outer elements,

No it can't. The array there is empty.

It seems to have nothing to do with the template tag, as all tags behave similarly. So why would the internal x-effect have a timing to output an empty $data?

It affects all tags, because the effect is running while the element is disconnected.

Additionally, what is the strange point?

The whole code. Why replacing the html in so many places like how you are here? It is just really strange.

could you not just have a getter that does the md to html process? Then you need none of this...

[debuggedme]

One way is to keep the template element, and another way is to safely remove an element managed by Alpine.

[ekwoka]

no just

x-html="main.md.render($el.textContent)"

[debuggedme]

I need a place to put the raw Markdown text, and I'm using the template tag. The template will not be displayed on the document, but you can still access it. I've considered placing a section tag and a template tag at the same level, but both the section tag and the template tag require a more top x-data parent node.

The problem with x-html="main.md.render($el.textContent)" is that people might see a bunch of raw Markdown content before the Markdown render loads. Of course, you can control this with :class.