[Blazor] Throw meaningful JSTimeoutException for JSRuntime calls that timeout

src/Components/Components/src/ComponentBase.cs

@@ -2,6 +2,7 @@
 // The .NET Foundation licenses this file to you under the MIT license.
 
 using Microsoft.AspNetCore.Components.Rendering;
+using Microsoft.JSInterop;
 
 namespace Microsoft.AspNetCore.Components;
 
@@ -289,6 +290,11 @@
             {
                 await task;
             }
+            catch (JSTimeoutException)
+            {
+                // Let JSTimeoutException bubble up to provide meaningful error information
+                throw;
+            }
             catch // avoiding exception filters for AOT runtime support
             {
                 // Ignore exceptions from task cancellations.
@@ -332,6 +338,11 @@
         {
             await task;
         }
+        catch (JSTimeoutException)
+        {
+            // Let JSTimeoutException bubble up to provide meaningful error information
+            throw;
+        }
         catch // avoiding exception filters for AOT runtime support
         {
             // Ignore exceptions from task cancellations, but don't bother issuing a state change.

src/Components/Components/test/ComponentBaseTest.cs

@@ -4,6 +4,7 @@
 using System.Diagnostics;
 using Microsoft.AspNetCore.Components.Rendering;
 using Microsoft.AspNetCore.Components.Test.Helpers;
+using Microsoft.JSInterop;
 
 namespace Microsoft.AspNetCore.Components.Test;
 
@@ -463,6 +464,24 @@ public async Task RenderRootComponentAsync_ReportsErrorDuringOnParameterSetAsync
         Assert.Same(expected, actual);
     }
 
+    [Fact]
+    public async Task ComponentBase_AllowsJSTimeoutExceptionToBubbleUp()
+    {
+        // Arrange
+        var renderer = new TestRenderer();
+        var component = new TestComponent();
+
+        var timeoutException = new JSTimeoutException("Test timeout");
+        component.OnParametersSetAsyncLogic = _ => Task.FromException(timeoutException);
+
+        // Act & Assert
+        var componentId = renderer.AssignRootComponentId(component);
+        var actual = await Assert.ThrowsAsync<JSTimeoutException>(() => renderer.RenderRootComponentAsync(componentId));
+
+        // Assert
+        Assert.Same(timeoutException, actual);
+    }
+
     private class TestComponent : ComponentBase
     {
         public bool RunsBaseOnInit { get; set; } = true;

src/JSInterop/Microsoft.JSInterop/src/JSRuntime.cs

@@ -113,8 +113,17 @@ public ValueTask<IJSObjectReference> InvokeNewAsync(string identifier, Cancellat
         if (DefaultAsyncTimeout.HasValue)
         {
             using var cts = new CancellationTokenSource(DefaultAsyncTimeout.Value);
-            // We need to await here due to the using
-            return await InvokeAsync<TValue>(targetInstanceId, identifier, callType, cts.Token, args);
+
+            try
+            {
+                // We need to await here due to the using
+                return await InvokeAsync<TValue>(targetInstanceId, identifier, callType, cts.Token, args);
+            }
+            catch (OperationCanceledException) when (cts.Token.IsCancellationRequested)
+            {
+                // This was cancelled due to our timeout, throw a more meaningful exception
+                throw new JSTimeoutException("A JavaScript interop call timed out. Consider increasing the timeout duration if the operation is expected to take longer.");
+            }
         }
 
         return await InvokeAsync<TValue>(targetInstanceId, identifier, callType, CancellationToken.None, args);

src/JSInterop/Microsoft.JSInterop/src/JSTimeoutException.cs

@@ -0,0 +1,27 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the MIT license.
+
+namespace Microsoft.JSInterop;
+
+/// <summary>
+/// Represents errors that occur when a JavaScript interop call times out.
+/// </summary>
+public class JSTimeoutException : JSException
+{
+    /// <summary>
+    /// Constructs an instance of <see cref="JSTimeoutException"/>.
+    /// </summary>
+    /// <param name="message">The exception message.</param>
+    public JSTimeoutException(string message) : base(message)
+    {
+    }
+
+    /// <summary>
+    /// Constructs an instance of <see cref="JSTimeoutException"/>.
+    /// </summary>
+    /// <param name="message">The exception message.</param>
+    /// <param name="innerException">The inner exception.</param>
+    public JSTimeoutException(string message, Exception innerException) : base(message, innerException)
+    {
+    }
+}

src/JSInterop/Microsoft.JSInterop/src/PublicAPI.Unshipped.txt

@@ -54,6 +54,9 @@ Microsoft.JSInterop.JSRuntime.InvokeNewAsync(string! identifier, object?[]? args
 Microsoft.JSInterop.JSRuntime.InvokeNewAsync(string! identifier, System.Threading.CancellationToken cancellationToken, object?[]? args) -> System.Threading.Tasks.ValueTask<Microsoft.JSInterop.IJSObjectReference!>
 Microsoft.JSInterop.JSRuntime.SetValueAsync<TValue>(string! identifier, TValue value) -> System.Threading.Tasks.ValueTask
 Microsoft.JSInterop.JSRuntime.SetValueAsync<TValue>(string! identifier, TValue value, System.Threading.CancellationToken cancellationToken) -> System.Threading.Tasks.ValueTask
+Microsoft.JSInterop.JSTimeoutException
+Microsoft.JSInterop.JSTimeoutException.JSTimeoutException(string! message) -> void
+Microsoft.JSInterop.JSTimeoutException.JSTimeoutException(string! message, System.Exception! innerException) -> void
 static Microsoft.JSInterop.JSObjectReferenceExtensions.InvokeNewAsync(this Microsoft.JSInterop.IJSObjectReference! jsObjectReference, string! identifier, params object?[]? args) -> System.Threading.Tasks.ValueTask<Microsoft.JSInterop.IJSObjectReference!>
 static Microsoft.JSInterop.JSObjectReferenceExtensions.InvokeNewAsync(this Microsoft.JSInterop.IJSObjectReference! jsObjectReference, string! identifier, System.Threading.CancellationToken cancellationToken, object?[]? args) -> System.Threading.Tasks.ValueTask<Microsoft.JSInterop.IJSObjectReference!>
 static Microsoft.JSInterop.JSObjectReferenceExtensions.InvokeNewAsync(this Microsoft.JSInterop.IJSObjectReference! jsObjectReference, string! identifier, System.TimeSpan timeout, object?[]? args) -> System.Threading.Tasks.ValueTask<Microsoft.JSInterop.IJSObjectReference!>

src/JSInterop/Microsoft.JSInterop/test/JSRuntimeTest.cs

@@ -37,7 +37,7 @@ public void DispatchesAsyncCallsWithDistinctAsyncHandles()
     }
 
     [Fact]
-    public async Task InvokeAsync_CancelsAsyncTask_AfterDefaultTimeout()
+    public async Task InvokeAsync_ThrowsJSTimeoutException_AfterDefaultTimeout()
     {
         // Arrange
         var runtime = new TestJSRuntime();
@@ -47,7 +47,7 @@ public async Task InvokeAsync_CancelsAsyncTask_AfterDefaultTimeout()
         var task = runtime.InvokeAsync<object>("test identifier 1", "arg1", 123, true);
 
         // Assert
-        await Assert.ThrowsAsync<TaskCanceledException>(async () => await task);
+        await Assert.ThrowsAsync<JSTimeoutException>(async () => await task);
     }
 
     [Fact]