⚗️ [RUM-17561] prototype process events for main and renderer processes

e2e/app/src/main.ts

@@ -66,6 +66,7 @@ import {
 
 const isDebugMode = process.env.PWDEBUG === '1';
 let mainWindow: BrowserWindow | null = null;
+let testRendererWindow: BrowserWindow | null = null;
 let rendererHttpServer: http.Server | null = null;
 
 const noop = () => undefined;
@@ -247,6 +248,27 @@ void app.whenReady().then(async () => {
 
   ipcMain.handle('ping', () => 'pong');
 
+  ipcMain.handle('openRendererProcess', () => {
+    testRendererWindow = new BrowserWindow({
+      width: 400,
+      height: 300,
+      show: isDebugMode,
+      webPreferences: {
+        contextIsolation: true,
+        nodeIntegration: false,
+      },
+    });
+    void testRendererWindow.loadURL('about:blank');
+    testRendererWindow.on('closed', () => {
+      testRendererWindow = null;
+    });
+  });
+
+  ipcMain.handle('closeRendererProcess', () => {
+    testRendererWindow?.close();
+    testRendererWindow = null;
+  });
+
   ipcMain.on('mainFireAndForget', (event) => {
     event.sender.send('mainFireAndForgetAck');
   });

e2e/app/src/preload.ts

@@ -50,4 +50,6 @@ contextBridge.exposeInMainWorld('electronAPI', {
   openBridgeFileWindowNoIsolation: () => ipcRenderer.invoke('openBridgeFileWindowNoIsolation'),
   openBridgeHttpWindow: () => ipcRenderer.invoke('openBridgeHttpWindow'),
   openBridgeAppProtocolWindow: () => ipcRenderer.invoke('openBridgeAppProtocolWindow'),
+  openRendererProcess: () => ipcRenderer.invoke('openRendererProcess'),
+  closeRendererProcess: () => ipcRenderer.invoke('closeRendererProcess'),
 });

e2e/lib/mainPage.ts

@@ -39,6 +39,8 @@ interface ElectronAppWindow {
     openBridgeFileWindowNoIsolation: () => Promise<void>;
     openBridgeHttpWindow: () => Promise<void>;
     openBridgeAppProtocolWindow: () => Promise<void>;
+    openRendererProcess: () => Promise<void>;
+    closeRendererProcess: () => Promise<void>;
   };
 }
 
@@ -242,4 +244,14 @@ export class MainPage {
     );
     return await BridgeWindowPage.waitForReady(electronApp);
   }
+
+  async openRendererProcess(): Promise<void> {
+    await this.page.evaluate(() => (globalThis as unknown as ElectronAppWindow).electronAPI.openRendererProcess());
+    await this.waitForIpcPropagation();
+  }
+
+  async closeRendererProcess(): Promise<void> {
+    await this.page.evaluate(() => (globalThis as unknown as ElectronAppWindow).electronAPI.closeRendererProcess());
+    await this.waitForIpcPropagation();
+  }
 }

e2e/scenarios/execution-context.scenario.ts

@@ -0,0 +1,71 @@
+import { test, expect } from '../lib/helpers';
+
+interface ExecutionContextEvent {
+  type: 'execution_context';
+  execution_context: {
+    id: string;
+    type: 'main-process' | 'renderer-process';
+    instance_id: string;
+    name?: string;
+    duration?: number;
+    exit_reason?: string;
+  };
+  _dd: { document_version: number };
+}
+
+test('emits a main execution context start event on SDK init', async ({ mainPage, intake }) => {
+  await mainPage.flushTransport();
+  const events = await intake.getEventsByType('execution_context');
+
+  expect(events.length).toBeGreaterThanOrEqual(1);
+  const mainEvent = events.find((e) => (e.body as ExecutionContextEvent).execution_context.type === 'main-process');
+  expect(mainEvent).toBeDefined();
+
+  const body = mainEvent!.body as ExecutionContextEvent;
+  expect(body.execution_context.type).toBe('main-process');
+  expect(body.execution_context.instance_id).toMatch(/^\d+$/);
+  expect(body._dd.document_version).toBe(1);
+  expect(body.execution_context.duration).toBeUndefined();
+  expect(body.execution_context.id).toMatch(/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/);
+});
+
+test('all main-process events carry execution_context.id and execution_context.type', async ({ mainPage, intake }) => {
+  await mainPage.flushTransport();
+  const viewEvents = await intake.getEventsByType('view');
+  expect(viewEvents.length).toBeGreaterThanOrEqual(1);
+
+  const view = viewEvents[0].body as Record<string, unknown>;
+  const executionContext = view['execution_context'] as { id: string; type: string } | undefined;
+  expect(executionContext).toBeDefined();
+  expect(executionContext!.id).toMatch(/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/);
+  expect(executionContext!.type).toBe('main-process');
+});
+
+test('emits start and end execution_context events for a renderer window lifecycle', async ({ mainPage, intake }) => {
+  await mainPage.flushTransport();
+  const before = (await intake.getEventsByType('execution_context')).length;
+
+  await mainPage.openRendererProcess();
+  await mainPage.flushTransport();
+
+  const afterOpen = await intake.getEventsByType('execution_context');
+  const rendererStart = afterOpen
+    .slice(before)
+    .find((e) => (e.body as ExecutionContextEvent).execution_context.type === 'renderer-process');
+  expect(rendererStart).toBeDefined();
+
+  const body = rendererStart!.body as ExecutionContextEvent;
+  expect(body._dd.document_version).toBe(1);
+  expect(body.execution_context.duration).toBeUndefined();
+  const rendererId = body.execution_context.id;
+
+  await mainPage.closeRendererProcess();
+  await mainPage.flushTransport();
+
+  const afterClose = await intake.getEventsByType('execution_context');
+  const rendererEnd = afterClose
+    .slice(afterOpen.length)
+    .find((e) => (e.body as ExecutionContextEvent).execution_context.id === rendererId);
+  expect(rendererEnd).toBeDefined();
+  expect((rendererEnd!.body as ExecutionContextEvent)._dd.document_version).toBeGreaterThan(1);
+});

e2e/scenarios/view.scenario.ts

@@ -1,8 +1,7 @@
 import { test, expect } from '../lib/helpers';
 import type { RumViewEvent } from '@datadog/electron-sdk';
 
-const isMainProcessView = (event: { body: unknown }) =>
-  (event.body as RumViewEvent).view.url === 'electron://main-process';
+const isMainProcessView = (event: { body: unknown }) => (event.body as RumViewEvent).view.url === 'electron://fake';
 
 test('emits an initial active view event on SDK init', async ({ mainPage, intake }) => {
   await mainPage.flushTransport();
@@ -30,12 +29,10 @@ test('emits an initial active view event on SDK init', async ({ mainPage, intake
   expect(headers['dd-evp-origin']).toBe('electron');
   expect(headers['dd-evp-origin-version']).toMatch(/^\d+\.\d+\.\d+$/);
   expect(headers['dd-request-id']).toMatch(/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/);
-  expect(view.view.name).toBe('main process');
-  expect(view.view.url).toBe('electron://main-process');
+  expect(view.view.url).toBe('electron://fake');
+  expect((view.view as unknown as { is_fake?: boolean }).is_fake).toBe(true);
+  expect((view.view as unknown as { name?: string }).name).toBeUndefined();
   expect(view.view.is_active).toBe(true);
-  expect(view.view.action.count).toBe(0);
-  expect(view.view.error.count).toBe(0);
-  expect(view.view.resource.count).toBe(0);
   expect(view._dd.document_version).toBe(1);
   expect(view.view.id).toBeDefined();
   expect(view.view.time_spent).toBeGreaterThanOrEqual(0);
@@ -73,15 +70,3 @@ test.describe('session renewal via user activity', () => {
     expect(newView._dd.document_version).toBe(1);
   });
 });
-
-test('increments view error count after an uncaught exception', async ({ mainPage, intake }) => {
-  await mainPage.generateUncaughtException();
-  await mainPage.flushTransport();
-
-  await intake.getEventsByType('error');
-  const viewEvents = await intake.waitForEventCount('view', 2);
-  const updatedView = viewEvents[1].body as RumViewEvent;
-
-  expect(updatedView.view.error.count).toBe(1);
-  expect(updatedView._dd.document_version).toBeGreaterThan(1);
-});

playground/package.json

@@ -6,9 +6,10 @@
   "description": "Playground for testing @datadog/electron-sdk",
   "main": "./dist/main.js",
   "scripts": {
-    "build": "tsc && yarn build:renderer && cp src/index.html dist/index.html",
+    "build": "tsc && yarn build:renderer && yarn build:secondary-renderer && cp src/index.html dist/index.html && cp src/secondary.html dist/secondary.html",
     "build:renderer": "esbuild src/renderer.ts --bundle --format=esm --outfile=dist/renderer.js --sourcemap",
-    "build:watch": "concurrently \"tsc --watch\" \"yarn build:renderer --watch\"",
+    "build:secondary-renderer": "esbuild src/secondary-renderer.ts --bundle --format=esm --outfile=dist/secondary-renderer.js --sourcemap",
+    "build:watch": "concurrently \"tsc --watch\" \"yarn build:renderer --watch\" \"yarn build:secondary-renderer --watch\"",
     "start": "yarn build && electron .",
     "dev": "yarn build && concurrently \"yarn build:watch\" \"electron .\"",
     "test": "yarn build && playwright test -c test/playwright.config.ts"

playground/src/index.html

@@ -227,6 +227,11 @@ <h2>Session ID:</h2>
         <button id="op-parallel-uploads">Run 5 parallel uploads</button>
       </div>
 
+      <div class="section-label">Process Lifecycle</div>
+      <div class="button-group">
+        <button id="open-secondary-window">Open Secondary Window</button>
+      </div>
+
       <div class="session-section">
         <h2>IPC Activity Log:</h2>
         <div id="ipc-log"></div>

playground/src/main.ts

@@ -35,6 +35,7 @@ import { buildRumExplorerUrl } from './main/utils';
 const isTestMode = process.env.DD_TEST_MODE === '1';
 
 let mainWindow: BrowserWindow | null = null;
+let secondaryWindow: BrowserWindow | null = null;
 
 // Serving the renderer over a custom scheme (instead of file://) lets us attach the `Document-Policy: js-profiling`
 // response header, which is required to enable the JS Self-Profiling API. The scheme must be registered as
@@ -232,6 +233,23 @@ ipcMain.handle('open-rum-explorer', () => {
   void shell.openExternal(buildRumExplorerUrl(CONF[ACTIVE_ENV], ctx.session_id));
 });
 
+ipcMain.handle('main:open-secondary-window', () => {
+  if (secondaryWindow) return;
+  secondaryWindow = new BrowserWindow({
+    width: 500,
+    height: 400,
+    title: 'Secondary Renderer Process',
+    webPreferences: {
+      contextIsolation: true,
+      nodeIntegration: false,
+    },
+  });
+  void secondaryWindow.loadURL('app://app/secondary.html');
+  secondaryWindow.on('closed', () => {
+    secondaryWindow = null;
+  });
+});
+
 void app.whenReady().then(async () => {
   // Initialize SDK on app ready (before window creation)
   console.log('Initializing SDK from main process...');

playground/src/preload.ts

@@ -37,6 +37,7 @@ contextBridge.exposeInMainWorld('electronAPI', {
   mainFetchApiNet: () => ipcRenderer.invoke('main:fetch-api-net'),
   openRumExplorer: () => ipcRenderer.invoke('open-rum-explorer'),
   flushTransport: () => ipcRenderer.invoke('flush-transport'),
+  openSecondaryWindow: () => ipcRenderer.invoke('main:open-secondary-window'),
   setUserInfo: () => ipcRenderer.invoke('main:set-user-info'),
   addUserExtraInfo: () => ipcRenderer.invoke('main:add-user-extra-info'),
   clearUserInfo: () => ipcRenderer.invoke('main:clear-user-info'),

playground/src/renderer.ts

@@ -50,6 +50,7 @@ interface ElectronAPI {
   mainFetchApiNet: () => Promise<unknown>;
   openRumExplorer: () => Promise<void>;
   flushTransport: () => Promise<void>;
+  openSecondaryWindow: () => Promise<void>;
   setUserInfo: () => Promise<void>;
   addUserExtraInfo: () => Promise<void>;
   clearUserInfo: () => Promise<void>;
@@ -348,3 +349,5 @@ if (parallelBtn) {
       });
   });
 }
+
+setupDemoButton('open-secondary-window', 'main:open-secondary-window', () => window.electronAPI.openSecondaryWindow());

playground/src/secondary-renderer.ts

@@ -0,0 +1,38 @@
+import { datadogRum } from '@datadog/browser-rum';
+
+datadogRum.init({
+  applicationId: '6efd3722-af0a-4070-994c-0e87076d4814',
+  clientToken: 'pub2a7307cdec74934cacb411a193f632f8',
+  site: 'datad0g.com',
+  service: 'electron-playground',
+  env: 'dev',
+  sessionSampleRate: 100,
+  trackResources: true,
+  trackLongTasks: true,
+  trackUserInteractions: true,
+});
+
+const status = document.getElementById('status') as HTMLElement;
+
+function setStatus(msg: string) {
+  status.textContent = msg;
+}
+
+const fetchBtn = document.getElementById('fetch-btn') as HTMLButtonElement;
+fetchBtn.addEventListener('click', () => {
+  fetchBtn.disabled = true;
+  setStatus('Fetching…');
+  fetch('https://httpbin.org/json')
+    .then((res) => res.json())
+    .then(() => setStatus('Fetch done'))
+    .catch((err) => setStatus(`Fetch error: ${String(err)}`))
+    .finally(() => {
+      fetchBtn.disabled = false;
+    });
+});
+
+const errorBtn = document.getElementById('error-btn') as HTMLButtonElement;
+errorBtn.addEventListener('click', () => {
+  setStatus('Error thrown');
+  throw new Error('test error from secondary renderer');
+});