2 files changed, 7 insertions, 6 deletions
diff --git a/js/src/util/backdrop.js b/js/src/util/backdrop.js
index f7990f7019..07ad20fab7 100644
--- a/js/src/util/backdrop.js
+++ b/js/src/util/backdrop.js
@@ -6,19 +6,19 @@
  */
 
 import EventHandler from '../dom/event-handler'
-import { emulateTransitionEnd, execute, getTransitionDurationFromElement, reflow, typeCheckConfig } from './index'
+import { emulateTransitionEnd, execute, getElement, getTransitionDurationFromElement, reflow, typeCheckConfig } from './index'
 
 const Default = {
   isVisible: true, // if false, we use the backdrop helper without adding any element to the dom
   isAnimated: false,
-  rootElement: document.body, // give the choice to place backdrop under different elements
+  rootElement: 'body', // give the choice to place backdrop under different elements
   clickCallback: null
 }
 
 const DefaultType = {
   isVisible: 'boolean',
   isAnimated: 'boolean',
-  rootElement: 'element',
+  rootElement: '(element|string)',
   clickCallback: '(function|null)'
 }
 const NAME = 'backdrop'
@@ -90,7 +90,8 @@ class Backdrop {
       ...(typeof config === 'object' ? config : {})
     }
 
-    config.rootElement = config.rootElement || document.body
+    // use getElement() with the default "body" to get a fresh Element on each instantiation
+    config.rootElement = getElement(config.rootElement)
     typeCheckConfig(NAME, config, DefaultType)
     return config
   }
diff --git a/js/tests/unit/util/backdrop.spec.js b/js/tests/unit/util/backdrop.spec.js
index 195d5067c2..3150ba14db 100644
--- a/js/tests/unit/util/backdrop.spec.js
+++ b/js/tests/unit/util/backdrop.spec.js
@@ -243,10 +243,10 @@ describe('Backdrop', () => {
       })
     })
 
-    it('Should default parent element to "document.body" when config value is null', done => {
+    it('Should find the rootElement if passed as a string', done => {
       const instance = new Backdrop({
         isVisible: true,
-        rootElement: null
+        rootElement: 'body'
       })
       const getElement = () => document.querySelector(CLASS_BACKDROP)
       instance.show(() => {