diff --git a/app/client/src/utils/hooks/useWidgetFocus/handleTab.ts b/app/client/src/utils/hooks/useWidgetFocus/handleTab.ts
index c09cc4cb7b..9c4bc2a889 100644
--- a/app/client/src/utils/hooks/useWidgetFocus/handleTab.ts
+++ b/app/client/src/utils/hooks/useWidgetFocus/handleTab.ts
@@ -17,7 +17,7 @@ export function handleTab(event: KeyboardEvent) {
   const currentWidget = currentNode.closest(WIDGET_SELECTOR) as HTMLElement;
 
   switch (true) {
-    // when the current node is a widget, we want to do tabbing in regular way
+    // when the current node is one of these widget, we want to do tabbing in regular way
     // the elements will be in proper order in dom for thes widgets
     case currentWidget && currentWidget.matches(JSONFORM_WIDGET):
     case currentWidget && currentWidget.matches(CHECKBOXGROUP_WIDGET):
diff --git a/app/client/src/utils/hooks/useWidgetFocus/tabbable.test.ts b/app/client/src/utils/hooks/useWidgetFocus/tabbable.test.ts
new file mode 100644
index 0000000000..84d355b160
--- /dev/null
+++ b/app/client/src/utils/hooks/useWidgetFocus/tabbable.test.ts
@@ -0,0 +1,7 @@
+import { getNextTabbableDescendant } from "./tabbable";
+
+describe("getNextTabbableDescendant", () => {
+  it("should return undefined if no descendants are passed", () => {
+    expect(getNextTabbableDescendant([])).toBeUndefined();
+  });
+});
diff --git a/app/client/src/utils/hooks/useWidgetFocus/tabbable.ts b/app/client/src/utils/hooks/useWidgetFocus/tabbable.ts
index f2aa69e7d0..d14cfc560f 100644
--- a/app/client/src/utils/hooks/useWidgetFocus/tabbable.ts
+++ b/app/client/src/utils/hooks/useWidgetFocus/tabbable.ts
@@ -115,6 +115,8 @@ export function getNextTabbableDescendant(
 ) {
   const nextTabbableDescendant = descendants[0];
 
+  if (!nextTabbableDescendant) return;
+
   // if nextTabbableDescendant is a container,
   if (nextTabbableDescendant.matches(CONTAINER_SELECTOR)) {
     const tabbableDescendants = getChildrenWidgetsOfNode(