This fixes a bug with the search box where, when it had a placeholder,
it would expand the width of the selection container because it was
too large. This bug was specifically caused by the search box not
factoring in the padding surrounding it when caclualting the width
it needed to be, which resulted in the search box extending
outside of the selection container. This bug was easy to notice if
your Select2 was set to have 100% width and if the container it was
held within was not a block element.
This fixes the bug by switching to using `width()` for calculating
the search width instead of using `innerWidth()`, which ignored the
surrounding padding.
Fixes#5517Closes#5518
This fixes a bug where if you cloned a Select2, the internal ID used
for mapping elements (specifically the `<select>`) to the in-memory
data store would be cloned as well, causing issues when you tried to
initialize Select2 on the cloned element. This was because we did not
properly clear all of the internal data and all of the internal
attributes that Select2 uses when we destroyed it. The internal
`data-select2-id` attribute was not being cleared, and this was the
attribute being used for the internal mapping.
Now we properly clear the `data-select2-id` attribute from the element
when we call `RemoveData` on the element. This aligns with what we
were trying to do, since we previously cleared out the internal store
for that ID, and fixes the issue we were seeing when cloning.
Fixes#5247
This behaviour, where the focus was happening on a small asynchronous
delay, was added in commit 933189b92 late last year in a commit with
no supporting tickets or commit message explaining what the change
was trying to accomplish. This commit has effectly been reverted within
this commit, since it caused a regression in how focus was being
assigned that made it inconsistent with a standard `<select>`.
A test was added for this which ensures that we won't see that
regression again.
Fixes#5532Fixes#5185Closes#5552
Ever since the 4.0.0 release of Select2, there has been a bug where
if you enabled infinite scrolling but did not return enough results
on the first load of AJAX to show a scrollbar, then infinite
scrolling would not be enabled and you could not view anything other
than the first page of results. The solution for this was first
proposed in #3888 but it was closed off because of inactivity and
missing tests.
This fixes the issue by performing the check to see if more results
should be loaded both on scroll and also when the results are first
loaded. This solves the issue that we were seeing before, because
the plugin knows it needs to load in more results, just it did not
receive the scroll event before and thus was not able to actually
load in the new results.
This has the potential to trigger multiple AJAX requests to load in
multiple pages of results if the user has the ability to see many
options, but only a few are being loaded at a time.
This also adds tests for infinite scrolling, both to ensure that
it will attempt to load additional pages, even without the scrollbar,
and to ensure that the regular behaviour of not loading additional
pages when the scrollbar is visible is preserved.
Fixes#3088
This check is in place in most other places, mostly because we have
run into widespread issues under similar circumstances and we like to
avoid those, but it was forgotten here. There also were no tests
covering this, so it was never caught.
This adds tests that ensure that the option in the results list will
be generated with the correct "disabled" state based on whether or
not it, or a parent element, is marked as disabled.
This should have been easy: just check `element.disabled`
Unfortunately the `disabled` property is not inherited within the
option chain, so if an `<optgroup>` is disabled, the `<option>`
elements or other `<optgroup>` elements held within it do not have
their `disabled` property set to `true`. As a result, we needed to
use the `matches` method to check if the `:disabled` state is
present for the element. The `matches` method is part of the official
standard, but it was not implemented under that name for a while and
as a result Internet Explorer only supports it under the prefixed
`msMatchesSelector` method and older versions of Webkit have it
implemented as `webkitMatchesSelector`. But once we use this method,
it appears to consistently return the expected results.
This `matches` method and prefixed predecessors are not supported in
IE 8, but they are supported in IE 9 and any browsers newer than
that. Instead of buulding a very hacky solution using
`querySelectorAll` that was brittle, I have chosen to act like
everyone else and pretend IE 8 no longer exists.
Fixes#3347Closes#4818
* Start running tests against jQuery 2.x
We were only running tests against jQuery 1.x before and they were
all passing. This was a problem because apparently all of the data-*
attribute tests fail in jQuery 2.x. We are now running both the
integration and unit tests against both jQuery 1.x and jQuery 2.x.
Right now this resulted in a complete duplication of the test files
because there wasn't an obvious way to run the tests against both
versions. We're going to look into removing this duplication in the
future once the current issues are fixed.
We are also going to look into testing against jQuery 3.x in the
future, since that is also a supported line of jQuery.
* Force the data-* attributes to be parsed
There was a change made that switched us from using `$.data` and
`$.fn.data` internally to using an internal data store (managed
through internal utilities). This had the unfortunate side effect
of breaking the automatic loading of data-* options in versions of
jQuery other than 1.x, which included anything that would be
considered modern jQuery. While the change was made and approved
in good faith, all of the tests passed and the docs pages appeared
to be working, the tests really failed when running on newer versions
of jQuery. This was confirmed when we started running automated tests
against both versions, which confirmed the bug that others have been
seeing for a while.
The change was made becuase calling `$.fn.data` on an element which
contains a reference to itself in the internal jQuery data cache
would cause a stack overflow. This bug was well documented at the
following GitHub ticket and was resolved by no longer using
`$.fn.data`: https://github.com/select2/select2/issues/4014
Unfortunately because `$.fn.data` was no longer being called in a
way such that all of the data attributes would be dumped out, we
needed to find a replacement. The substitute that was given in the
original bug fix worked when the data cache was fully primed, but
we never primed it anywhere so it actually failed in the general
case. That meant we needed to find a way to manually prime it,
which is exactly what this change does.
* Clean up select2/utils
