Merge pull request #211 from shoelace-style/autoloader

Only run autoloader once; show warnings when imports fail

src/utilities/autoloader.ts

@@ -10,6 +10,20 @@ const observer = new MutationObserver(mutations => {
   }
 });
 
+/** Starts the autoloader. */
+export function startLoader() {
+  // Initial discovery
+  discover(document.body);
+
+  // Listen for new undefined elements
+  observer.observe(document.documentElement, { subtree: true, childList: true });
+}
+
+/** Stops the autoloader */
+export function stopLoader() {
+  observer.disconnect();
+}
+
 /**
  * Checks a node for undefined elements and attempts to register them.
  */
@@ -28,7 +42,14 @@ export async function discover(root: Element | ShadowRoot) {
   // Make the list unique
   const tagsToRegister = [...new Set(tags)];
 
-  await Promise.allSettled(tagsToRegister.map(tagName => register(tagName)));
+  const imports = await Promise.allSettled(tagsToRegister.map(tagName => register(tagName)));
+
+  // When an import fails, show a warning
+  for (const imp of imports) {
+    if (imp.status === 'rejected') {
+      console.warn(imp.reason); // eslint-disable-line no-console
+    }
+  }
 }
 
 /**
@@ -48,9 +69,3 @@ function register(tagName: string): Promise<void> {
     import(path).then(() => resolve()).catch(() => reject(new Error(`Unable to autoload <${tagName}> from ${path}`)));
   });
 }
-
-// Initial discovery
-discover(document.body);
-
-// Listen for new undefined elements
-observer.observe(document.documentElement, { subtree: true, childList: true });

src/webawesome.loader.ts

@@ -1,5 +1,5 @@
-import { discover } from './webawesome.js';
-
-discover(document.body);
+import { startLoader } from './webawesome.js';
 
 export * from './webawesome.js';
+
+startLoader();

src/webawesome.ts

@@ -1,7 +1,7 @@
 export { getBasePath, setBasePath, getKitCode, setKitCode } from './utilities/base-path.js';
 export { registerIconLibrary, unregisterIconLibrary } from './components/icon/library.js';
 export { registerTranslation } from './utilities/localize.js';
-export { discover } from './utilities/autoloader.js';
+export { discover, startLoader, stopLoader } from './utilities/autoloader.js';
 
 // Utilities
 export * from './utilities/animation.js';