Override rum config

developer-extension/src/background/index.ts

@@ -1,3 +1,2 @@
-import './domain/devBundleInjection'
 import './domain/messageRelay'
 import './domain/syncRules'

developer-extension/src/common/constants.ts

@@ -25,3 +25,5 @@ export const enum PanelTabs {
 }
 
 export const DEFAULT_PANEL_TAB = PanelTabs.Events
+
+export const SESSION_STORAGE_SETTINGS_KEY = '__ddBrowserSdkSettings'

developer-extension/src/common/types.ts

@@ -16,7 +16,6 @@ export type DevtoolsToBackgroundMessage = {
 export interface NetRequestRulesOptions {
   tabId: number
   useDevBundles: boolean
-  injectDevBundles: boolean
   useRumSlim: boolean
   blockIntakeRequests: boolean
 }

developer-extension/src/content-scripts/main.ts

@@ -1,11 +1,128 @@
-// This script is executed in the "main" execution world, the same world as the webpage. Thus, it
-// can define a global callback variable to listen to SDK events.
-
-;(window as any).__ddBrowserSdkExtensionCallback = (message: unknown) => {
-  // Relays any message to the "isolated" content-script via a custom event.
-  window.dispatchEvent(
-    new CustomEvent('__ddBrowserSdkMessage', {
-      detail: message,
-    })
-  )
+import { EventListeners } from '../common/eventListeners'
+import { DEV_LOGS_URL, DEV_RUM_URL, SESSION_STORAGE_SETTINGS_KEY } from '../common/constants'
+
+declare global {
+  interface Window extends EventTarget {
+    DD_RUM?: SdkPublicApi
+    DD_LOGS?: SdkPublicApi
+    __ddBrowserSdkExtensionCallback?: (message: unknown) => void
+  }
+}
+
+type SdkPublicApi = { [key: string]: (...args: any[]) => unknown }
+
+function main() {
+  if (window.__ddBrowserSdkExtensionCallback) {
+    return
+  }
+
+  sendEventsToExtension()
+
+  const stringSettings = sessionStorage.getItem(SESSION_STORAGE_SETTINGS_KEY)
+  const settings = stringSettings && JSON.parse(stringSettings)
+
+  if (settings) {
+    const ddRumGlobal = instrumentGlobal('DD_RUM')
+    const ddLogsGlobal = instrumentGlobal('DD_LOGS')
+
+    if (settings.rumConfigurationOverride) {
+      overrideInitConfiguration(ddRumGlobal, settings.rumConfigurationOverride)
+    }
+
+    if (settings.logsConfigurationOverride) {
+      overrideInitConfiguration(ddLogsGlobal, settings.logsConfigurationOverride)
+    }
+
+    if (settings.injectDevBundles) {
+      injectDevBundle(DEV_RUM_URL, ddRumGlobal)
+      injectDevBundle(DEV_LOGS_URL, ddLogsGlobal)
+    }
+  }
+}
+
+main()
+
+function sendEventsToExtension() {
+  // This script is executed in the "main" execution world, the same world as the webpage. Thus, it
+  // can define a global callback variable to listen to SDK events.
+  window.__ddBrowserSdkExtensionCallback = (message: unknown) => {
+    // Relays any message to the "isolated" content-script via a custom event.
+    window.dispatchEvent(
+      new CustomEvent('__ddBrowserSdkMessage', {
+        detail: message,
+      })
+    )
+  }
+}
+
+function injectDevBundle(url: string, global: GlobalInstrumentation) {
+  loadSdkScriptFromURL(url)
+  const devInstance = global.get()
+
+  if (devInstance) {
+    global.onSet((sdkInstance) => proxySdk(sdkInstance, devInstance))
+    global.returnValue(devInstance)
+  }
+}
+
+function overrideInitConfiguration(global: GlobalInstrumentation, configurationOverride: object) {
+  global.onSet((sdkInstance) => {
+    const originalInit = sdkInstance.init
+    sdkInstance.init = (config: any) => {
+      originalInit({ ...config, ...configurationOverride })
+    }
+  })
+}
+
+function loadSdkScriptFromURL(url: string) {
+  const xhr = new XMLHttpRequest()
+  try {
+    xhr.open('GET', url, false) // `false` makes the request synchronous
+    xhr.send()
+  } catch (error) {
+    // eslint-disable-next-line no-console
+    console.error(`[DD Browser SDK extension] Error while loading ${url}:`, error)
+    return
+  }
+  if (xhr.status === 200) {
+    const script = document.createElement('script')
+    script.type = 'text/javascript'
+    script.text = xhr.responseText
+
+    document.documentElement.prepend(script)
+  }
+}
+
+type GlobalInstrumentation = ReturnType<typeof instrumentGlobal>
+function instrumentGlobal(global: 'DD_RUM' | 'DD_LOGS') {
+  const eventListeners: EventListeners<SdkPublicApi> = new EventListeners<SdkPublicApi>()
+  let returnedInstance: SdkPublicApi | undefined
+  let lastInstance: SdkPublicApi | undefined
+  Object.defineProperty(window, global, {
+    set(sdkInstance: SdkPublicApi) {
+      eventListeners.notify(sdkInstance)
+      lastInstance = sdkInstance
+    },
+    get(): SdkPublicApi | undefined {
+      return returnedInstance ?? lastInstance
+    },
+  })
+
+  return {
+    get: () => window[global],
+    onSet: (callback: (sdkInstance: SdkPublicApi) => void) => {
+      eventListeners.subscribe(callback)
+    },
+    returnValue: (sdkInstance: SdkPublicApi) => {
+      returnedInstance = sdkInstance
+    },
+  }
+}
+
+function proxySdk(target: SdkPublicApi, root: SdkPublicApi) {
+  for (const key in root) {
+    if (Object.prototype.hasOwnProperty.call(root, key)) {
+      target[key] = root[key]
+    }
+  }
 }

developer-extension/src/panel/components/panel.tsx

@@ -38,7 +38,16 @@ export function Panel() {
     >
       <Tabs.List className="dd-privacy-allow">
         <Tabs.Tab value={PanelTabs.Events}>Events</Tabs.Tab>
-        <Tabs.Tab value={PanelTabs.Infos}>
+        <Tabs.Tab
+          value={PanelTabs.Infos}
+          rightSection={
+            isOverridingInitConfiguration(settings) && (
+              <Text c="orange" fw="bold" title="Overriding init configuration">
+                ⚠
+              </Text>
+            )
+          }
+        >
           <Text>Infos</Text>
         </Tabs.Tab>
         <Tabs.Tab value={PanelTabs.Replay}>
@@ -84,3 +93,7 @@ export function Panel() {
 function isInterceptingNetworkRequests(settings: Settings) {
   return settings.blockIntakeRequests || settings.useDevBundles || settings.injectDevBundles || settings.useRumSlim
 }
+
+function isOverridingInitConfiguration(settings: Settings) {
+  return settings.rumConfigurationOverride || settings.logsConfigurationOverride
+}