On lightning-input and lightning-combobox, if we use event.target.value in the on change event, it works fine with the jest test. However, when we use event.detail.value in the on change event, the jest test will be throwing an error saying cannot read property 'value' of null.
Sample lwc js code:
handleStartDateChange(e) {
this.startDate = e.detail.value;
}
Sample jest code:
const startDateInput = element.shadowRoot.querySelector('lightning-input[class="startDateInput"]');
startDateInput.value = new Date().toISOString().slice(0, 10);
startDateInput.dispatchEvent(new CustomEvent('change'));
Event.target and Event.detail seem to be work both fine for us in actual code so we have used them interchangeably in our current code base. But it seems that event.detail doesn't work very well with jest. Does that mean we need to change every event.detail into event.target in order to get the tests pass?