change even on datetime input field does not track time

Question

I am using a datetime input field in LWC:

   <lightning-input type="datetime" name="input5" label="ADate Time" value={avlue} min={minEndDate} max={maxEndDate} onchange={handleDateChange} required></lightning-input>

in JS:

handleDateChange(event){
  this.setDate = event.target.value;
  console.log(' this.setDate---> ' +  this.setDate);
  if(this.setDate != null){
    this.disableButton = false;
  }else{
    this.disableButton = true;
  }
}

When I wipe out the time value from the input , it does not trigger the handle change event. When the value in time field is removed I still the previous time in this.setDate variable.

How can I handle change to date AND Time field bot in this case.

Answer 1

This appears to be a bug with lightning-input. Fortunately, you can fix this easily by adding an onblur handler:

<lightning-input type="datetime" name="input5" label="ADate Time" value={value} min={minEndDate} max={maxEndDate}
    onchange={handleDateChange} onblur={report} required></lightning-input>

---

  report(event) {
    event.target.reportValidity();
    if(!event.target.validity.valid) {
      this.setDate = null;
      console.log(' this.setDate---> ' +  this.setDate);
    }
  }

Demo.