Hitting Enter on a ReactiveForm that uses ngSubmit clears out the input making it invalid

[jacques-hoventer]

I have a very simple form with a one ngx-mat-file-input and another text infput:

Add file clear

    <mat-form-field>
        <mat-label>Rename file</mat-label>
        <input type="text" formControlName="newFileName" matInput placeholder="E.g. My ID">
    </mat-form-field>

    <button [disabled]="!entityForm.valid" type="submit" mat-flat-button color="accent">Add file</button>

Using the Submit button fires the onAddFile eventhandler, but if the user has focus on the Rename input field and presses the Enter key after having:

1. Selected a file
2. Entered a value for Rename
   The onAddFile eventhandler isn't fired and the ngx-mat-file-input selected file is cleared out.

Also confirmed is that the reactive form has no value for the file field:
this.entryForm.controls.file.value is ""
this.entryForm.controls.file.status is "invalid"

Angular => 10.1.4