Web components initialization and lifecycle pitfalls

I've been writing some vanilla web components lately, and it has made me greatly appreciate how Lit abstracts away a lot of the quirks in the web platform. Here are a few aha! moments I've had: isConnected becomes true before connectedCallback() is called You can't rely on isConnected to determine if connectedCallback() has already been called: connectedCallback() { this.foo = 'bar' } doSomething() { if (!this.isConnected) return console.log(this.foo) // 'bar' | undefined } If you hav...