Loses focus on close.

[ajcastro]

Prerequisites

• I have searched for similar issues in both open and closed tickets and cannot find a duplicate
• The issue still exists against the latest master branch of Select2
• This is not a usage question (Those should be directed to the community)
• I have attempted to find the simplest possible steps to reproduce the issue
• I have included a failing test as a pull request (Optional)

Steps to reproduce the issue

1. Go https://select2.github.io/examples.html.
2. Try to navigate a select2 element by using tab.
3. Then select an option. After closed, the focus is gone.

Expected behavior and actual behavior

When I follow those steps, I see... that the focus is not on the current select2 element.

I was expecting... the focus should still be on the select2 element, and then when I press tab, it should go to the next select2 element. The latest version is not keyboard friendly. I would love the keyboard behaviour in v3.5.3.

Environment

Browsers

• Google Chrome
• Mozilla Firefox
• Internet Explorer

Operating System

• Windows
• Mac OS X
• Linux
• Mobile

Libraries

• jQuery version:
• Select2 version:

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

[ptheofan]

Same issue. Using tab, arriving on select2 elem. Hit enter, it opens, I select the entry - focus is lost. Results, next tab go top of page according to tab-indexes

[jamesSampica]

Same issue in 4.0.3. This seems to work as a workaround edit to select2.js

this.on('close', function () {
    self.$container.removeClass('select2-container--open');

    self.$selection.focus();  //added fix for focus on close
});

[oh-ren]

Workaround in userland (not thoroughly tested):

$('select').select2().on('select2:close', function(e) {
    let select2 = $(this).data('select2');
    select2.$selection.focus();
});

[alexweissman]

Is this related to the problem addressed in #4860?

[oh-ren]

It seems so. I'm only just looking into Select2, so not really familiar with the code base (nor it's general issues).
I added the base.js timeout hack to the dist file, seems to fix this focus issue in FF56. Not sure what the effect is of the change in search.js

[alexweissman]

Hmm. Seems like creating a Github Project might be a good way to aggregate these related issues for now.

[alexweissman]

Ok, created this project: https://github.com/select2/select2/projects/2

[alexweissman]

There's also the issue reported in #4419, fixed by #4427. Is this the same issue?

[jpic]

@alexweissman this seems like a different issue: after selecting an issue with the keyboard -> the focus is lost -> pressing tab again starts over from the beginning of the page -> you have to go over the sidebar links to get back at the autocomplete.

[alexweissman]

No, @jpic I am fairly sure that this is the same issue. After merging in @nino-s 's fix (#4427) and releasing 4.0.4, you can see that this problem no longer occurs on the demo page: https://select2.org/getting-started/basic-usage

[PieterjanDeClippel]

Apparently the issue is back. See demo-page.
Can this problem be fixed once again?

[Dannymx]

This issue is still present in latest 4.0.6 and 4.0.7 rc.0

For me when I click one select and then click another select, the focus stays with the previous select.