From b14498822bc3d1ff7d15113b4ec04c92b807a3af Mon Sep 17 00:00:00 2001
From: Susanne Kirchner <susanne.kirchner@sick.de>
Date: Wed, 16 Oct 2024 16:53:11 +0200
Subject: [PATCH] sl-tab-group throws error if unmounted too fast (#2218)

* Add check for undefined element on disconnect

* Fix prettier error
---
 src/components/tab-group/tab-group.component.ts | 5 ++++-
 src/components/tab-group/tab-group.test.ts      | 7 +++++++
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/components/tab-group/tab-group.component.ts b/src/components/tab-group/tab-group.component.ts
index 3c4df94c..7f887eb8 100644
--- a/src/components/tab-group/tab-group.component.ts
+++ b/src/components/tab-group/tab-group.component.ts
@@ -128,7 +128,10 @@ export default class SlTabGroup extends ShoelaceElement {
   disconnectedCallback() {
     super.disconnectedCallback();
     this.mutationObserver?.disconnect();
-    this.resizeObserver?.unobserve(this.nav);
+
+    if (this.nav) {
+      this.resizeObserver?.unobserve(this.nav);
+    }
   }
 
   private getAllTabs() {
diff --git a/src/components/tab-group/tab-group.test.ts b/src/components/tab-group/tab-group.test.ts
index 2a27ecfb..72a4b998 100644
--- a/src/components/tab-group/tab-group.test.ts
+++ b/src/components/tab-group/tab-group.test.ts
@@ -84,6 +84,13 @@ describe('<sl-tab-group>', () => {
     expect(tabGroup).to.be.visible;
   });
 
+  it('should not throw error when unmounted too fast', async () => {
+    const el = await fixture(html` <div></div> `);
+
+    el.innerHTML = '<sl-tab-group></sl-tab-group>';
+    el.innerHTML = '';
+  });
+
   it('is accessible', async () => {
     const tabGroup = await fixture<SlTabGroup>(html`
       <sl-tab-group>