SamProf
MatAutocompleteList - Quick typing after clicking input throws JS error and crashes Blazor app.
Describe the bug: When using MatAutocomplete (even with a basic list of strings), clicking into the input and immediately typing quickly causes JavaScript interop errors, which crash the Blazor Server app. The issue occurs both locally and on the official MatBlazor site.
This appears to be a race condition, where internal JS objects ($list, foundation) are accessed before being initialized.
Observed Errors Microsoft.JSInterop.JSException: Cannot read properties of undefined (reading 'foundation') TypeError: Cannot read properties of undefined (reading 'foundation') at e.getSelectedIndex (matBlazor.js:1:261238)
Other times: Microsoft.JSInterop.JSException: Cannot read properties of null (reading '$list') TypeError: Cannot read properties of null (reading '$list') at e.setSelectedIndex (matBlazor.js:1:261304)
🧠 These happen in:
- BaseMatAutocompleteList<T>.OnKeyDown(...)
- BaseMatList.GetSelectedIndex(...) or SetSelectedIndex(...)
- During JsInvokeAsync(...) inside MatBlazor base components
To Reproduce:
- Use any MatAutocomplete, either:
1. With string list (List
) or 2. With object list (List<Item>) using ToStringFunc - Run in Blazor Server
- Focus the input by clicking it
- Immediately start typing fast
- App crashes with JSInterop error
🔁 Can be reproduced here: https://www.matblazor.com/Autocomplete
Expected behavior No crashes or JS errors. Typing quickly after focus should not break the component. JS interop should wait until foundation, $list, and other dependencies are available.
Screenshots / Logs
Additional context
❗ Happens with both string and object lists in MatAutocomplete
⌛ Only occurs when typing quickly right after clicking (focus)
💥 Crashes entire Blazor Server circuit in some cases
🔍 MatBlazor version: 2.10.0
