Adding an input: event for the input field prevents autoComplete from starting the query

[john-999]

• System Information

  • Browser type and version: Firefox 99.0
  • OS type and version: Linux: Ubuntu 20.04.4 LTS
  • Node version (IF applicable): None
  • Any error messages in the JS console: None

• Describe the bug

If I add an input event for the input field (= an event that is fired when the field value is changed, both on desktop and mobile), then autoComplete won't launch the query, and therefor show no result list.

Is this a bug or a feature (= happening because the inbuilt input event is then overridden)?

If this is a feature: What would I need to add to the example code extract below to have autoComplete start the query correctly?

• To Reproduce

new autoComplete({
  events: {
    input: {
      input: (event) => {     
        console.log(event);
      }
    }
  }
});

• Expected behavior
  The input event is correctly recognized by autoComplete, but the query should also be started, then displaying the result list.

[TarekRaafat]

Hello @john-999,

All you need to do to fix that behavior is to use the autoCompleteJS.start(query); API inside the input event as shown below.

events: {
  input: {
    input(event) {
      autoCompleteJS.start();
      console.log(event);
    },
  }
}

Please try it and let me know how it goes.

Cheers! :)

[john-999]

Thanks!

But as I understand it, this would then not apply the "debounce" value, right? Is there a way to make debounce happen as well? Because the below attempt wouldn't work like the "debounce" feature...

events: {
  input: {
    input(event) {
      setTimeout(function() {
        autoCompleteJS.start();
      }, repeat_debounce_value_here);

      console.log(event);
    },
  }
}

So there seems to be a certain contradiction:

autoCompleteJS.start(); takes into account the threshold: value, but not the debounce: value.

So, would it then make sense to make autoCompleteJS.start(); respect the debounce: value as well?