autocomplete error "Uncaught ReferenceError" with JSONP if subsequent request returns first

[captain-igloo]

1. Go to ​http://jsbin.com/femiwafado/edit?html,js,output
2. Type say "abcde" in the text box

This results in errors in the console like this:

Uncaught ReferenceError: jQuery32101651943635009172_1493325192569 is not defined

Server side I have a simple PHP script which sleeps according to the length of the search term. So a shorter term like "ab" sleeps for 3 seconds and a longer term like "abcde" doesn't sleep at all. When you type "abcde", later requests will return earlier and this causes the error. Note that the callback parameter sent is the same for each request.

jquery version - 3.2.1 jquery ui - 1.12.1

server side PHP

<?php

$suggestions = '["aaaaaa","aaaaabb","aaabbbbb"]';

if (!empty($_REQUEST['term'])) {
    $delay = 6 - strlen($_REQUEST['term']);

    if ($delay > 0) {
        sleep($delay);
    }
}

if (!empty($_REQUEST['callback'])) {
    header('Content-Type: text/javascript');
    print $_REQUEST['callback'] . '(' . $suggestions . ')';
} else {
    header('Content-Type: application/json');
    print $suggestions;
}

[Scott González]

This is really a docs bug, the string form of the source option is not designed to handle JSONP. Please see the ​demos which show how to properly use JSONP.

Here's a working version of your fiddle: ​http://jsbin.com/mulupuwuki/1/edit?html,js,output

I've opened a bug for the docs: ​https://github.com/jquery/api.jqueryui.com/issues/316

[captain-igloo]

thanks