Improve initialization and SignalR configuration

Ryan Nowak · Ryan Nowak · commit 1423d50ceb14 · 2019-04-01T18:03:26.000-07:00
Fixes: #6887 and #6887 and #5624 Adds support for calling Blazor.start({...}) and passing in a configuration object. For now all you can configure is the SignalR HubConnectionBuilder. This is a priority right now because we want to make configuring SignalR's logging accessible.
diff --git a/src/Components/Blazor/Templates/src/content/BlazorHosted-CSharp/BlazorHosted-CSharp.Client/wwwroot/index.html b/src/Components/Blazor/Templates/src/content/BlazorHosted-CSharp/BlazorHosted-CSharp.Client/wwwroot/index.html
@@ -11,6 +11,6 @@
 <body>
     <app>Loading...</app>
 
-    <script src="_framework/components.webassembly.js"></script>
+    <script src="_framework/components.webassembly.js" start></script>
 </body>
 </html>
diff --git a/src/Components/Blazor/Templates/src/content/BlazorStandalone-CSharp/wwwroot/index.html b/src/Components/Blazor/Templates/src/content/BlazorStandalone-CSharp/wwwroot/index.html
@@ -11,6 +11,6 @@
 <body>
     <app>Loading...</app>
 
-    <script src="_framework/components.webassembly.js"></script>
+    <script src="_framework/components.webassembly.js" start></script>
 </body>
 </html>
diff --git a/src/Components/Blazor/testassets/HostedInAspNet.Client/wwwroot/index.html b/src/Components/Blazor/testassets/HostedInAspNet.Client/wwwroot/index.html
@@ -7,6 +7,6 @@
 <body>
     <app>Loading...</app>
     <script src="customJsFileForTests.js"></script>
-    <script src="_framework/components.webassembly.js"></script>
+    <script src="_framework/components.webassembly.js" start></script>
 </body>
 </html>
diff --git a/src/Components/Blazor/testassets/Microsoft.AspNetCore.Blazor.E2EPerformance/wwwroot/blazor-frame.html b/src/Components/Blazor/testassets/Microsoft.AspNetCore.Blazor.E2EPerformance/wwwroot/blazor-frame.html
@@ -19,6 +19,6 @@
     </script>
 
     <app>Loading...</app>
-    <script src="_framework/components.webassembly.js"></script>
+    <script src="_framework/components.webassembly.js" start></script>
 </body>
 </html>
diff --git a/src/Components/Blazor/testassets/StandaloneApp/wwwroot/index.html b/src/Components/Blazor/testassets/StandaloneApp/wwwroot/index.html
@@ -11,6 +11,6 @@
 <body>
     <app>Loading...</app>
 
-    <script src="_framework/components.webassembly.js"></script>
+    <script src="_framework/components.webassembly.js" start></script>
 </body>
 </html>
diff --git a/src/Components/Browser.JS/src/Boot.Server.ts b/src/Components/Browser.JS/src/Boot.Server.ts
@@ -5,11 +5,19 @@ import { MessagePackHubProtocol } from '@aspnet/signalr-protocol-msgpack';
 import { OutOfProcessRenderBatch } from './Rendering/RenderBatch/OutOfProcessRenderBatch';
 import { internalFunctions as uriHelperFunctions } from './Services/UriHelper';
 import { renderBatch } from './Rendering/Renderer';
-import { fetchBootConfigAsync, loadEmbeddedResourcesAsync } from './BootCommon';
+import { fetchBootConfigAsync, loadEmbeddedResourcesAsync, autoStartIfApplicable } from './BootCommon';
 import { CircuitHandler } from './Platform/Circuits/CircuitHandler';
 import { AutoReconnectCircuitHandler } from './Platform/Circuits/AutoReconnectCircuitHandler';
 
-async function boot() {
+let started = false;
+
+async function boot(options?: any) {
+
+  if (started) {
+    throw new Error('Blazor has already started.');
+  }
+  started = true;
+
   const circuitHandlers: CircuitHandler[] = [ new AutoReconnectCircuitHandler() ];
   window['Blazor'].circuitHandlers = circuitHandlers;
 
@@ -18,7 +26,9 @@ async function boot() {
     return loadEmbeddedResourcesAsync(bootConfig);
   });
 
-  const initialConnection = await initializeConnection(circuitHandlers);
+  // pass options.configureSignalR to configure the signalR.HubConnectionBuilder
+  const configureSignalR = (options || {}).configureSignalR
+  const initialConnection = await initializeConnection(configureSignalR, circuitHandlers);
 
   // Ensure any embedded resources have been loaded before starting the app
   await embeddedResourcesPromise;
@@ -29,7 +39,7 @@ async function boot() {
   );
 
   window['Blazor'].reconnect = async () => {
-    const reconnection = await initializeConnection(circuitHandlers);
+    const reconnection = await initializeConnection(configureSignalR, circuitHandlers);
     if (!(await reconnection.invoke<Boolean>('ConnectCircuit', circuitId))) {
       return false;
     }
@@ -41,14 +51,18 @@ async function boot() {
   circuitHandlers.forEach(h => h.onConnectionUp && h.onConnectionUp());
 }
 
-async function initializeConnection(circuitHandlers: CircuitHandler[]): Promise<signalR.HubConnection> {
+async function initializeConnection(configureSignalR: (builder: signalR.HubConnectionBuilder) => void, circuitHandlers: CircuitHandler[]): Promise<signalR.HubConnection> {
   const hubProtocol = new MessagePackHubProtocol();
   (hubProtocol as any).name = 'blazorpack';
-  const connection = new signalR.HubConnectionBuilder()
+  const connectionBuilder = new signalR.HubConnectionBuilder()
     .withUrl('_blazor')
-    .withHubProtocol(hubProtocol)
-    .configureLogging(signalR.LogLevel.Information)
-    .build();
+    .withHubProtocol(hubProtocol);
+
+  if (configureSignalR) {
+    configureSignalR(connectionBuilder);
+  }
+
+  const connection = connectionBuilder.build();
 
   connection.on('JS.BeginInvokeJS', DotNet.jsCallDispatcher.beginInvokeJSFromDotNet);
   connection.on('JS.RenderBatch', (browserRendererId: number, renderId: number, batchData: Uint8Array) => {
@@ -93,4 +107,5 @@ function unhandledError(connection: signalR.HubConnection, err: Error) {
   }
 }
 
-boot();
+window['Blazor'].start = boot;
+autoStartIfApplicable(boot);
diff --git a/src/Components/Browser.JS/src/Boot.WebAssembly.ts b/src/Components/Browser.JS/src/Boot.WebAssembly.ts
@@ -6,9 +6,17 @@ import { getAssemblyNameFromUrl } from './Platform/Url';
 import { renderBatch } from './Rendering/Renderer';
 import { SharedMemoryRenderBatch } from './Rendering/RenderBatch/SharedMemoryRenderBatch';
 import { Pointer } from './Platform/Platform';
-import { fetchBootConfigAsync, loadEmbeddedResourcesAsync } from './BootCommon';
+import { fetchBootConfigAsync, loadEmbeddedResourcesAsync, autoStartIfApplicable } from './BootCommon';
+
+let started = false;
+
+async function boot(options?: any) {
+
+  if (started) {
+    throw new Error('Blazor has already started.');
+  }
+  started = true;
 
-async function boot() {
   // Configure environment for execution under Mono WebAssembly with shared-memory rendering
   const platform = Environment.setPlatform(monoPlatform);
   window['Blazor'].platform = platform;
@@ -43,4 +51,5 @@ async function boot() {
   platform.callEntryPoint(mainAssemblyName, bootConfig.entryPoint, []);
 }
 
-boot();
+window['Blazor'].start = boot;
+autoStartIfApplicable(boot);
diff --git a/src/Components/Browser.JS/src/BootCommon.ts b/src/Components/Browser.JS/src/BootCommon.ts
@@ -37,3 +37,13 @@ interface BootJsonData {
   jsReferences: string[];
   linkerEnabled: boolean;
 }
+
+// calls Blazor.start() if the script was added with <script src="..." start></script>
+export function autoStartIfApplicable(start: (options?: any)=> Promise<void>) {
+  if (document &&
+    document.currentScript &&
+    document.currentScript.hasAttribute("start") &&
+    document.currentScript.getAttribute("start") !== "false") {
+      start();
+  }
+}
diff --git a/src/Components/Browser.JS/src/GlobalExports.ts b/src/Components/Browser.JS/src/GlobalExports.ts
@@ -1,8 +1,6 @@
-import { platform } from './Environment';
 import { navigateTo, internalFunctions as uriHelperInternalFunctions } from './Services/UriHelper';
 import { internalFunctions as httpInternalFunctions } from './Services/Http';
 import { attachRootComponentToElement } from './Rendering/Renderer';
-import { Pointer } from './Platform/Platform';
 
 // Make the following APIs available in global scope for invocation from JS
 window['Blazor'] = {
@@ -13,4 +11,4 @@ window['Blazor'] = {
     http: httpInternalFunctions,
     uriHelper: uriHelperInternalFunctions
   }
-};
+};
diff --git a/src/Components/test/testassets/BasicTestApp/wwwroot/index.html b/src/Components/test/testassets/BasicTestApp/wwwroot/index.html
@@ -26,7 +26,7 @@
       var src = location.hash === '#server'
         ? 'components.server.js'
         : 'components.webassembly.js';
-      document.write('<script src="_framework/' + src + '"><' + '/script>');
+      document.write('<script src="_framework/' + src + '" start><' + '/script>');
     })();
   </script>
 </body>
diff --git a/src/Components/test/testassets/ComponentsApp.Server/Pages/Index.cshtml b/src/Components/test/testassets/ComponentsApp.Server/Pages/Index.cshtml
@@ -15,5 +15,12 @@
     <app>@(await Html.RenderComponentAsync<App>())</app>
 
     <script src="_framework/components.server.js"></script>
+    <script>
+        Blazor.start({
+            configureSignalR: function (builder) {
+                builder.configureLogging(2); // LogLevel.Information
+            }
+        });
+    </script>
 </body>
 </html>
diff --git a/src/Components/test/testassets/TestServer/Pages/PrerenderedHost.cshtml b/src/Components/test/testassets/TestServer/Pages/PrerenderedHost.cshtml
@@ -19,6 +19,9 @@
     function loadBootScript(event) {
         event.srcElement.disabled = true;
         var scriptElem = document.createElement('script');
+        scriptElem.onload = function () {
+            Blazor.start();
+        };
         scriptElem.src = '_framework/components.server.js';
         document.body.appendChild(scriptElem);
     }
diff --git a/src/ProjectTemplates/Web.ProjectTemplates/content/RazorComponentsWeb-CSharp/Pages/Host.cshtml b/src/ProjectTemplates/Web.ProjectTemplates/content/RazorComponentsWeb-CSharp/Pages/Host.cshtml
@@ -24,6 +24,6 @@
 <body>
     <app>@(await Html.RenderComponentAsync<App>())</app>
 
-    <script src="_framework/components.server.js"></script>
+    <script src="_framework/components.server.js" start></script>
 </body>
 </html>
