Ensure that newly added row in backgrid should be visible.

docs/en_US/release_notes_4_6.rst

@@ -16,6 +16,7 @@ Bug fixes
 *********
 
 | `Bug #2392 <https://redmine.postgresql.org/issues/2392>`_ - Ensure that on clicking Delete button should not delete rows immediately from the database server, it should be deleted when Save button will be clicked.
+| `Bug #3327 <https://redmine.postgresql.org/issues/3327>`_ - Ensure that newly added row in backgrid should be visible.
 | `Bug #3582 <https://redmine.postgresql.org/issues/3582>`_ - Ensure that JSON strings as comments should be added properly for all the objects.
 | `Bug #3605 <https://redmine.postgresql.org/issues/3605>`_ - Fix an issue where Deleting N number of rows makes first N number of rows disable.
 | `Bug #3938 <https://redmine.postgresql.org/issues/3938>`_ - Added support for Default Partition.

web/pgadmin/browser/static/js/node.ui.js

@@ -327,6 +327,28 @@ define([
     });
   };
 
+  /*
+  * Global function to make visible backgrid new row
+  */
+  $.fn.pgMakeBackgridVisible = function(cls) {
+    return this.each(function() {
+      if (!this || !$(this.length))
+        return;
+
+      var elem = $(this),
+        backgridDiv = $(this).offsetParent().parent(), // Backgrid div.subnode
+        backgridDivTop = backgridDiv.offset().top,
+        backgridDivHeight = backgridDiv.height(),
+        backformTab = $(this).closest(cls), // Backform-tab
+        gridScroll = backformTab[0].offsetHeight - backgridDivTop;
+
+      if (backgridDivHeight > gridScroll) {
+        var top = elem.get(0).offsetTop + elem.height();
+        backformTab.find('.tab-content').scrollTop(top);
+      }
+      return;
+    });
+  };
 
   /*
    * NodeAjaxOptionsCell

web/pgadmin/static/js/backform.pgadmin.js

@@ -1265,7 +1265,7 @@ define([
               newRow = self.grid.body.rows[idx].$el;
 
             newRow.addClass('new');
-            $(newRow).pgMakeVisible('backform-tab');
+            $(newRow).pgMakeBackgridVisible('.backform-tab');
 
             return false;
           }
@@ -1516,7 +1516,7 @@ define([
           newRow.attr('class', 'new').on('click',() => {
             $(this).attr('class', 'editable');
           });
-          $(newRow).pgMakeVisible('backform-tab');
+          $(newRow).pgMakeBackgridVisible('.backform-tab');
           return false;
         }
       });