From dd9209a6fe7212a7fe1bc28c161b56ac9b185794 Mon Sep 17 00:00:00 2001
From: Giovanni Mendoza <mendozagioo@gmail.com>
Date: Mon, 13 Jan 2020 18:42:22 -0600
Subject: [PATCH 1/2] Avoid bad scrollbar replacement into width values

---
 js/src/modal.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/js/src/modal.js b/js/src/modal.js
index 0daa428a8dfe..af396b56cf7f 100644
--- a/js/src/modal.js
+++ b/js/src/modal.js
@@ -443,7 +443,7 @@ class Modal {
 
   _checkScrollbar() {
     const rect = document.body.getBoundingClientRect()
-    this._isBodyOverflowing = rect.left + rect.right < window.innerWidth
+    this._isBodyOverflowing = Math.round(rect.left + rect.right) < window.innerWidth
     this._scrollbarWidth = this._getScrollbarWidth()
   }
 

From 136df8fcadaf54586e3a5cf53227b57e86639cca Mon Sep 17 00:00:00 2001
From: Dominik Kremer <dominik.kremer@yatta.de>
Date: Sun, 10 May 2020 16:59:22 +0300
Subject: [PATCH 2/2] Add a test about the scrollbar issue on non-integer width

---
 js/tests/unit/modal.spec.js | 32 ++++++++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)

diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js
index ff8102f444df..a72e93ca8582 100644
--- a/js/tests/unit/modal.spec.js
+++ b/js/tests/unit/modal.spec.js
@@ -649,6 +649,38 @@ describe('Modal', () => {
       modal.show()
     })
 
+    it('should not adjust the inline body padding when it does not overflow, even on a scaled display', done => {
+      fixtureEl.innerHTML = '<div class="modal"><div class="modal-dialog"></div></div>'
+
+      const modalEl = fixtureEl.querySelector('.modal')
+      const modal = new Modal(modalEl)
+      const originalPadding = window.getComputedStyle(document.body).paddingRight
+
+      // Remove body margins as would be done by Bootstrap css
+      document.body.style.margin = '0'
+
+      // Hide scrollbars to prevent the body overflowing
+      document.body.style.overflow = 'hidden'
+
+      // Simulate a discrepancy between exact, i.e. floating point body width, and rounded body width
+      // as it can occur when zooming or scaling the display to something else than 100%
+      document.documentElement.style.paddingRight = '.48px'
+
+      modalEl.addEventListener('shown.bs.modal', () => {
+        const currentPadding = window.getComputedStyle(document.body).paddingRight
+
+        expect(currentPadding).toEqual(originalPadding, 'body padding should not be adjusted')
+
+        // Restore overridden css
+        document.body.style.removeProperty('margin')
+        document.body.style.removeProperty('overflow')
+        document.documentElement.style.paddingRight = '16px'
+        done()
+      })
+
+      modal.show()
+    })
+
     it('should enforce focus', done => {
       fixtureEl.innerHTML = '<div class="modal"><div class="modal-dialog"></div></div>'