validating bootstrap datepicker using Qunit - node.js

Question

I have a bootstrap calendar on my page that lets the user pick a date. I have a start time and endtime. I would like to test to do the following.
If the user leaves the date selector empty, the test will fail with a message like cannot leave fields empty.
If the user enters an endtime that is less than the startime the test will fail and throw a message like Cannot have endtime less than starttime.
I will paste the code that works with the datepicker. I am using Qunit for testing purposes and Bootstrap 4.
button.js
// Runs date picker plugin
$('input.date').datepicker();
// Gets data
var data;
fetch('/reportSaver', {
// data: dates,
method: 'POST'
}).then(function (response) {
return response.json();
}).then(function (json) {
data = json;
});
// Form submit
$('form').on('submit', function (event) {
event.preventDefault();
var dates = {
startdate: new Date($('.startdate').val()),
enddate: new Date($('.enddate').val())
};
// Minimum validation for dates
if ((dates.startdate && dates.startdate > dates.enddate) ||
(dates.enddate && dates.enddate < dates.startdate)) {
return alert('Use valid dates!');
}
// Filter rows
var rows = data.filter(function (register) {
var date = new Date(register.receivedDateTime);
return (
(!dates.startdate || date > dates.startdate) &&
(!dates.enddate || date < dates.enddate)
);
// Convert to HTML
}).map(function (row) {
return `
<tr>
<td> </td>
<td>${row.subject || '-'}</td>
<td>${row.receivedDateTime || '-'}</td>
<td>${row.isRead || '-'}</td>
<td>${row.sendDateTime || '-'}</td>
</tr>
`;
});
// Show content
$('table tbody').html(rows.join(''));
});
// Clear click
$('.clear-table').on('click', function () {
// Clears table
$('table tbody').html('<tr><td colspan="5">Make a search</td></tr>');
// Clears inputs
$('input').val('');
});
form.html
{{!-- Post form for Date Picker --}}
<form id="post_form" method="GET" action="/routes/reportSaver.js">
<div class="date-picker">
<h3>Date</h3>
<input placeholder="Initial date" type="text" class="date startdate"> -
<input placeholder="End date" type="text" class="date enddate">
</div>
<hr>
{{!-- Button to save the Report --}}
<button id="bt1" type="submit" class="btn btn-danger">Click to Get Reports</button>
<button id="bt2" type="submit" class="btn btn-danger clear-table">Clear</button>
</form>
Qunit Test Example
QUnit.test("Datepicker Test", function (assert) {
var datepicker = $("#startDate");
var event = $.Event("onSelect");
datepicker.on("onSelect"),
function () {
alert("Test");
};
// Trigger the key event
datepicker.trigger(event);
});