Using tags and tokenSeparators cause the last tag to be ignored when pasting a list of tags

[lehmayr]

Steps to reproduce the issue

1. Init select2 on select[multiple] with tags: true, tokenSeparators: [" "]
2. Paste a text with some spaces.
3. All tags except the last one are added directly.
4. The text of the final tag is entered in the text field. (But the input field width is much too small!)
5. Press enter.

You can actually test this behavior on the examples page: https://select2.org/tagging#automatic-tokenization-into-tags by pasting this text: red green blue

Expected behavior and actual behavior

Actual: The dropdown opens without any "term" as if the input field was empty.

Expected: I was expecting that it would open the dropdown as if I had entered the text of the final tag.

Environment

Browsers

• Google Chrome
• Mozilla Firefox
• Internet Explorer

Operating System

• Windows
• Mac OS X
• Linux
• Mobile

Libraries

• jQuery version: 1.12.4
• Select2 version: 4.0.4

Isolating the problem

• This bug happens on the examples page
• The bug happens consistently across all tested browsers
• This bug happens when using Select2 without other plugins
• I can reproduce this bug in a jsbin

[alexweissman]

Looks like this was discussed in #3458 and partially fixed, but I can confirm that there is still a problem with the last selection. Looks like others have confirmed this as well.

[nino-s]

The last "word" is written to the search value, but select2 does not recognize this value. I am searching for a better solution atm, but if we explicitly call an input event this.$search.trigger('input'); after the focus event on line 61 in tokenizer.js L:61, the problem disappears.

Edit: On the other side, calling the input event is not a bad idea, because the dropdown opens automatically. What do you think @alexweissman ?

[aleksblendwerk]

Are there any news on this or some kind of workaround?

[scottpchow23]

It seems like a fence posting problem. If you take the reproduction steps above and instead drop "red green blue " (yes, trailing space), then the select2 picks up on all terms.

[null-ref-0000]

Any update with regards this bug?

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[aleksblendwerk]

So has this been fixed or just been buried?

[neokyuubi]

Just letting you know that if you put a space at the end of your tags (or what ever is the delimiter)
It's gonna work

Example : "one two three "

Edit :
This is how i did as a workaround.

$('body').on('paste', '#myInput', function (event)
{
	let delemiter = ' ';
	let clipboardData = event.clipboardData || window.clipboardData || event.originalEvent.clipboardData;
	let newTags = clipboardData.getData('text/plain');
	if (!newTags.endsWith(delemiter)) {
		newTags += delemiter;
	}
	event.preventDefault();
	event.target.value = newTags;
	return false;
});

[taneung]

Just letting you know that if you put a space at the end of your tags (or what ever is the delimiter)
It's gonna work

Example : "one two three "

Edit :
This is how i did as a workaround.

$('body').on('paste', '#myInput', function (event)
{
	let delemiter = ' ';
	let clipboardData = event.clipboardData || window.clipboardData || event.originalEvent.clipboardData;
	let newTags = clipboardData.getData('text/plain');
	if (!newTags.endsWith(delemiter)) {
		newTags += delemiter;
	}
	event.preventDefault();
	event.target.value = newTags;
	return false;
});

Thank you so much for update.