Cursor scrolls to topmost Select2 after populating dynamically in jQuery

I'm working on a web page that dynamically populates several Select2 dropdowns using jQuery. The dropdowns are initialized using the following function:

function populateDropdown(selector, data, stageId = false) {
    const dropdown = $(selector);
    dropdown.empty();

    let statusSelectDropDown = document.getElementById('statusSelectDropDown');
    let isMultiSelect = statusSelectDropDown && statusSelectDropDown.value === 'NOTIN';

    if (selector === '#statusesDropDown' && (isMultiSelect || statusPickType == 'NOTIN')) {
        const groupedOptions = {};
        data.forEach(function (item) {
            if (stageId && stageId != item.stageId) {
                return;
            }

            if (item.orderGroup !== undefined) {
                if (!groupedOptions[item.orderGroup]) {
                    groupedOptions[item.orderGroup] = $('<optgroup>').attr('label', `Group ${item.orderGroup}`);
                }
                groupedOptions[item.orderGroup].append(new Option(item.label, item.value));
            } else {
                dropdown.append(new Option(item.label, item.value));
            }
        });

        Object.values(groupedOptions).forEach(optgroup => dropdown.append(optgroup));

        dropdown.attr('multiple', 'multiple');

        dropdown.select2({
            placeholder: "Select options",
            closeOnSelect: false,
            allowClear: true,
            focus: function(e) { e.preventDefault(); return false; }
        });
    } else {
        if(!['#countriesDropDown','#providersDropDown','#portCodeDropDown'].includes(selector)) {
            dropdown.append(new Option('Select an option', ''));
        }

        data.forEach(function (item) {
            if ((item.orderGroup == 'Label Group') || stageId && stageId != item.stageId) {
                return;
            }

            const option = new Option(item.label, item.value);
            if (selector === '#stagesDropDown') {
                $(option).attr('data-stagecode', item.stageCode);
            }
            dropdown.append(option);
        });

        if (dropdown.attr('multiple')) {
            dropdown.removeAttr('multiple');
        }

        if (dropdown.hasClass("select2-hidden-accessible")) {
            dropdown.select2('destroy');
        }

        if(selector == '#countriesDropDown') {
            $('#countriesDropDown').attr('multiple','multiple');
            $('#countriesDropDown').select2({
                placeholder: "Select Countries",
                allowClear: true,
                focus: function(e) { e.preventDefault(); return false; }
            });
        }

        if(selector == '#providersDropDown') {
            $('#providersDropDown').select2({
                placeholder: "Select Providers",
                allowClear: true,
                focus: function(e) { e.preventDefault(); return false; }
            });
        }

        if(selector == '#portCodeDropDown') {
            $('#portCodeDropDown').select2({
                placeholder: "Select PortCodes",
                allowClear: true,
                focus: function(e) { e.preventDefault(); return false; }
            });
        }
    }
}

Whenever I populate any of the Select2 dropdowns using this function, the cursor/page scrolls up and focuses on the topmost Select2 element, even if I'm interacting with a different one below.

This behavior is very disruptive, especially on long pages. I suspect it’s due to some focus or scroll behavior in Select2 or jQuery, but I’m unable to pinpoint the root cause.

What I've Tried:

• Prevented auto-focus in Select2 config using focus: function(e) { e.preventDefault(); return false; }
• Used dropdownParent for modals (though this isn’t in a modal)
• Ensured no autofocus attribute or scrollIntoView is triggered
• Disabled closeOnSelect
• Tried delaying the Select2 initialization with setTimeout

Why does my page scroll to the topmost Select2 after dynamically populating a different Select2, and how can I prevent this from happening?

Any insights or suggestions would be greatly appreciated!