From 525f6619159356712e8ed90c45ee4a7e3544411c Mon Sep 17 00:00:00 2001
From: Kevin Brown <kevin-brown@users.noreply.github.com>
Date: Sun, 28 Jul 2019 14:49:25 -0400
Subject: [PATCH]  Reposition dropdown whenever items are selected (#5590)

* Reposition dropdown whenever items are selected

This fixes an old bug where if you had a multiple select with the
`closeOnSelect` option set to `false` and many options being
selected, the dropdown would not reposition itself if the selected
options expanded the container down another line. This was because
the dropdown was only being repositioned when it was opened, closed,
or if something around it was scrolled or resized. Unfortunately,
in most cases none of these happened and the dropdown would start
covering the selections.

This was fixed by telling Select2 to resize the dropdown when new
options are selected or existing options are unselected.

Fixes #4377

* Attach positioning handlers at bind time

The positioning handlers have been attached at the time that the
dropdown is opened since when they were first committed many years
ago. It's not actually clear why this was being done, since they
don't rely on anything involving the dropdown being open. This
removes the flag and process for setting these handlers only after
the dropdown was opened for the first time, and moves these handlers
to always be set at bind time.
---
 src/js/select2/dropdown/attachBody.js | 36 +++++++++++++++------------
 1 file changed, 20 insertions(+), 16 deletions(-)

diff --git a/src/js/select2/dropdown/attachBody.js b/src/js/select2/dropdown/attachBody.js
index 4f64fa9b67..12d9ad1f9f 100644
--- a/src/js/select2/dropdown/attachBody.js
+++ b/src/js/select2/dropdown/attachBody.js
@@ -11,27 +11,11 @@ define([
   AttachBody.prototype.bind = function (decorated, container, $container) {
     var self = this;
 
-    var setupResultsEvents = false;
-
     decorated.call(this, container, $container);
 
     container.on('open', function () {
       self._showDropdown();
       self._attachPositioningHandler(container);
-
-      if (!setupResultsEvents) {
-        setupResultsEvents = true;
-
-        container.on('results:all', function () {
-          self._positionDropdown();
-          self._resizeDropdown();
-        });
-
-        container.on('results:append', function () {
-          self._positionDropdown();
-          self._resizeDropdown();
-        });
-      }
     });
 
     container.on('close', function () {
@@ -39,6 +23,26 @@ define([
       self._detachPositioningHandler(container);
     });
 
+    container.on('results:all', function () {
+      self._positionDropdown();
+      self._resizeDropdown();
+    });
+
+    container.on('results:append', function () {
+      self._positionDropdown();
+      self._resizeDropdown();
+    });
+
+    container.on('select', function () {
+      self._positionDropdown();
+      self._resizeDropdown();
+    });
+
+    container.on('unselect', function () {
+      self._positionDropdown();
+      self._resizeDropdown();
+    });
+
     this.$dropdownContainer.on('mousedown', function (evt) {
       evt.stopPropagation();
     });