Bizarre error with Alpine.initTree

[Lomacar]

Any clue why I get this error when I call Alpine.initTree? I've been bashing my head against this all day.

cdn.js:484 Uncaught (in promise) TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator))
    at Function.from (<anonymous>)
    at directives (cdn.js:484)
    at cdn.js:700
    at walk (cdn.js:637)
    at cdn.js:699
    at deferHandlingDirectives (cdn.js:509)
    at Object.initTree (cdn.js:698)
    at ewok.js:254

Line 484 says Array.from(attributes).map(.... When the error happens 'attributes' is undefined. But for the life of me I can't understand why. Well, I see that in the step before that it tried getting el2.attributes, but el2 is a shadowRoot node (no attributes property). But I can't understand why sometimes it is and sometimes it isn't. My code calls initTree on a shadoRoot every time and it hasn't been a problem until now.

It never happens for me in Firefox or Edge. Only in Chrome and Brave. Chrome was my main browser until I switched to Brave. The error happens less when I run in a private window, but can still happen. I have tried disabling extensions and simplifying my code and it reduces the error rate but not entirely. Actually, it looks like it has entirely removed the problem in a private window. Anyway, it seems that anything that causes a slowdown in the code execution can increase the failure rate, but actually enabling or disable cache doesn't seem to affect it.

The context is that I am calling initTree in a Promise callback in a connectedCallback for a custom element. So far so good. The problem doesn't occur until 2 things happen.

1. I am nesting a custom element inside a custom element. (the same connectedCallback code runs for both elements)
2. The element definitions are being imported from an external file before this runs.

There are no Alpine attributes on the html of the custom elements. The elements can be entirely empty (except for the one containing the other). The outer element is processed before the inner element. The error only happens on the inner element.

I think that's all there is to it. An intermittent error in Brave/Chrome with extensions installed (though no particular one is to blame), on a nested custom element when Alpine.initTree is called on its shadowRoot.

Oh yeah, and I have logged 5000 different things, including everything down the callstack to the error and I never see any difference between when the error happens or not. I thought maybe there would be some kind of timing issue and things are happening in a different order, but I haven't been able to find that.

UPDATE:
I finally managed to find a timing difference when I put a logpoint at :637, the walk() function. I am using a sort of hack to import html via an iframe. When the page loads smoothly, the iframe is processed by that walk() function at the very end. But when the error happens the iframe is walked before the nested custom element. Normally the nested element is second-to-last. I don't know what that all means or how to fix it. I tried lazy loading the iframe and putting x-ignore on it, to no avail.

UPDATE2:
It's only getting more confusing. Despite the appearance of it being a timing issue, I have checked the timing of things and simply tried running my own code only after the page has completely loaded and Alpine has finished doing its thing. I have manually triggered my code several seconds later and the error now consistently happens in all the aforementioned browsers except Firefox.

What would cause Alpine to try to process shadowRoots on Chromium browsers but not in Firefox?

UPDATE3:
This feels like trying to debug quantum physics, because putting breakpoints on Alpine changes its behaviour. And using log points in Firefox and Chrome to try to compare, things don't log in a consistent order even within the same browser, so it is hard to assess what is different.

[Lomacar]

I should have thought of this sooner, but the answer was to not run initTree again on the nested elements. Actually, I'm not sure how the code works that way, because I thought I would need to initTree inside each shadowRoot, but I guess Alpine actually does see into shadowRoots? I was under the impression it did not. I'm confused. But at least I got my code running!