From 142a9e4ae0c4517654ec381adb52c0c0fb3f6279 Mon Sep 17 00:00:00 2001
From: nakupanda <javanoob@hotmail.com>
Date: Wed, 3 Dec 2014 16:13:37 +0800
Subject: [PATCH] Modal: Apply any preexisting body padding again after closing

---
 js/modal.js            | 16 +++++----
 js/tests/unit/modal.js | 77 ++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 86 insertions(+), 7 deletions(-)

diff --git a/js/modal.js b/js/modal.js
index 929cd991fc68..7ee2679a2a74 100644
--- a/js/modal.js
+++ b/js/modal.js
@@ -14,12 +14,13 @@
   // ======================
 
   var Modal = function (element, options) {
-    this.options        = options
-    this.$body          = $(document.body)
-    this.$element       = $(element)
-    this.$backdrop      = null
-    this.isShown        = null
-    this.scrollbarWidth = 0
+    this.options         = options
+    this.$body           = $(document.body)
+    this.$element        = $(element)
+    this.$backdrop       = null
+    this.isShown         = null
+    this.originalBodyPad = null
+    this.scrollbarWidth  = 0
 
     if (this.options.remote) {
       this.$element
@@ -259,11 +260,12 @@
 
   Modal.prototype.setScrollbar = function () {
     var bodyPad = parseInt((this.$body.css('padding-right') || 0), 10)
+    this.originalBodyPad = document.body.style.paddingRight || ''
     if (this.bodyIsOverflowing) this.$body.css('padding-right', bodyPad + this.scrollbarWidth)
   }
 
   Modal.prototype.resetScrollbar = function () {
-    this.$body.css('padding-right', '')
+    this.$body.css('padding-right', this.originalBodyPad)
   }
 
   Modal.prototype.measureScrollbar = function () { // thx walsh
diff --git a/js/tests/unit/modal.js b/js/tests/unit/modal.js
index f81621b79f6e..3918bd1e4bdd 100644
--- a/js/tests/unit/modal.js
+++ b/js/tests/unit/modal.js
@@ -301,4 +301,81 @@ $(function () {
 
     $toggleBtn.click()
   })
+
+  QUnit.test('should restore inline body padding after closing', function (assert) {
+    var done = assert.async()
+    var originalBodyPad = 0
+    var $body = $(document.body)
+
+    $body.css('padding-right', originalBodyPad)
+
+    $('<div id="modal-test"/>')
+      .on('hidden.bs.modal', function () {
+        var currentBodyPad = parseInt($body.css('padding-right'), 10)
+        assert.notStrictEqual($body.attr('style'), '', 'body has non-empty style attribute')
+        assert.strictEqual(currentBodyPad, originalBodyPad, 'original body padding was not changed')
+        $body.removeAttr('style')
+        done()
+      })
+      .on('shown.bs.modal', function () {
+        $(this).bootstrapModal('hide')
+      })
+      .bootstrapModal('show')
+  })
+
+  QUnit.test('should ignore values set via CSS when trying to restore body padding after closing', function (assert) {
+    var done = assert.async()
+    var $body = $(document.body)
+    var $style = $('<style>body { padding-right: 42px; }</style>').appendTo('head')
+
+    $('<div id="modal-test"/>')
+      .on('hidden.bs.modal', function () {
+        assert.ok(!$body.attr('style'), 'body does not have inline padding set')
+        $style.remove()
+        done()
+      })
+      .on('shown.bs.modal', function () {
+        $(this).bootstrapModal('hide')
+      })
+      .bootstrapModal('show')
+  })
+
+  QUnit.test('should ignore other inline styles when trying to restore body padding after closing', function (assert) {
+    var done = assert.async()
+    var $body = $(document.body)
+    var $style = $('<style>body { padding-right: 42px; }</style>').appendTo('head')
+
+    $body.css('color', 'red')
+
+    $('<div id="modal-test"/>')
+      .on('hidden.bs.modal', function () {
+        assert.strictEqual($body[0].style.paddingRight, '', 'body does not have inline padding set')
+        assert.strictEqual($body[0].style.color, 'red', 'body still has other inline styles set')
+        $body.removeAttr('style')
+        $style.remove()
+        done()
+      })
+      .on('shown.bs.modal', function () {
+        $(this).bootstrapModal('hide')
+      })
+      .bootstrapModal('show')
+  })
+
+  QUnit.test('should properly restore non-pixel inline body padding after closing', function (assert) {
+    var done = assert.async()
+    var $body = $(document.body)
+
+    $body.css('padding-right', '5%')
+
+    $('<div id="modal-test"/>')
+      .on('hidden.bs.modal', function () {
+        assert.strictEqual($body[0].style.paddingRight, '5%', 'body does not have inline padding set')
+        $body.removeAttr('style')
+        done()
+      })
+      .on('shown.bs.modal', function () {
+        $(this).bootstrapModal('hide')
+      })
+      .bootstrapModal('show')
+  })
 })