Stop saving the latest valid choice

[PauloPortugal]

Context:
With the progressive enhancement element, if the user chooses a valid option and then goes back and tries to type another option, but puts in a typo, the component will pick up the latest valid option, instead of submitting what was in the input field.

Code example:
Imagine we have a location picker

<select id="location-picker">
  <option value="">Select a country</option>
  <option value="fr">France - FR</option>
  <option value="de">Germany - DE</option>
  <option value="gb">United Kingdom - GB</option>
</select>

And a we have the following accessibleAutocomplete.enhanceSelectElement config:

<script type="text/javascript">
    var selectedElement = document.querySelector('#location-picker')
    accessibleAutocomplete.enhanceSelectElement({
        confirmOnBlur: true,
        defaultValue: '',
        selectElement: selectedElement,
        showAllValues: true,
        displayMenu: 'overlay',
        autoselect: false,
        preserveNullOptions: true
    })
</script>

User journey:

1. User types DE and he then enters picks Germany - DE
2. User goes back and wants to pick United Kingdom and types UK. Since no UK is available no option is selected. He clicks submit and now instead of having an error stating that an invalid option was submitted, the form instead submits Germany - DE (the last valid option).

Question:
How can we ensure that the enhanceSelectElement always treats what is in the input field as the desired value to submit (regardless if it is an invalid one)?

Thanks & stay safe.

[vanitabarrett]

Related issue in the country and territory autocomplete repo: alphagov/govuk-country-and-territory-autocomplete#78