From 7aa4a3c9087655dd3002fd690d363b70ee67c5db Mon Sep 17 00:00:00 2001
From: GeoSot <geo.sotis@gmail.com>
Date: Sun, 18 Apr 2021 23:59:14 +0300
Subject: [PATCH] Offcanvas.js: If scroll is allowed, must not enforce focus on
 element

---
 js/src/offcanvas.js             |  2 +-
 js/tests/unit/offcanvas.spec.js | 34 +++++++++++++++++++++++++++++++++
 2 files changed, 35 insertions(+), 1 deletion(-)

diff --git a/js/src/offcanvas.js b/js/src/offcanvas.js
index 2b6335b39181..7fcdfb48a8b6 100644
--- a/js/src/offcanvas.js
+++ b/js/src/offcanvas.js
@@ -112,6 +112,7 @@ class Offcanvas extends BaseComponent {
 
     if (!this._config.scroll) {
       scrollBarHide()
+      this._enforceFocusOnElement(this._element)
     }
 
     this._element.removeAttribute('aria-hidden')
@@ -121,7 +122,6 @@ class Offcanvas extends BaseComponent {
 
     const completeCallBack = () => {
       EventHandler.trigger(this._element, EVENT_SHOWN, { relatedTarget })
-      this._enforceFocusOnElement(this._element)
     }
 
     const transitionDuration = getTransitionDurationFromElement(this._element)
diff --git a/js/tests/unit/offcanvas.spec.js b/js/tests/unit/offcanvas.spec.js
index 67831ad24967..2419e5723cc8 100644
--- a/js/tests/unit/offcanvas.spec.js
+++ b/js/tests/unit/offcanvas.spec.js
@@ -220,6 +220,24 @@ describe('Offcanvas', () => {
 
       offCanvas.show()
     })
+
+    it('should not enforce focus if focus scroll is allowed', done => {
+      fixtureEl.innerHTML = '<div class="offcanvas"></div>'
+
+      const offCanvasEl = fixtureEl.querySelector('.offcanvas')
+      const offCanvas = new Offcanvas(offCanvasEl, {
+        scroll: true
+      })
+
+      spyOn(offCanvas, '_enforceFocusOnElement')
+
+      offCanvasEl.addEventListener('shown.bs.offcanvas', () => {
+        expect(offCanvas._enforceFocusOnElement).not.toHaveBeenCalled()
+        done()
+      })
+
+      offCanvas.show()
+    })
   })
 
   describe('toggle', () => {
@@ -328,6 +346,22 @@ describe('Offcanvas', () => {
       expect(instance).not.toBeNull()
       expect(Offcanvas.prototype.show).toHaveBeenCalled()
     })
+
+    it('should enforce focus', done => {
+      fixtureEl.innerHTML = '<div class="offcanvas"></div>'
+
+      const offCanvasEl = fixtureEl.querySelector('.offcanvas')
+      const offCanvas = new Offcanvas(offCanvasEl)
+
+      spyOn(offCanvas, '_enforceFocusOnElement')
+
+      offCanvasEl.addEventListener('shown.bs.offcanvas', () => {
+        expect(offCanvas._enforceFocusOnElement).toHaveBeenCalled()
+        done()
+      })
+
+      offCanvas.show()
+    })
   })
 
   describe('hide', () => {