Chore: Prevent preloaded plugins from crashing Grafana (#41490) (#44143)

* if a plugin fails to load, we will not crash grafana.

* preventing the preloaded plugings to crash the whole app on failure.

* updated to unkown.

* fixed issue with angular by moving the preloadPlugin import to the same row as we did import the importPluginModule.

(cherry picked from commit e926126d63)

public/app/app.ts

@@ -24,8 +24,8 @@ import {
   standardTransformersRegistry,
 } from '@grafana/data';
 import { arrayMove } from 'app/core/utils/arrayMove';
-import { importPluginModule } from 'app/features/plugins/plugin_loader';
 import { registerEchoBackend, setEchoSrv, setPanelRenderer, setQueryRunnerFactory } from '@grafana/runtime';
+import { preloadPlugins } from './features/plugins/pluginPreloader';
 import { Echo } from './core/services/echo/Echo';
 import { reportPerformance } from './core/services/echo/EchoSrv';
 import { PerformanceBackend } from './core/services/echo/backends/PerformanceBackend';
@@ -106,12 +106,7 @@ export class GrafanaApp {
       this.angularApp.init();
 
       // Preload selected app plugins
-      const promises: Array<Promise<any>> = [];
+      await preloadPlugins(config.pluginsToPreload);
-      for (const plugin of config.pluginsToPreload) {
-        promises.push(importPluginModule(plugin.path, plugin.version));
-      }
-
-      await Promise.all(promises);
 
       ReactDOM.render(
         React.createElement(AppWrapper, {

public/app/features/plugins/pluginPreloader.ts

@@ -0,0 +1,15 @@
+import { PreloadPlugin } from '@grafana/data';
+import { importPluginModule } from './plugin_loader';
+
+export async function preloadPlugins(pluginsToPreload: PreloadPlugin[] = []): Promise<void> {
+  await Promise.all(pluginsToPreload.map(preloadPlugin));
+}
+
+async function preloadPlugin(plugin: PreloadPlugin): Promise<void> {
+  const { path, version } = plugin;
+  try {
+    await importPluginModule(path, version);
+  } catch (error: unknown) {
+    console.error(`Failed to load plugin: ${path} (version: ${version})`, error);
+  }
+}

public/app/features/plugins/plugin_loader.ts

@@ -180,7 +180,7 @@ export async function importPluginModule(path: string, version?: string): Promis
     if (typeof builtIn === 'function') {
       return await builtIn();
     } else {
-      return Promise.resolve(builtIn);
+      return builtIn;
     }
   }
   return grafanaRuntime.SystemJS.import(path);