diff --git a/web/pgadmin/static/js/backform.pgadmin.js b/web/pgadmin/static/js/backform.pgadmin.js
index 85c703e22..1611cb597 100644
--- a/web/pgadmin/static/js/backform.pgadmin.js
+++ b/web/pgadmin/static/js/backform.pgadmin.js
@@ -1869,6 +1869,7 @@ define([
             }).done(function(res) {
               self.sqlCtrl.clearHistory();
               self.sqlCtrl.setValue(res.data);
+              self.setCodeMirrorHeight(obj);
             }).fail(function() {
               self.model.trigger('pgadmin-view:msql:error', self.method, node, arguments);
             }).always(function() {
@@ -1884,6 +1885,7 @@ define([
         }
         this.sqlCtrl.refresh.apply(this.sqlCtrl);
       }
+      this.setCodeMirrorHeight(obj);
     },
     onPanelResized: function(o) {
       if (o && o.container) {
@@ -1900,6 +1902,7 @@ define([
           );
         }
       }
+      this.sqlCtrl.setSize($tabContent.width() + 'px', $tabContent.height() + 'px');
     },
     remove: function() {
       if (this.sqlCtrl) {
@@ -1914,6 +1917,25 @@ define([
 
       Backform.Control.__super__.remove.apply(this, arguments);
     },
+    setCodeMirrorHeight: function(obj) {
+      // Fix for mac os code-mirror showing black screen.
+      var txtArea = $('.pgadmin-controls .pg-el-sm-12 .SQL > .CodeMirror > div > textarea').first();
+      txtArea.css('z-index', -1);
+      var $tabContent = $('.backform-tab > .tab-content').first();
+      var $sqlPane = $tabContent.find('.CodeMirror > div > textarea');
+      for(let i=0; i<$sqlPane.length; i++) {$($sqlPane[i]).css('z-index', -1);}
+
+      $tabContent = $('.backform-tab > .tab-content').first();
+      $sqlPane = $tabContent.find('div[role=tabpanel].tab-pane.' + obj.tab.innerText);
+      // Set height to CodeMirror.
+      if ($sqlPane.hasClass('active')) {
+        $sqlPane.find('.CodeMirror').css(
+          'cssText',
+          'height: ' + ($tabContent.height()) + 'px !important;'
+        );
+      }
+    }
+
   });
   /*
    * Numeric input Control functionality just like backgrid
diff --git a/web/pgadmin/static/scss/_codemirror.overrides.scss b/web/pgadmin/static/scss/_codemirror.overrides.scss
index 8e461863b..df6ebe6be 100644
--- a/web/pgadmin/static/scss/_codemirror.overrides.scss
+++ b/web/pgadmin/static/scss/_codemirror.overrides.scss
@@ -179,10 +179,12 @@
 
 .CodeMirror-simplescroll-horizontal {
     height: $scrollbar-width;
+    z-index: 1;
 }
 
 .CodeMirror-simplescroll-vertical {
     width: $scrollbar-width;
+    z-index: 1;
 }
 
 .CodeMirror-scrollbar-filler, .CodeMirror-simplescroll-horizontal, .CodeMirror-simplescroll-vertical {
@@ -206,3 +208,8 @@
 .bg-gray-lighter {
   background-color: $sql-editor-disable-bg !important;
 }
+
+// Set z-index of scroll less than CodeMirror editor
+.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
+  z-index:1;
+}