fix: error handling for declaration data

static/declaration-data.js

@@ -56,7 +56,7 @@ export class DeclarationDataCenter {
       const timestamp = await timestampRes.text();
 
       // try to use cache first
-      const data = await fetchCachedDeclarationData(timestamp);
+      const data = await fetchCachedDeclarationData(timestamp).catch(_e => null);
       if (data) {
         // if data is defined, use the cached one.
         DeclarationDataCenter.singleton = new DeclarationDataCenter(data);

static/find/find.js

@@ -53,23 +53,27 @@ async function findAndRedirect(pattern, strict, view) {
     window.location.replace(`${SITE_ROOT}404.html`);
   }
   // search for result
-  const dataCenter = await DeclarationDataCenter.init();
+  try {
-  let result = (dataCenter.search(pattern, strict) ?? [])[0]; // in case return non array
+    const dataCenter = await DeclarationDataCenter.init();
-  // if no result found, redirect to the 404 page
+    let result = (dataCenter.search(pattern, strict) ?? [])[0]; // in case return non array
-  if (!result) {
+    // if no result found, redirect to the 404 page
-    // TODO: better url semantic for 404, current implementation will lead to duplicate search for fuzzy match if not found.
+    if (!result) {
-    window.location.replace(`${SITE_ROOT}404.html#${pattern ?? ""}`);
+      // TODO: better url semantic for 404, current implementation will lead to duplicate search for fuzzy match if not found.
-  } else {
+      window.location.replace(`${SITE_ROOT}404.html#${pattern ?? ""}`);
-    // success, redirect to doc or source page, or to the semantic rdf.
-    if (!view) {
-      window.location.replace(result.link);
-    } else if (view == "doc") {
-      window.location.replace(result.docLink);
-    } else if (view == "src") {
-      window.location.replace(result.sourceLink);
     } else {
-      // fallback to doc page
+      // success, redirect to doc or source page, or to the semantic rdf.
-      window.location.replace(result.docLink);
+      if (!view) {
+        window.location.replace(result.link);
+      } else if (view == "doc") {
+        window.location.replace(result.docLink);
+      } else if (view == "src") {
+        window.location.replace(result.sourceLink);
+      } else {
+        // fallback to doc page
+        window.location.replace(result.docLink);
+      }
     }
+  } catch (e) {
+    document.write(`Cannot fetch data, please check your network connection.\n${e}`);
   }
-}
+}

static/search.js

@@ -4,7 +4,6 @@
 
 import { DeclarationDataCenter } from "./declaration-data.js";
 
-
 const SEARCH_FORM = document.querySelector("#search_form");
 const SEARCH_INPUT = SEARCH_FORM.querySelector("input[name=q]");
 
@@ -34,9 +33,7 @@ function handleSearchCursorUpDown(down) {
  * Perform search (when enter is pressed).
  */
 function handleSearchEnter() {
-  const sel =
+  const sel = sr.querySelector(`.selected`) || sr.firstChild;
-  sr.querySelector(`.selected`) ||
-    sr.firstChild;
   sel.click();
 }
 
@@ -72,9 +69,9 @@ function removeAllChildren(node) {
 }
 
 /**
- * Search autocompletion.
+ * Handle user input and perform search.
  */
-SEARCH_INPUT.addEventListener("input", async (ev) => {
+function handleSearch(dataCenter, err, ev) {
   const text = ev.target.value;
 
   // If no input clear all.
@@ -86,19 +83,36 @@ SEARCH_INPUT.addEventListener("input", async (ev) => {
 
   // searching
   sr.setAttribute("state", "loading");
-  const dataCenter = await DeclarationDataCenter.init();
-  const result = dataCenter.search(text, false);
 
-  // in case user has updated the input.
+  if (dataCenter) {
-  if (ev.target.value != text) return;
+    const result = dataCenter.search(text, false);
 
-  // update search results
+    // in case user has updated the input.
-  removeAllChildren(sr);
+    if (ev.target.value != text) return;
-  for (const { name, docLink } of result) {
+  
+    // update search results
+    removeAllChildren(sr);
+    for (const { name, docLink } of result) {
+      const d = sr.appendChild(document.createElement("a"));
+      d.innerText = name;
+      d.title = name;
+      d.href = docLink;
+    }
+  }
+  // handle error
+  else {
+    removeAllChildren(sr);
     const d = sr.appendChild(document.createElement("a"));
-    d.innerText = name;
+    d.innerText = `Cannot fetch data, please check your network connection.\n${err}`;
-    d.title = name;
-    d.href = docLink;
   }
   sr.setAttribute("state", "done");
-});
+}
+
+DeclarationDataCenter.init()
+  .then((dataCenter) => {
+    // Search autocompletion.
+    SEARCH_INPUT.addEventListener("input", ev => handleSearch(dataCenter, null, ev));
+  })
+  .catch(e => {
+    SEARCH_INPUT.addEventListener("input", ev => handleSearch(null, e, ev));
+  });