f14bdf6b7b
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 #5517 Closes #5518
103 lines
4.3 KiB
HTML
103 lines
4.3 KiB
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<link rel="stylesheet" href="vendor/qunit-1.23.1.css" type="text/css" />
|
|
<link rel="stylesheet" href="../../dist/css/select2.css" type="text/css" />
|
|
</head>
|
|
<body>
|
|
<div id="qunit"></div>
|
|
<div id="qunit-fixture">
|
|
<div class="event-container">
|
|
<select></select>
|
|
</div>
|
|
|
|
<select class="single">
|
|
<option>One</option>
|
|
</select>
|
|
|
|
<select class="single-empty"></select>
|
|
|
|
<select class="single-with-placeholder">
|
|
<option>placeholder</option>
|
|
<option>One</option>
|
|
</select>
|
|
|
|
<select class="multiple" multiple="multiple">
|
|
<option>One</option>
|
|
<option>Two</option>
|
|
</select>
|
|
|
|
<select class="groups">
|
|
<optgroup label="Test">
|
|
<option value="one">One</option>
|
|
<option value="two">Two</option>
|
|
</optgroup>
|
|
<optgroup label="Empty"></optgroup>
|
|
</select>
|
|
|
|
<select class="duplicates">
|
|
<option value="one">One</option>
|
|
<option value="two">Two</option>
|
|
<option value="one">Uno</option>
|
|
</select>
|
|
|
|
<select class="duplicates-multi" multiple="multiple">
|
|
<option value="one">One</option>
|
|
<option value="two">Two</option>
|
|
<option value="one">Uno</option>
|
|
</select>
|
|
|
|
<select class="user-defined"></select>
|
|
</div>
|
|
|
|
<script src="vendor/qunit-1.23.1.js" type="text/javascript"></script>
|
|
<script src="vendor/jquery-3.4.1.js" type="text/javascript"></script>
|
|
<script src="../dist/js/select2.full.js" type="text/javascript"></script>
|
|
|
|
<script src="helpers.js" type="text/javascript"></script>
|
|
|
|
<script src="a11y/selection-tests.js" type="text/javascript"></script>
|
|
<script src="a11y/search-tests.js" type="text/javascript"></script>
|
|
|
|
<script src="data/array-tests.js" type="text/javascript"></script>
|
|
<script src="data/base-tests.js" type="text/javascript"></script>
|
|
<script src="data/inputData-tests.js" type="text/javascript"></script>
|
|
<script src="data/select-tests.js" type="text/javascript"></script>
|
|
<script src="data/tags-tests.js" type="text/javascript"></script>
|
|
<script src="data/tokenizer-tests.js" type="text/javascript"></script>
|
|
|
|
<script src="data/maximumInputLength-tests.js" type="text/javascript"></script>
|
|
<script src="data/maximumSelectionLength-tests.js" type="text/javascript"></script>
|
|
<script src="data/minimumInputLength-tests.js" type="text/javascript"></script>
|
|
|
|
<script src="dropdown/dropdownCss-tests.js" type="text/javascript"></script>
|
|
<script src="dropdown/positioning-tests.js" type="text/javascript"></script>
|
|
<script src="dropdown/selectOnClose-tests.js" type="text/javascript"></script>
|
|
<script src="dropdown/stopPropagation-tests.js" type="text/javascript"></script>
|
|
|
|
<script src="options/ajax-tests.js" type="text/javascript"></script>
|
|
<script src="options/data-tests.js" type="text/javascript"></script>
|
|
<script src="options/deprecated-tests.js" type="text/javascript"></script>
|
|
<script src="options/translation-tests.js" type="text/javascript"></script>
|
|
<script src="options/width-tests.js" type="text/javascript"></script>
|
|
|
|
<script src="results/focusing-tests.js" type="text/javascript"></script>
|
|
<script src="results/infiniteScroll-tests.js" type="text/javascript"></script>
|
|
<script src="results/option-tests.js" type="text/javascript"></script>
|
|
|
|
<script src="selection/allowClear-tests.js" type="text/javascript"></script>
|
|
<script src="selection/containerCss-tests.js" type="text/javascript"></script>
|
|
<script src="selection/focusing-tests.js" type="text/javascript"></script>
|
|
<script src="selection/multiple-tests.js" type="text/javascript"></script>
|
|
<script src="selection/placeholder-tests.js" type="text/javascript"></script>
|
|
<script src="selection/search-tests.js" type="text/javascript"></script>
|
|
<script src="selection/search-placeholder-tests.js" type="text/javascript"></script>
|
|
<script src="selection/single-tests.js" type="text/javascript"></script>
|
|
<script src="selection/stopPropagation-tests.js" type="text/javascript"></script>
|
|
|
|
<script src="utils/data-tests.js" type="text/javascript"></script>
|
|
<script src="utils/decorator-tests.js" type="text/javascript"></script>
|
|
<script src="utils/escapeMarkup-tests.js" type="text/javascript"></script>
|
|
</body>
|
|
</html>
|