ReferenceError: regeneratorRuntime is not defined

[MikeAlhayek]

First of all, thank you very much for making this nice plugin public. I encountered an issue when trying to fetch the data using fetch.

• System Information

  • Browser type and version: Google Chrome Version 97.0.4692.99 (Official Build) (64-bit)
  • OS type and version Windows 10
  • WINDOWS: be sure to indicate which terminal you're using -- (i.e., cmd.exe, powershell, git- bash, cygwin, Ubuntu via windows subsystem for linux, etc...)
  • Node version (IF applicable)
    • Any error messages that may be in the console where you ran npm start
  • Any error messages in the JS console

• Describe the bug
  I initialize the plugin line this

document.addEventListener('DOMContentLoaded', () => {

    var selector = document.querySelector('.customer-autocomoplete');

    selector.addEventListener("selection", function (event) {
        console.log(event.detail);
    });

    new autoComplete({
        selector: () => {
            return selector;
        },
        placeHolder: selector.getAttribute('data-placeholder') || '',
        threshold: 3,
        data: {
            src: async (query) => {
                try {
                    var url = selector.getAttribute('data-fetch-url').trim('/') + `?q=${query}`
                   
                    if (url) {
                        var response = await fetch(url);

                        return await response.json();
                    }
                    return [];
                } catch (error) {
                    return error;
                }
            },
            cache: false,
            keys: ['DisplayText']
        }
    });

});

The above code return the following error

ReferenceError: regeneratorRuntime is not defined

I changed the code to code below, but that also give me the following exception

Uncaught (in promise) TypeError: data.src(...).then is not a function

document.addEventListener('DOMContentLoaded', () => {

    var selector = document.querySelector('.customer-autocomoplete');

    selector.addEventListener("selection", function (event) {
        // "event.detail" carries the autoComplete.js "feedback" object
        console.log(event.detail);
    });

    new autoComplete({
        selector: () => {
            return selector;
        },
        placeHolder: selector.getAttribute('data-placeholder') || '',
        threshold: 3,
        data: {
            src: (query) => {
                try {
                    // Fetch Data from external Source
                    var url = selector.getAttribute('data-fetch-url').trim('/') + `?q=${query}`

                    console.log(url, 'fetch url');
                   
                    if (url) {
                        var response = fetch(url);

                        return response.json();
                    }
                    return [];
                } catch (error) {
                    return error;
                }
            },
            cache: false,
            keys: ['contentItemId']
        }
    });
});

[MikeAlhayek]

I changed the code to this and it worked

data: {
            src: function (query) {
                var url = selector.getAttribute('data-fetch-url').trim('/') + `?q=${query}`

                return fetch(url).then(data => data.json());
            },
            cache: false,
            keys: ['DisplayText']
        },