Sandbox: Improve logging of sandbox lifecycle for monitoring (#79297)

* Sandbox: Log a plugin loading inside the sandbox

* Improve tracking of general sandbox errors

* Fix import

public/app/features/plugins/sandbox/sandbox_plugin_loader.ts

@@ -2,7 +2,7 @@ import createVirtualEnvironment from '@locker/near-membrane-dom';
 import { ProxyTarget } from '@locker/near-membrane-shared';
 
 import { BootData, PluginMeta } from '@grafana/data';
-import { config, logInfo } from '@grafana/runtime';
+import { config } from '@grafana/runtime';
 import { defaultTrustedTypesPolicy } from 'app/core/trustedTypePolicies';
 
 import { getPluginSettings } from '../pluginSettings';
@@ -20,7 +20,7 @@ import {
 import { sandboxPluginDependencies } from './plugin_dependencies';
 import { sandboxPluginComponents } from './sandbox_components';
 import { CompartmentDependencyModule, PluginFactoryFunction, SandboxEnvironment } from './types';
-import { logError } from './utils';
+import { logError, logInfo } from './utils';
 
 // Loads near membrane custom formatter for near membrane proxy objects.
 if (process.env.NODE_ENV !== 'production') {
@@ -49,6 +49,9 @@ export async function importPluginModuleInSandbox({ pluginId }: { pluginId: stri
 }
 
 async function doImportPluginModuleInSandbox(meta: PluginMeta): Promise<System.Module> {
+  logInfo('Loading with sandbox', {
+    pluginId: meta.id,
+  });
   return new Promise(async (resolve, reject) => {
     const generalDistortionMap = getGeneralSandboxDistortionMap();
     let sandboxEnvironment: SandboxEnvironment;
@@ -161,7 +164,7 @@ async function doImportPluginModuleInSandbox(meta: PluginMeta): Promise<System.M
           }
 
           try {
-            const resolvedDeps = resolvePluginDependencies(dependencies);
+            const resolvedDeps = resolvePluginDependencies(dependencies, meta.id);
             // execute the plugin's code
             const pluginExportsRaw = factory.apply(null, resolvedDeps);
             // only after the plugin has been executed
@@ -188,7 +191,12 @@ async function doImportPluginModuleInSandbox(meta: PluginMeta): Promise<System.M
     try {
       pluginCode = await getPluginCode(meta);
     } catch (e) {
-      reject(new Error(`Could not load plugin code ${meta.id}: ` + e));
+      const error = new Error(`Could not load plugin code ${meta.id}: ` + e);
+      logError(error, {
+        pluginId: meta.id,
+        error: String(e),
+      });
+      reject(error);
     }
 
     try {
@@ -207,7 +215,7 @@ async function doImportPluginModuleInSandbox(meta: PluginMeta): Promise<System.M
   });
 }
 
-function resolvePluginDependencies(deps: string[]) {
+function resolvePluginDependencies(deps: string[], pluginId: string) {
   // resolve dependencies
   const resolvedDeps: CompartmentDependencyModule[] = [];
   for (const dep of deps) {
@@ -217,7 +225,13 @@ function resolvePluginDependencies(deps: string[]) {
     }
 
     if (!resolvedDep) {
-      throw new Error(`[sandbox] Could not resolve dependency ${dep}`);
+      const error = new Error(`[sandbox] Could not resolve dependency ${dep}`);
+      logError(error, {
+        pluginId,
+        dependency: dep,
+        error: String(error),
+      });
+      throw error;
     }
     resolvedDeps.push(resolvedDep);
   }

public/app/features/plugins/sandbox/utils.ts

@@ -3,7 +3,12 @@ import React from 'react';
 
 import { PluginSignatureType, PluginType } from '@grafana/data';
 import { LogContext } from '@grafana/faro-web-sdk';
-import { logWarning as logWarningRuntime, logError as logErrorRuntime, config } from '@grafana/runtime';
+import {
+  logWarning as logWarningRuntime,
+  logError as logErrorRuntime,
+  logInfo as logInfoRuntime,
+  config,
+} from '@grafana/runtime';
 
 import { getPluginSettings } from '../pluginSettings';
 
@@ -41,6 +46,15 @@ export function logError(error: Error, context?: LogContext) {
   logErrorRuntime(error, context);
 }
 
+export function logInfo(message: string, context?: LogContext) {
+  context = {
+    ...context,
+    source: 'sandbox',
+    monitorOnly: String(monitorOnly),
+  };
+  logInfoRuntime(message, context);
+}
+
 export async function isFrontendSandboxSupported({
   isAngular,
   pluginId,