[release/8.0] [Blazor] Fix default reconnect display not showing after enhanced navigation (#51173)

# Fix default reconnect display not showing after enhanced navigation

Fixes an issue where the Blazor Server default reconnect display stops showing up during reconnection if an enhanced navigation occurs after the first time it was displayed.

## Description

This issue happened because the reconnect display had its own state tracking whether it added itself to the DOM. However, an enhanced navigation may forcefully remove the reconnect display from the DOM without its knowing.

This PR fixes the issue by changing the existing logic to instead check whether the reconnect display's root element is part of the `document`, and if it isn't, it gets added to the `body`.

Fixes #51083

## Customer Impact

If a customer's app has a user with a flaky connection, it's likely that the reconnect display will stop appearing if the user reconnects multiple times in the same session. This means that the user will not receive any feedback that the app is reconnecting and may attempt to keep interacting with the app without understanding why it's not responding.

It should be noted that this bug only applies to "Blazor Web"-style apps, which are new in .NET 8. Existing Blazor Server scenarios are not affected.

## Regression?

- [ ] Yes
- [X] No

This only affects "Blazor Web"-style apps which are new in .NET 8. The reconnect display always exhibited this bug for Blazor Web apps, so this is not a regression.

## Risk

- [ ] High
- [ ] Medium
- [X] Low

The change is extremely small, isolated, and easy to reason about.

## Verification

- [X] Manual (required)
- [X] Automated

## Packaging changes reviewed?

- [ ] Yes
- [ ] No
- [X] N/A
---------

Co-authored-by: Christoph <[email protected]>

Author: MackinnonBuck

src/Components/Web.JS/dist/Release/blazor.server.js

@@ -12,8 +12,6 @@ export class DefaultReconnectDisplay implements ReconnectDisplay {
 
   button: HTMLButtonElement;
 
-  addedToDom = false;
-
   reloadParagraph: HTMLParagraphElement;
 
   loader: HTMLDivElement;
@@ -85,8 +83,7 @@ export class DefaultReconnectDisplay implements ReconnectDisplay {
   }
 
   show(): void {
-    if (!this.addedToDom) {
-      this.addedToDom = true;
+    if (!this.document.contains(this.modal)) {
       this.document.body.appendChild(this.modal);
     }
     this.modal.style.display = 'block';

src/Components/Web.JS/dist/Release/blazor.web.js

@@ -0,0 +1,77 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the MIT license.
+
+using Components.TestServer.RazorComponents;
+using Microsoft.AspNetCore.Components.E2ETest.Infrastructure;
+using Microsoft.AspNetCore.Components.E2ETest.Infrastructure.ServerFixtures;
+using Microsoft.AspNetCore.E2ETesting;
+using OpenQA.Selenium;
+using TestServer;
+using Xunit.Abstractions;
+
+namespace Microsoft.AspNetCore.Components.E2ETests.ServerRenderingTests;
+
+[CollectionDefinition(nameof(InteractivityTest), DisableParallelization = true)]
+public class EndpointsServerReconnectionTest : ServerTestBase<BasicTestAppServerSiteFixture<RazorComponentEndpointsStartup<App>>>
+{
+    public EndpointsServerReconnectionTest(
+        BrowserFixture browserFixture,
+        BasicTestAppServerSiteFixture<RazorComponentEndpointsStartup<App>> serverFixture,
+        ITestOutputHelper output)
+        : base(browserFixture, serverFixture, output)
+    {
+    }
+
+    public override Task InitializeAsync()
+        => InitializeAsync(BrowserFixture.StreamingContext);
+
+    [Fact]
+    public void ReconnectUI_Displays_OnFirstReconnect()
+    {
+        Navigate($"{ServerPathBase}/streaming-interactivity");
+
+        Browser.Equal("Not streaming", () => Browser.FindElement(By.Id("status")).Text);
+
+        Browser.Click(By.Id("add-server-counter-prerendered-link"));
+        Browser.Equal("True", () => Browser.FindElement(By.Id("is-interactive-0")).Text);
+
+        var javascript = (IJavaScriptExecutor)Browser;
+
+        javascript.ExecuteScript("Blazor._internal.forceCloseConnection()");
+        Browser.Equal("block", () => Browser.Exists(By.Id("components-reconnect-modal")).GetCssValue("display"));
+        Browser.Equal("none", () => Browser.Exists(By.Id("components-reconnect-modal")).GetCssValue("display"));
+        Browser.Exists(By.Id("increment-0")).Click();
+        Browser.Equal("1", () => Browser.Exists(By.Id("count-0")).Text);
+    }
+
+    [Fact]
+    public void ReconnectUI_Displays_OnSuccessiveReconnects_AfterEnhancedNavigation()
+    {
+        Navigate($"{ServerPathBase}/streaming-interactivity");
+
+        Browser.Equal("Not streaming", () => Browser.FindElement(By.Id("status")).Text);
+
+        Browser.Click(By.Id("add-server-counter-prerendered-link"));
+        Browser.Equal("True", () => Browser.FindElement(By.Id("is-interactive-0")).Text);
+
+        var javascript = (IJavaScriptExecutor)Browser;
+
+        // Perform the first reconnect
+        javascript.ExecuteScript("Blazor._internal.forceCloseConnection()");
+        Browser.Equal("block", () => Browser.Exists(By.Id("components-reconnect-modal")).GetCssValue("display"));
+        Browser.Equal("none", () => Browser.Exists(By.Id("components-reconnect-modal")).GetCssValue("display"));
+        Browser.Exists(By.Id("increment-0")).Click();
+        Browser.Equal("1", () => Browser.Exists(By.Id("count-0")).Text);
+
+        // Perform an enhanced navigation by updating the component's parameters
+        Browser.Exists(By.Id("update-counter-link-0")).Click();
+        Browser.Equal("2", () => Browser.FindElement(By.Id("increment-amount-0")).Text);
+
+        // Perform the second reconnect
+        javascript.ExecuteScript("Blazor._internal.forceCloseConnection()");
+        Browser.Equal("block", () => Browser.Exists(By.Id("components-reconnect-modal")).GetCssValue("display"));
+        Browser.Equal("none", () => Browser.Exists(By.Id("components-reconnect-modal")).GetCssValue("display"));
+        Browser.Exists(By.Id("increment-0")).Click();
+        Browser.Equal("3", () => Browser.Exists(By.Id("count-0")).Text);
+    }
+}