[Flutter] WebView Flutter - Changing Date/Time closes application

Currently using webview_flutter package to exhibit a custom html page inside my application. It consists of come input forms that are in hh:mm format. I have attributed default values to all fields, however when changing the values of any hour field the application closes and I get the following error:


I/mple.dive_calc2(11766): Compiler allocated 4206KB to compile void android.widget.TextView.<init>(android.content.Context, android.util.AttributeSet, int, int)
D/CompatChangeReporter(11766): Compat change id reported: 170233598; UID 10198; state: ENABLED
D/AndroidRuntime(11766): Shutting down VM
E/AndroidRuntime(11766): FATAL EXCEPTION: main
E/AndroidRuntime(11766): Process: com.example.dive_calc2, PID: 11766
E/AndroidRuntime(11766): java.lang.NullPointerException: Attempt to invoke virtual method 'boolean android.widget.EditText.hasFocus()' on a null object reference


I am using the default implementation of webview and the page loads correctly and runs other scripts correctly, however whenever I change the hour or the minutes inside the fields the application closes.

This is the only function that read those fields, I have also tried commenting it but it still closes my application:


// Function to calculate the time difference in hours and minutes between two fields
async function calculateTimeDifference(startInputId, endInputId) {
const startTime = await document.getElementById(startInputId).value;
const endTime = await document.getElementById(endInputId).value;

// Check if the values are available
if (startTime && endTime) {
const startDate = new Date(`1970-01-01T${startTime}:00`);
const endDate = new Date(`1970-01-01T${endTime}:00`);

// Calculate the total difference in minutes
const totalMinutes = Math.abs((endDate - startDate) / 60000);

// Convert total minutes into hours and minutes
const hours = Math.floor(totalMinutes / 60);
const minutes = totalMinutes % 60;

// Display the result in the console (or it can be used to generate a logbook)
console.log(`Time difference between ${startInputId} and ${endInputId}: ${hours} hours and ${minutes} minutes`);

// Return the formatted time (can be used in a PDF or logbook)
return { hours, minutes };
} else {
console.log(`One or both fields (${startInputId}, ${endInputId}) are empty.`);
return null;
}
}

When the html loads inside the application it gets the 12h(AM/PM) format by default even though the android emulator is set to be 24h.

Currently using macOS.

Some things I have tried:

1. Removing the function that reads the hh:mm fields.
2. Hosting the page in the web
3. Only running the function with onPageFinished:

Continue reading...