Improvements and fixes for piral-blazor

smapiot · Dec 22, 2023 · 11f3e6f · 11f3e6f
1 parent d566977
commit 11f3e6f
Show file tree

Hide file tree

Showing 3 changed files with 40 additions and 32 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,10 @@
 # Piral Changelog
 
+## 1.4.3 (tbd)
+
+- Fixed issue with `piral-blazor` using routing in standalone mode
+- Fixed issue with `piral-blazor` connecting the Piral events
+
 ## 1.4.2 (December 16, 2023)
 
 - Fixed misplaced *index.d.ts* in a scaffolded pilet (#658)

diff --git a/src/converters/piral-blazor/src/converter.ts b/src/converters/piral-blazor/src/converter.ts
@@ -87,32 +87,32 @@ export function createConverter(
         }
       }
 
+      if (capabilities.includes('events')) {
+        const eventDispatcher = document.body.dispatchEvent;
+
+        // listen to all events for forwarding them
+        document.body.dispatchEvent = function (ev: CustomEvent) {
+          if (ev.type.startsWith('piral-')) {
+            const type = ev.type.replace('piral-', '');
+            const args = ev.detail.arg;
+
+            try {
+              JSON.stringify(args);
+              processEvent(type, args);
+            } catch {
+              console.warn(`The event "${type}" could not be serialized and will not be handled by Blazor.`);
+            }
+          }
+
+          return eventDispatcher.call(this, ev);
+        };
+      }
+
       if (language && capabilities.includes('language')) {
         if (typeof language.current === 'string') {
           await setLanguage(language.current);
         }
 
-        if (capabilities.includes('events')) {
-          const eventDispatcher = document.body.dispatchEvent;
-
-          // listen to all events for forwarding them
-          document.body.dispatchEvent = function (ev: CustomEvent) {
-            if (ev.type.startsWith('piral-')) {
-              const type = ev.type.replace('piral-', '');
-              const args = ev.detail.arg;
-
-              try {
-                JSON.stringify(args);
-                processEvent(type, args);
-              } catch {
-                console.warn(`The event "${type}" could not be serialized and will not be handled by Blazor.`);
-              }
-            }
-
-            return eventDispatcher.call(this, ev);
-          };
-        }
-
         if (typeof language.onChange === 'function') {
           language.onChange(setLanguage);
         }
@@ -148,16 +148,6 @@ export function createConverter(
 
       addGlobalEventListeners(el);
 
-      if (listener === undefined) {
-        listener = nav.listen(({ location, action }) => {
-          // POP is already handled by .NET
-          if (action !== 'POP') {
-            const url = makeUrl(location.href);
-            callNotifyLocationChanged(url, action === 'REPLACE', location.state);
-          }
-        });
-      }
-
       locals.state = 'fresh';
       locals.next = noop;
       locals.dispose = attachEvents(
@@ -217,6 +207,19 @@ export function createConverter(
       }
 
       (loader || (convert.loader = loader = boot(opts)))
+        .then((config) => {
+          if (listener === undefined) {
+            listener = nav.listen(({ location, action }) => {
+              // POP is already handled by .NET
+              if (action !== 'POP') {
+                const url = makeUrl(location.href);
+                callNotifyLocationChanged(url, action === 'REPLACE', location.state);
+              }
+            });
+          }
+
+          return config;
+        })
         .then((config) =>
           dependency(config).then(() => {
             if (locals.state === 'fresh') {

diff --git a/src/converters/piral-blazor/src/interop.ts b/src/converters/piral-blazor/src/interop.ts
@@ -6,7 +6,7 @@ const wasmLib = 'Microsoft.AspNetCore.Components.WebAssembly';
 const coreLib = 'Piral.Blazor.Core';
 
 function isDotNet6OrBelow() {
-  return typeof window.Blazor._internal.NavigationLock === 'undefined';
+  return typeof window.Blazor?._internal?.NavigationLock === 'undefined';
 }
 
 function createBase() {