Focus inside input field on show show input modal

- fix regression caused by #10795
- need to handle both tabcontrol element and single init focus element

Signed-off-by: Darshan-upadhyay1110 <darshan.upadhyay@collabora.com>
Change-Id: I5a29ddf7b4562221fc8a6c574a775d2a2e9180a8

browser/src/control/Control.JSDialog.js

@@ -397,22 +397,25 @@ L.Control.JSDialog = L.Control.extend({
 		// this will only search in current instance and not in whole docuemnt
 		const tabControlWidget = this.findTabControl(instance);
 
-		let focusWidget ;
+		let focusWidget, firstFocusableElement ;
 
 		if (tabControlWidget) {
 			// get DOM element of tabControl from current instance
 			focusWidget = instance.content.querySelector('[id="' + tabControlWidget.id + '"]');
+			firstFocusableElement = JSDialog.GetFocusableElements(focusWidget);
+
 		} else {
-			focusWidget = instance.init_focus_id ? instance.container.querySelector('[id=\'' + instance.init_focus_id + '\']') : null;
+			// will directly set element of focusable element based on init focus id
+			firstFocusableElement = instance.init_focus_id ? instance.container.querySelector('[id=\'' + instance.init_focus_id + '\']') : null;
 		}
 
-		if (focusWidget && document.activeElement !== focusWidget && instance.canHaveFocus) {
-			var firstFocusable = JSDialog.GetFocusableElements(focusWidget);
-			if (firstFocusable && firstFocusable.length)
-				firstFocusable[0].focus();
-			else
-				console.error('cannot get focus for widget: "' + instance.init_focus_id + '"');
+		if (firstFocusableElement && document.activeElement !== focusWidget && instance.canHaveFocus) {
+			// for tab control case we have more then 1 element that can be focusable so select the first tab for the list
+			firstFocusableElement = firstFocusableElement.length > 0 ? firstFocusableElement[0] : firstFocusableElement;
+			firstFocusableElement.focus();
 		}
+		else
+			console.error('cannot get focus for widget: "' + instance.init_focus_id + '"');
 
 		if (instance.isDropdown && instance.isSubmenu) {
 			instance.container.addEventListener('mouseleave', function () {