Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

The mSort function seems to get broken in Chromium / Chrome 81.0.4044.113 (Official Build) (64-bit) and later

See original GitHub issue

Long story short and SSCCE:

<html>
<head>
<title>jquery multiselect Chrome 81 bug</title>
<script src="jquery-3.5.0.min.js"></script>
<script src="multiselect.min.js"></script>
<script>
        $(document).ready(function() {
                $("#src").multiselect({
                        //sort: false
                });
        });
</script>
</head>
<body>
<h1>jquery multiselect Chrome 81 bug</h1>
<select id="src" size="5" multiselect="multiselect">
        <option>9</option>
        <option>3</option>
        <option>2</option>
        <option>4</option>
</select>
<select id="src_to" size="5" multiselect="multiselect">
</select>
</body>
</html>

In the code above the option elements sequence is expected to sort from (9, 3, 2, 4) to (2, 3, 4, 9). This seems to work fine in previous Chrome versions or the current version of Firefox. In Chrome 81.0.4044.113 (Official Build) (64-bit) the selects go crazy if the sorting function is defined: (3, 9) is only available and the rest of the option elements are only rendered when moving elements from one select to another.

Narrowing down to the code, it seems that something’s going wrong with the way the plugin reappends sorted nodes to the DOM https://github.com/crlcu/multiselect/blob/a916984bd1c22e9e3c64264618f00e656a85a54b/dist/js/multiselect.js#L785 and https://github.com/crlcu/multiselect/blob/a916984bd1c22e9e3c64264618f00e656a85a54b/dist/js/multiselect.js#L792.

The issue is similar to the issues decribed in #192 and more recent #193 and #195.

EDIT

I’ve just rechecked the issue in the latest dev Chromium 84.0.4122.0 (Developer Build) (64-bit) and it’s reproducible there too.

Issue Analytics

State:
Created 3 years ago
Comments:26

Top GitHub Comments

3reactions

lyubomyr-shaydarivcommented, May 6, 2020

@Chaitwo, @ghardy2k (and maybe @rafalglowacz, @afzafri) If you guys are using the patch, you can now remove it from your codebase if it’s applied as the latest Chromium version is out and I can confirm that the patch is no longer necessary since Chromium 81.0.4044.138.

CC: @crlcu

3reactions

lyubomyr-shaydarivcommented, Apr 22, 2020

It looks like jQuery is the cause: removing the jQuery-driven DOM manipulation in favor of direct DOM manipulation seems to work. I don’t think that the plugin has to be fixed itself, and the $.fn.mSort method should be patched on-fly after the plugin is loaded. Once jQuery is fixed, the on-fly patch should be removed. The following code seems to work for me:

// chrome81+jquery3xxfix.js
(function($) {

        $.fn.mSort = function(callback) {
                var children = this
                        .children()
                        .sort(callback);
                for ( var j = 0; j < this.length; j++ ) {
                        for ( var i = 0; i < children.length; i++ ) {
                                this[j].appendChild(children[i]);
                        }
                }

                this
                        .find('optgroup')
                        .each(function(_, group) {
                                var children = $(group).children()
                                        .sort(callback);
                                for ( var i = 0; i < children.length; i++ ) {
                                        group.appendChild(children[i]);
                                }
                        });

                return this;
        };

})(jQuery);