I've run into some problems with the Custom Element lifecycle, though. Not sure how to solve them, because `connectedCallback` is the wrong place for my custom code. The odds are I am doing it wrong (or have a fundamental misunderstanding!)
Basically, lets say I have two custom elements: A and B.
All Bs are a descendant (even if not direct) of an A.
Each A grabs all B children and copies the data out of a specified child of the B, then uses it.[1]
When the connectedCallback for A is executed, the Bs are not yet connected and thus don't show up in a call to querySelector.
I've (sort of) worked around this by having each B, when connected, find the closest A ancestor, and add itself to an array field of that ancestor. A's connectedCallback performs a setInterval with ever-increasing delays until some specific maximum (I use 10ms). The setInterval just redisplays with whatever labels are in the array.
Now, this is probably a stupid way of doing this, and I believe a better way is to use MutationObserver, which I will probably switch to at some point.
However, my point is still: the life-cycle did not offer me some way to hook into A only when all the children are attached to the DOM.
[1] A practical example of this would be tabbed-containers. The <tab-container> shouldn't hold the labels for each <tab-item>, it should get the labels from the <tab-item> itself.