[FluentInputFile] [Docs] Add null check on initialization (#3062)

* Fix CodeSnippet * Fix 3061
microsoft · Dec 18, 2024 · a83077b · a83077b
1 parent 61ef3de
commit a83077b
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 12 deletions.
diff --git a/examples/Demo/Shared/Components/CodeSnippet.razor.js b/examples/Demo/Shared/Components/CodeSnippet.razor.js
@@ -21,7 +21,9 @@ export function addCopyButton() {
 }
 
 export function highlightElement(id) {
-    if (hljs) {
-        hljs.highlightElement(id);
+    try {
+        hljs?.highlightElement(id);
+    } catch (e) {
+        // highlightJS may fail when the user navigates away from the page quickly. Which when not catched will result in a crash.
     }
 }
diff --git a/src/Core/Components/InputFile/FluentInputFile.razor.js b/src/Core/Components/InputFile/FluentInputFile.razor.js
@@ -57,20 +57,20 @@ export function initializeFileDropZone(containerElement, inputFile) {
     //}
 
     // Register all events
-    containerElement.addEventListener("dragenter", onDragHover);
-    containerElement.addEventListener("dragover", onDragHover);
-    containerElement.addEventListener("dragleave", onDragLeave);
-    containerElement.addEventListener("drop", onDrop);
-    //containerElement.addEventListener('paste', onPaste);
+    containerElement?.addEventListener("dragenter", onDragHover);
+    containerElement?.addEventListener("dragover", onDragHover);
+    containerElement?.addEventListener("dragleave", onDragLeave);
+    containerElement?.addEventListener("drop", onDrop);
+    //containerElement?.addEventListener('paste', onPaste);
 
     // The returned object allows to unregister the events when the Blazor component is destroyed
     return {
         dispose: () => {
-            containerElement.removeEventListener('dragenter', onDragHover);
-            containerElement.removeEventListener('dragover', onDragHover);
-            containerElement.removeEventListener('dragleave', onDragLeave);
-            containerElement.removeEventListener("drop", onDrop);
-            //containerElement.removeEventListener('paste', onPaste);
+            containerElement?.removeEventListener('dragenter', onDragHover);
+            containerElement?.removeEventListener('dragover', onDragHover);
+            containerElement?.removeEventListener('dragleave', onDragLeave);
+            containerElement?.removeEventListener("drop", onDrop);
+            //containerElement?.removeEventListener('paste', onPaste);
         }
     }
 }