Hi,
This patch fixes Dialog tabset keyboard navigation.
This regression was caused due to bootstrap 4 changes.
Also I have added jasmine test cases for the same


-- 
*Harshal Dhumal*
*Sr. Software Engineer*

EnterpriseDB India: http://www.enterprisedb.com
The Enterprise PostgreSQL Company
diff --git a/web/pgadmin/static/js/dialog_tab_navigator.js b/web/pgadmin/static/js/dialog_tab_navigator.js
index 19b2045..ea5fec3 100644
--- a/web/pgadmin/static/js/dialog_tab_navigator.js
+++ b/web/pgadmin/static/js/dialog_tab_navigator.js
@@ -86,7 +86,7 @@ class dialogTabNavigator {
     var self = this,
       nextTabPane,
       innerTabContainer,
-      prevtab = $(tabs).find('li.active').prev('li');
+      prevtab = $(tabs).find('li').has('a.active').prev('li');
 
     if (prevtab.length > 0) {
       prevtab.find('a').tab('show');
@@ -116,7 +116,7 @@ class dialogTabNavigator {
     var self = this,
       nextTabPane,
       innerTabContainer,
-      nexttab = $(tabs).find('li.active').next('li');
+      nexttab = $(tabs).find('li').has('a.active').next('li');
 
     if(nexttab.length > 0) {
       nexttab.find('a').tab('show');
@@ -149,4 +149,4 @@ class dialogTabNavigator {
 
 module.exports = {
   dialogTabNavigator: dialogTabNavigator,
-};
\ No newline at end of file
+};
diff --git a/web/regression/javascript/dialog_tab_navigator_spec.js b/web/regression/javascript/dialog_tab_navigator_spec.js
index f355e88..5c46996 100644
--- a/web/regression/javascript/dialog_tab_navigator_spec.js
+++ b/web/regression/javascript/dialog_tab_navigator_spec.js
@@ -14,10 +14,10 @@ describe('dialogTabNavigator', function () {
   let dialog, tabNavigator, backward_shortcut, forward_shortcut;
 
   beforeEach(() => {
-    let dialogHtml =$('<div tabindex="1" class="backform-tab" role="tabpanel">'+
+    let dialogHtml = $('<div tabindex="1" class="backform-tab" role="tabpanel">'+
         '   <ul class="nav nav-tabs" role="tablist">'+
-        '      <li role="presentation" class="active">'+
-        '         <a data-toggle="tab" tabindex="-1" data-tab-index="1" href="#1" aria-controls="1"> General</a>'+
+        '      <li role="presentation">'+
+        '         <a class="active" data-toggle="tab" tabindex="-1" data-tab-index="1" href="#1" aria-controls="1"> General</a>'+
         '      </li>'+
         '     <li role="presentation">'+
         '         <a data-toggle="tab" tabindex="-1" data-tab-index="5" href="#2" aria-controls="2"> Default Privileges</a>'+
@@ -112,4 +112,93 @@ describe('dialogTabNavigator', function () {
 
   });
 
-});
\ No newline at end of file
+
+  describe('navigateForward from fist tab to second tab', function () {
+    var navigateForwardResult;
+    beforeEach(() => {
+      spyOn(tabNavigator, 'navigateForward').and.callThrough();
+
+      navigateForwardResult = tabNavigator.navigateForward(
+        dialog.$el.find('ul.nav-tabs:first'),
+        dialog.$el.find('div#1')
+      );
+    });
+
+    it('should return true', function () {
+
+      expect(navigateForwardResult).toEqual(true);
+
+    });
+
+  });
+
+
+  describe('navigateForward from last tab', function () {
+    var navigateForwardResult;
+    beforeEach(() => {
+
+      // set second tab active
+      dialog.$el.find('ul.nav-tabs li a.active').removeClass('active');
+
+      dialog.$el.find('ul.nav-tabs li a[href="#3"]').addClass('active');
+
+      spyOn(tabNavigator, 'navigateForward').and.callThrough();
+
+      navigateForwardResult = tabNavigator.navigateForward(
+        dialog.$el.find('ul.nav-tabs:first'),
+        dialog.$el.find('div#1')
+      );
+    });
+
+    it('should return false', function () {
+
+      expect(navigateForwardResult).toEqual(false);
+
+    });
+
+  });
+
+  describe('navigateBackward from second tab to first tab', function () {
+    var navigateBackwardResult;
+    beforeEach(() => {
+      // set second tab active
+      dialog.$el.find('ul.nav-tabs li a.active').removeClass('active');
+
+      dialog.$el.find('ul.nav-tabs li a[href="#2"]').addClass('active');
+
+      spyOn(tabNavigator, 'navigateBackward').and.callThrough();
+
+      navigateBackwardResult = tabNavigator.navigateBackward(
+        dialog.$el.find('ul.nav-tabs:first'),
+        dialog.$el.find('div#1')
+      );
+    });
+
+    it('should return true', function () {
+
+      expect(navigateBackwardResult).toEqual(true);
+
+    });
+
+  });
+
+  describe('navigateBackward from first tab', function () {
+    var navigateBackwardResult;
+    beforeEach(() => {
+      spyOn(tabNavigator, 'navigateBackward').and.callThrough();
+
+      navigateBackwardResult = tabNavigator.navigateBackward(
+        dialog.$el.find('ul.nav-tabs:first'),
+        dialog.$el.find('div#1')
+      );
+    });
+
+    it('should return false', function () {
+
+      expect(navigateBackwardResult).toEqual(false);
+
+    });
+
+  });
+
+});

Reply via email to