-
Notifications
You must be signed in to change notification settings - Fork 10k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Blazor] Updated Blazor Server reconnect UI #55723
Conversation
Here are some additional open questions after some internal discussion:
Other notes:
|
We could set a custom property so that people can style the elements appropriately with container style queries https://developer.chrome.com/docs/css-ui/style-queries Support for this is on its way https://caniuse.com/css-container-queries-style and will likely be there when we ship. On our part, setting up a custom property does not tie us into anything and people will be able to leverage this feature once it arrives on stable versions. |
src/Components/Web.JS/src/Platform/Circuits/DefaultReconnectDisplay.ts
Outdated
Show resolved
Hide resolved
src/Components/Web.JS/src/Platform/Circuits/CircuitStartOptions.ts
Outdated
Show resolved
Hide resolved
src/Components/Web.JS/src/Platform/Circuits/CircuitStartOptions.ts
Outdated
Show resolved
Hide resolved
src/Components/Web.JS/src/Platform/Circuits/DefaultReconnectionHandler.ts
Outdated
Show resolved
Hide resolved
src/Components/Web.JS/src/Platform/Circuits/DefaultReconnectionHandler.ts
Outdated
Show resolved
Hide resolved
@@ -297,6 +307,10 @@ export class CircuitManager implements DotNet.DotNetCallDispatcher { | |||
this.disconnect(); | |||
} | |||
|
|||
private setCircuitStatus(status: 'connecting' | 'connected' | 'disconnected') { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I acknowledge that calls to this are somewhat scattered across the implementation - unfortunately there are a lot of ways in which the circuit can fail to connect, and connection is handled different when connecting for the first time vs reconnecting after a disconnect. Ideally the code would be structured in a way where changes in circuit state were handled in a more centralized manner, that would fairly significantly increase the size of this PR.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Also the current possible values are 'connecting'
, 'connected'
, and 'disconnected'
. In the period between reconnect attempts, the status is 'disconnected'
. Also, the status is 'connecting'
when the circuit is performing its initial connection.
I think this behavior accurately reflects the true state of the circuit, but I wonder if it's more useful to make the status ''
when connected (or as long as a disconnection has never happened), 'reconnecting'
when the circuit is disconnected but the reconnect handler is running, and 'disconnected'
after reconnection has failed. Thoughts on this?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actually, it's not super clear to me what the expected usage pattern would be for this new custom CSS property. It seems that it would primarily be useful when using container style queries, which not yet supported in all major browsers.
We could alternatively put an attribute on the <html>
element like data-circuit-status
and then developers could use an attribute selector to customize styles depending on what that attribute's value is.
I'm probably going to scope this out of the PR for now, and we can think about adding an attribute or custom CSS property at a later time.
src/Components/Web.JS/src/Platform/Circuits/CircuitStartOptions.ts
Outdated
Show resolved
Hide resolved
7c606e6
to
6486710
Compare
/backport to main |
Started backporting to main: https://github.com/dotnet/aspnetcore/actions/runs/9289346719 |
Updated Blazor Server reconnect UI
Improves the default Blazor Server reconnect experience according to common customer feedback.
Description
Makes the following improvements to the Blazor Server reconnect UI:
Fixes #55721
Customer Impact
Customers of apps built using Blazor Server often complain about the reconnection experience, which has motivated Blazor developers to open issues like #32113 suggesting improvements to reduce the amount of time the customer spends looking at the reconnect UI. This PR addresses many of those common concerns by performing reconnection attempts more aggressively. Unless apps have overridden the default reconnection options, they will automatically get thew new reconnect behavior by upgrading to .NET 9. In addition, the default reconnect UI styling has been updated. Styling changes will not affect apps that have overridden the default reconnect UI.
Regression?
Risk
This change only affects the reconnection experience when using Blazor Server or Server interactivity in a Blazor Web App. We have existing automated tests verifying core reconnect functionality. It's possible that some customers may have been relying on the previous defaults, but they'll still be able to override the new defaults if desired.
Verification
Packaging changes reviewed?