debounceTimeout -1 not working

[opami]

Hi,

I have a problem with setting debounceTimeout prop to -1 and not getting any onChange event triggered even when pressing the enter key. react-debounce-input version is 3.1.0

Below is example code to reproduce the issue. Am I missing some props that should be passed along for the debounceTimeout -1 to work?

  import React, {Component} from "react";
  import DebounceInput from 'react-debounce-input'


  class App extends Component {
    render() {
      return (
          <DebounceInput value={""} onChange={e => console.log("onChange() called")} 
            debounceTimeout={-1}/>
      )
    }
  }
  export default App;

By quickly debugging the code it seems that in the forceNotify function the execution always returns on the first if statement where it checks the this.isDebouncing value

  forceNotify = event => {
    if (!this.isDebouncing) {
      return;
    }

  if (this.cancel) {
    this.cancel();
  }

  const {value} = this.state;
  const {minLength} = this.props;

  if (value.length >= minLength) {
    this.doNotify(event);
  } else {
    this.doNotify({...event, target: {...event.target, value}});
  }
  };

[Dartv]

@opami I have the same problem. How did you solve it? One hack I can think of is to use debounceTimeout={Infinity}. Are there any drawbacks?

[opami]

@Dartv I used the same workaround you are suggesting so just setting debounceTimeout to a large enough value

[MatejBransky]

I've just did this:

if (!this.isDebouncing && this.props.timeout >= 0) { // << just extend the condition with timeout
  return;
}

if (this.cancel) {
  this.cancel();
}

const {value} = this.state;
const {minLength} = this.props;

if (value.length >= minLength) {
  this.doNotify(event);
} else {
  this.doNotify({...event, target: {...event.target, value}});
}