diff --git a/src/public/javascripts/services/app_context.js b/src/public/javascripts/services/app_context.js
index fd1dd3e6b..edef7058d 100644
--- a/src/public/javascripts/services/app_context.js
+++ b/src/public/javascripts/services/app_context.js
@@ -161,13 +161,7 @@ class AppContext {
 
     /** @returns {TabContext} */
     getActiveTabContext() {
-        const activeTabEl = this.tabRow.activeTabEl;
-
-        if (!activeTabEl) {
-            return null;
-        }
-
-        const tabId = activeTabEl.getAttribute('data-tab-id');
+        const tabId = this.tabRow.activeTabId;
 
         return this.tabContexts.find(tc => tc.tabId === tabId);
     }
@@ -294,7 +288,7 @@ class AppContext {
     async filterTabs(noteId) {
         for (const tc of this.tabContexts) {
             if (tc.notePath && !tc.notePath.split("/").includes(noteId)) {
-                await this.tabRow.removeTab(tc.$tab[0]);
+                this.tabRow.removeTab(tc.tabId);
             }
         }
 
@@ -349,15 +343,11 @@ class AppContext {
         this.openEmptyTab();
     }
 
-    async activeTabChangedListener({tabEl}) {
-        const tabId = tabEl.getAttribute('data-tab-id');
-
+    async activeTabChangedListener({tabId}) {
         await this.showTab(tabId);
     }
 
-    async tabRemoveListener({tabEl}) {
-        const tabId = tabEl.getAttribute('data-tab-id');
-
+    async tabRemoveListener({tabId}) {
         this.tabContexts.filter(nc => nc.tabId === tabId)
             .forEach(tc => tc.remove());
 
@@ -383,7 +373,7 @@ keyboardActionService.setGlobalActionHandler('OpenNewTab', () => {
 
 keyboardActionService.setGlobalActionHandler('CloseActiveTab', () => {
     if (this.tabRow.activeTabEl) {
-        this.tabRow.removeTab(this.tabRow.activeTabEl);
+        this.tabRow.removeTab(this.tabRow.activeTabId);
     }
 });
 
diff --git a/src/public/javascripts/services/note_detail.js b/src/public/javascripts/services/note_detail.js
index 77b2f6ad2..045211e1b 100644
--- a/src/public/javascripts/services/note_detail.js
+++ b/src/public/javascripts/services/note_detail.js
@@ -139,7 +139,7 @@ async function noteDeleted(noteId) {
         // not removing active even if it contains deleted note since that one will move to another note (handled by deletion logic)
         // and we would lose tab context state (e.g. sidebar visibility)
         if (!tc.isActive() && tc.notePath && tc.notePath.split("/").includes(noteId)) {
-            await tabRow.removeTab(tc.$tab[0]);
+            tabRow.removeTab(tc.tabId);
         }
     }
 }
diff --git a/src/public/javascripts/services/tab_context.js b/src/public/javascripts/services/tab_context.js
index fd2e0bc6d..7a3e84566 100644
--- a/src/public/javascripts/services/tab_context.js
+++ b/src/public/javascripts/services/tab_context.js
@@ -109,7 +109,7 @@ class TabContext extends Component {
     }
 
     isActive() {
-        return this.$tab[0] === this.tabRow.activeTabEl;
+        return this.tabId === this.tabRow.activeTabId;
     }
 
     setupClasses() {
@@ -213,7 +213,7 @@ class TabContext extends Component {
         return {
             tabId: this.tabId,
             notePath: this.notePath,
-            active: this.tabRow.activeTabEl === this.$tab[0]
+            active: this.tabRow.activeTabId === this.tabId
         }
     }
 
diff --git a/src/public/javascripts/widgets/tab_row.js b/src/public/javascripts/widgets/tab_row.js
index 875f5da3b..67a6d813e 100644
--- a/src/public/javascripts/widgets/tab_row.js
+++ b/src/public/javascripts/widgets/tab_row.js
@@ -399,17 +399,23 @@ export default class TabRowWidget extends BasicWidget {
 
     setTabCloseEventListener(tabEl) {
         tabEl.querySelector('.note-tab-close')
-            .addEventListener('click', _ => this.removeTab(tabEl));
+            .addEventListener('click', _ => this.removeTab(tabEl.getAttribute('data-tab-id')));
 
         tabEl.addEventListener('mousedown', e => {
             if (e.which === 2) {
-                this.removeTab(tabEl);
+                this.removeTab(tabEl.getAttribute('data-tab-id'));
 
                 return true; // event has been handled
             }
         });
     }
 
+    get activeTabId() {
+        const tabEl = this.activeTabEl;
+
+        return tabEl ? tabEl.getAttribute('data-tab-id') : null;
+    }
+
     get activeTabEl() {
         return this.$widget.find('.note-tab[active]')[0];
     }
@@ -458,40 +464,42 @@ export default class TabRowWidget extends BasicWidget {
         return !!this.activeTabEl;
     }
 
-    async activateTab(tabEl) {
+    activateTab(tabEl) {
         const activeTabEl = this.activeTabEl;
         if (activeTabEl === tabEl) return;
         if (activeTabEl) activeTabEl.removeAttribute('active');
         tabEl.setAttribute('active', '');
-        await this.trigger('activeTabChanged', { tabEl });
+        this.trigger('activeTabChanged', { tabId: tabEl.getAttribute('data-tab-id') });
     }
 
-    async removeTab(tabEl) {
+    removeTab(tabId) {
+        const tabEl = this.$widget.find(`[data-tab-id='${tabId}']`)[0];
+
         if (tabEl === this.activeTabEl) {
             if (tabEl.nextElementSibling && tabEl.nextElementSibling.classList.contains("note-tab")) {
-                await this.activateTab(tabEl.nextElementSibling)
+                this.activateTab(tabEl.nextElementSibling)
             } else if (tabEl.previousElementSibling && tabEl.previousElementSibling.classList.contains("note-tab")) {
-                await this.activateTab(tabEl.previousElementSibling)
+                this.activateTab(tabEl.previousElementSibling)
             }
         }
         tabEl.parentNode.removeChild(tabEl);
-        await this.trigger('tabRemove', { tabEl });
+        this.trigger('tabRemove', { tabId: tabEl.getAttribute('data-tab-id') });
         this.cleanUpPreviouslyDraggedTabs();
         this.layoutTabs();
         this.setupDraggabilly();
         this.setVisibility();
     }
 
-    async removeAllTabs() {
+    removeAllTabs() {
         for (const tabEl of this.tabEls) {
-            await this.removeTab(tabEl);
+            this.removeTab(tabEl.getAttribute('data-tab-id'));
         }
     }
 
-    async removeAllTabsExceptForThis(remainingTabEl) {
+    removeAllTabsExceptForThis(remainingTabEl) {
         for (const tabEl of this.tabEls) {
             if (remainingTabEl !== tabEl) {
-                await this.removeTab(tabEl);
+                this.removeTab(tabEl.getAttribute('data-tab-id'));
             }
         }
     }
@@ -585,7 +593,7 @@ export default class TabRowWidget extends BasicWidget {
         })
     }
 
-    async animateTabMove(tabEl, originIndex, destinationIndex) {
+    animateTabMove(tabEl, originIndex, destinationIndex) {
         if (destinationIndex < originIndex) {
             tabEl.parentNode.insertBefore(tabEl, this.tabEls[destinationIndex]);
         } else {
@@ -593,7 +601,7 @@ export default class TabRowWidget extends BasicWidget {
 
             tabEl.parentNode.insertBefore(tabEl, beforeEl);
         }
-        await this.trigger('tabReorder', { tabEl, originIndex, destinationIndex });
+        this.trigger('tabReorder');
         this.layoutTabs();
     }