Try / Catch does not work in razor markup

[kevonh]

Describe the bug

Try/Catch does not work in razor code when encountering index out of bounds.
Expected behavior of code below would be to see "Index out of bounds" in the div.
Actual behavior, page hangs and eventually gives out of memory exception.

To Reproduce

Create standard Blazor WASM project. Replace Counter page with following:

@page "/counter"

@try
{
    <div>@Strings[5]</div>
}
catch (Exception ex)
{
    <div>@ex.ToString()</div>
}

@code {
    private List<string> Strings = new List<string> { "String one", "String 2" };
}

Exceptions (if any)

Out of Memory error

Further technical details

.NET Core SDK (reflecting any global.json):
Version: 3.1.302
Commit: 41faccf259

Runtime Environment:
OS Name: Windows
OS Version: 10.0.18363
OS Platform: Windows
RID: win10-x64
Base Path: C:\Program Files\dotnet\sdk\3.1.302\

Host (useful for support):
Version: 3.1.6
Commit: 3acd9b0cd1

.NET Core SDKs installed:
3.1.300 [C:\Program Files\dotnet\sdk]
3.1.302 [C:\Program Files\dotnet\sdk]

.NET Core runtimes installed:
Microsoft.AspNetCore.All 2.1.20 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.All]
Microsoft.AspNetCore.App 2.1.20 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.App]
Microsoft.AspNetCore.App 3.1.4 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.App]
Microsoft.AspNetCore.App 3.1.6 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.App]
Microsoft.NETCore.App 2.1.20 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
Microsoft.NETCore.App 3.1.4 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
Microsoft.NETCore.App 3.1.6 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
Microsoft.WindowsDesktop.App 3.1.4 [C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App]
Microsoft.WindowsDesktop.App 3.1.6 [C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App]

• Visual Studio 2019 16.6.5

[SteveSandersonMS]

Resolved in #24650

@kevonh Using try/catch during rendering logic can result in corrupted output which caused this behavior. The way we're fixing it via #24650 is to detect this situation and throw, instead of having the undefined behavior you observed.

The reason try/catch is problematic during rendering is because it's like other situations where you emit output. Once you emitted it, you can't take it back. If your try branch already starts outputting some elements but never closes them because execution moves on to a catch block that supresses the exception, then the output has unbalanced tags which is an invalid document.

So the overall pattern application developers need to follow is putting any possibly-throwing logic into the component's @code block (e.g., lifecycle methods, event handlers, etc.). We have a different issue on the backlog (#13452) that would provide mechanisms for recovery from per-component exceptions, including during the rendering logic, but that's not in scope for this fix.