Do not create a Popper.js instance when we don't need it

1 files changed, 18 insertions, 21 deletions

diff --git a/js/src/dropdown.js b/js/src/dropdown.js
index a18f0c28ae..57ee10ebdd 100644
--- a/js/src/dropdown.js
+++ b/js/src/dropdown.js
@@ -143,22 +143,25 @@ const Dropdown = (($) => {
         return
       }
 
-      /**
-       * Check for Popper dependency
-       * Popper - https://popper.js.org
-       */
-      if (typeof Popper === 'undefined') {
-        throw new Error('Bootstrap dropdown require Popper.js (https://popper.js.org)')
-      }
-
-      let element = this._element
-      // for dropup with alignment we use the parent as popper container
-      if ($(parent).hasClass(ClassName.DROPUP)) {
-        if ($(this._menu).hasClass(ClassName.MENULEFT) || $(this._menu).hasClass(ClassName.MENURIGHT)) {
-          element = parent
+      // Disable totally Popper.js for Dropdown in Navbar
+      if (!this._inNavbar) {
+        /**
+         * Check for Popper dependency
+         * Popper - https://popper.js.org
+         */
+        if (typeof Popper === 'undefined') {
+          throw new Error('Bootstrap dropdown require Popper.js (https://popper.js.org)')
+        }
+        let element = this._element
+        // for dropup with alignment we use the parent as popper container
+        if ($(parent).hasClass(ClassName.DROPUP)) {
+          if ($(this._menu).hasClass(ClassName.MENULEFT) || $(this._menu).hasClass(ClassName.MENURIGHT)) {
+            element = parent
+          }
         }
+        this._popper = new Popper(element, this._menu, this._getPopperConfig())
       }
-      this._popper = new Popper(element, this._menu, this._getPopperConfig())
+
 
       // if this is a touch-enabled device we add extra
       // empty mouseover listeners to the body's immediate children;
@@ -185,8 +188,8 @@ const Dropdown = (($) => {
       this._menu = null
       if (this._popper !== null) {
         this._popper.destroy()
+        this._popper = null
       }
-      this._popper = null
     }
 
     update() {
@@ -275,12 +278,6 @@ const Dropdown = (($) => {
         }
       }
 
-      // Disable Popper.js for Dropdown in Navbar
-      if (this._inNavbar) {
-        popperConfig.modifiers.applyStyle = {
-          enabled: !this._inNavbar
-        }
-      }
       return popperConfig
     }