fix(html): add destroy guards to connectedCallback (#1284)

packages/html/src/ui/alert-dialog/alert-dialog-element.ts

@@ -40,6 +40,7 @@ export class AlertDialogElement extends MediaElement {
 
   override connectedCallback(): void {
     super.connectedCallback();
+    if (this.destroyed) return;
 
     this.#dialog = createAlertDialog({
       transition: createTransition(),

packages/html/src/ui/buffering-indicator/buffering-indicator-element.ts

@@ -22,6 +22,7 @@ export class BufferingIndicatorElement extends MediaElement {
 
   override connectedCallback(): void {
     super.connectedCallback();
+    if (this.destroyed) return;
 
     this.#disconnect = new AbortController();
 

packages/html/src/ui/error-dialog/error-dialog-element.ts

@@ -41,6 +41,7 @@ export class ErrorDialogElement extends MediaElement {
 
   override connectedCallback(): void {
     super.connectedCallback();
+    if (this.destroyed) return;
 
     this.#dialog = createAlertDialog({
       transition: createTransition(),

packages/html/src/ui/media-button-element.ts

@@ -41,6 +41,7 @@ export abstract class MediaButtonElement<Core extends MediaButtonComponent> exte
 
   override connectedCallback(): void {
     super.connectedCallback();
+    if (this.destroyed) return;
 
     if (this.hotkeyAction && !this.#hotkeyRegistry) {
       this.#hotkeyRegistry = new AriaKeyShortcutsController(this, this.hotkeyAction);