diff --git a/aspnetcore/blazor/fundamentals/additional-scenarios.md b/aspnetcore/blazor/fundamentals/additional-scenarios.md index 9e37e8192304..8d896656b814 100644 --- a/aspnetcore/blazor/fundamentals/additional-scenarios.md +++ b/aspnetcore/blazor/fundamentals/additional-scenarios.md @@ -112,20 +112,62 @@ Blazor Server apps are set up by default to prerender the UI on the server befor Rendering server components from a static HTML page isn't supported. -## Configure the SignalR client for Blazor Server apps +## Initialize the Blazor circuit *This section applies to Blazor Server.* -Configure the SignalR client used by Blazor Server apps in the `Pages/_Host.cshtml` file. Place a script that calls `Blazor.start` after the `_framework/blazor.server.js` script and inside the `
+ + ... + + + + + ... @@ -148,12 +190,16 @@ The reconnection handler's circuit connection events can be modified for custom * To notify the user if the connection is dropped. * To perform logging (from the client) when a circuit is connected. -To modify the connection events: +To modify the connection events, register callbacks for the following connection changes: -* Add an `autostart="false"` attribute to the ` @@ -170,12 +216,11 @@ To modify the connection events: ### Adjust the reconnection retry count and interval -To adjust the reconnection retry count and interval: - -* Add an `autostart="false"` attribute to the ` @@ -190,14 +235,13 @@ To adjust the reconnection retry count and interval:` tag. +Configure the manual start of a Blazor Server app's [SignalR circuit](xref:blazor/hosting-models#circuits) in the `Pages/_Host.cshtml` file: -### Logging +* Add an `autostart="false"` attribute to the ` + + +``` + +### Chain to the `Promise` that results from a manual start + +To perform additional tasks, such as JS interop initialization, use `then` to chain to the `Promise` that results from a manual Blazor app start: ```cshtml +
+``` + +### Configure the SignalR client + +#### Logging + +To configure SignalR client logging, pass in a configuration object (`configureSignalR`) that calls `configureLogging` with the log level on the client builder: + +```cshtml +
``` -### Hide or replace the reconnection display +## Hide or replace the reconnection display -To hide the reconnection display: - -* Add an `autostart="false"` attribute to the ` @@ -205,6 +249,8 @@ To hide the reconnection display: window.addEventListener('beforeunload', function () { Blazor.defaultReconnectionHandler._reconnectionDisplay = {}; }); + + Blazor.start(); ``` @@ -218,6 +264,18 @@ Blazor.defaultReconnectionHandler._reconnectionDisplay = The placeholder `{ELEMENT ID}` is the ID of the HTML element to display. +::: moniker range=">= aspnetcore-5.0" + +Customize the delay before the reconnection display appears by setting the `transition-delay` property in the app's CSS (`wwwroot/css/site.css`) for the modal element. The following example sets the transition delay from 500 ms (default) to 1,000 ms (1 second): + +```css +#components-reconnect-modal { + transition: visibility 0s linear 1000ms; +} +``` + +::: moniker-end + ## Influence HTML `
` tag elements *This section applies to the upcoming ASP.NET Core 5.0 release of Blazor WebAssembly and Blazor Server.*