Use test RUM proxy config

Author: BeltranBulbarellaDD

.env.example

@@ -1,3 +1,9 @@
 # BROWSERSTACK CREDENTIALS
 BS_USERNAME=xxx
 BS_ACCESS_KEY=xxx
+
+# Salesforce credentials
+SF_LWC_CLIENT_ID=xxx
+SF_LWC_USERNAME=xxx
+SF_LWC_INSTANCE_URL=xxx
+SF_LWC_JWT_PRIVATE_KEY_B64=xxx

scripts/lib/secrets.ts

@@ -101,8 +101,7 @@ export function getSfLwcInstanceUrl(): string {
 }
 
 export function getSfLwcJwtPrivateKey(): string {
-  const key = process.env.SF_LWC_JWT_PRIVATE_KEY_B64 ?? getSecretKey('ci.browser-sdk.sf_lwc_jwt_private_key_b64')
-  return Buffer.from(key, 'base64').toString('utf8')
+  return process.env.SF_LWC_JWT_PRIVATE_KEY_B64 ?? getSecretKey('ci.browser-sdk.sf_lwc_jwt_private_key_b64')
 }
 
 function getSecretKey(name: string): string {

scripts/salesforce-lwc-app.ts

@@ -39,7 +39,7 @@ function authenticate() {
   const keyPath = resolve(keyDirectory, 'server.key')
 
   try {
-    writeFileSync(keyPath, getSfLwcJwtPrivateKey(), { mode: 0o600 })
+    writeFileSync(keyPath, Buffer.from(getSfLwcJwtPrivateKey(), 'base64').toString('utf8'), { mode: 0o600 })
     chmodSync(keyPath, 0o600)
 
     printLog(`Authenticating Salesforce CLI alias ${defaultTargetOrg}...`)
@@ -126,6 +126,7 @@ function assignPermissionSet(targetOrg: string, permSetName: string) {
 
 function buildOpenUrl(): string {
   const targetOrg = getTargetOrg()
+  const proxy = process.env.DD_SALESFORCE_E2E_PROXY
   const path = new URL(salesforceHomePath, 'https://salesforce.local')
 
   path.searchParams.set(
@@ -144,6 +145,7 @@ function buildOpenUrl(): string {
       telemetryConfigurationSampleRate: 100,
       service: 'browser-sdk-salesforce-e2e',
       env: 'e2e',
+      ...(proxy ? { proxy } : {}),
     })
   )
 

test/e2e/lib/framework/createTest.ts

@@ -29,7 +29,6 @@ import type { Servers } from './httpServers'
 import { getTestServers, waitForServersIdle } from './httpServers'
 import type { CallerLocation, EventBridgeOptions, SetupFactory, SetupOptions, UrlHook } from './pageSetups'
 import { html, DEFAULT_SETUPS, npmSetup, appSetup, formatConfiguration } from './pageSetups'
-import { computeIntakeRequestInfos, readIntakeRequest } from './intakeProxyMiddleware'
 import { createDatadogHttpApi } from './serverApps/datadogHttpApi'
 import type { DatadogHttpApiControl } from './serverApps/datadogHttpApi'
 import { createMockServerApp } from './serverApps/mock'
@@ -275,8 +274,8 @@ class TestBuilder {
   withSalesforceApp() {
     this.salesforceApp = true
     this.setups = [{ factory: () => '' }]
-    this.baseUrlHooks.push((baseUrl) => {
-      baseUrl.href = buildSalesforceLwcUrl()
+    this.baseUrlHooks.push((baseUrl, servers) => {
+      baseUrl.href = buildSalesforceLwcUrl(servers.datadogHttpApi.origin)
     })
     return this
   }
@@ -464,14 +463,6 @@ function declareTest(title: string, setupOptions: SetupOptions, factory: SetupFa
           contentType: 'application/javascript',
         })
       })
-      // Because of CSP, we need to intercept the intake request and push it to the intake registry
-      await page.route('*/**/api/v2/rum**', async (route) => {
-        const request = route.request()
-        const infos = computeIntakeRequestInfos(request)
-        const intakeRequest = await readIntakeRequest(request, infos)
-        intakeRegistry.push(intakeRequest)
-        await route.fulfill({ status: 202 })
-      })
     }
 
     await setUpTest(browserLogs, setupOptions, testContext)

test/e2e/lib/framework/index.ts

@@ -22,8 +22,6 @@ export type { DatadogHttpApiControl } from './serverApps/datadogHttpApi'
 export type { DebuggerHttpApiControl, DebuggerProbeResponse } from './serverApps/debuggerHttpApi'
 export { flushEvents } from './flushEvents'
 export { waitForRequests } from './waitForRequests'
-export { computeIntakeRequestInfos, readIntakeRequest } from './intakeProxyMiddleware'
-export type { IncomingRequest } from './intakeProxyMiddleware'
 export { LARGE_RESPONSE_MIN_BYTE_SIZE } from './serverApps/mock'
 export { getSdkBundlePath, getTestAppBundlePath } from './sdkBuilds'
 export type { BrowserLog } from '../helpers/browser'

test/e2e/lib/framework/intakeProxyMiddleware.ts

@@ -1,20 +1,13 @@
 import { createInflate, inflateSync } from 'node:zlib'
 import https from 'node:https'
 import type express from 'express'
-import type { Request as PlaywrightRequest } from '@playwright/test'
 import createBusboy from 'busboy'
 import type { BrowserProfileEvent, BrowserProfilerTrace } from '@datadog/browser-rum/src/types/profiling'
 import type { BrowserSegment, BrowserSegmentMetadata } from '@datadog/browser-rum/src/types/sessionReplay'
 import type { LogsEvent } from '@datadog/browser-logs/src/logsEvent.types'
 import type { RumEvent } from '@datadog/browser-rum-core/src/rumEvent.types'
 import type { TelemetryEvent } from '@datadog/browser-core/src/domain/telemetry/telemetryEvent.types'
 
-export type IncomingRequest = express.Request | PlaywrightRequest
-
-function isPlaywrightRequest(req: IncomingRequest): req is PlaywrightRequest {
-  return typeof (req as { url: unknown }).url === 'function'
-}
-
 interface BaseIntakeRequest {
   isBridge: boolean
   encoding: string | null
@@ -100,24 +93,19 @@ export function createIntakeProxyMiddleware(options: IntakeProxyOptions): expres
   }
 }
 
-export function computeIntakeRequestInfos(req: IncomingRequest): IntakeRequestInfos {
-  let intakeUrl: URL
-  if (isPlaywrightRequest(req)) {
-    intakeUrl = new URL(req.url(), 'https://example.org')
-  } else if (typeof req.query.ddforward === 'string') {
-    intakeUrl = new URL(req.query.ddforward, 'https://example.org')
-  } else {
-    intakeUrl = new URL(req.url, 'https://example.org')
+function computeIntakeRequestInfos(req: express.Request): IntakeRequestInfos {
+  const ddforward = req.query.ddforward as string | undefined
+  if (!ddforward) {
+    throw new Error('ddforward is missing')
   }
+  const { pathname, searchParams } = new URL(ddforward, 'https://example.org')
 
-  const { pathname, searchParams } = intakeUrl
-  const headers = isPlaywrightRequest(req) ? req.headers() : req.headers
-  const encoding = headers['content-encoding'] || searchParams.get('dd-evp-encoding')
+  const encoding = req.headers['content-encoding'] || searchParams.get('dd-evp-encoding')
   const transport = searchParams.get('_dd.api')
   const batchTimeRaw = searchParams.get('batch_time')
   const batchTime = batchTimeRaw ? Number(batchTimeRaw) : null
 
-  if (!isPlaywrightRequest(req) && req.query.bridge === 'true') {
+  if (req.query.bridge === 'true') {
     const eventType = req.query.event_type
     return {
       isBridge: true,
@@ -152,21 +140,21 @@ export function computeIntakeRequestInfos(req: IncomingRequest): IntakeRequestIn
   }
 }
 
-export function readIntakeRequest(req: IncomingRequest, infos: IntakeRequestInfos): Promise<IntakeRequest> {
+function readIntakeRequest(req: express.Request, infos: IntakeRequestInfos): Promise<IntakeRequest> {
   if (infos.intakeType === 'replay') {
-    return readReplayIntakeRequest(req as express.Request, infos as IntakeRequestInfos & { intakeType: 'replay' })
+    return readReplayIntakeRequest(req, infos as IntakeRequestInfos & { intakeType: 'replay' })
   }
   if (infos.intakeType === 'profile') {
-    return readProfileIntakeRequest(req as express.Request, infos as IntakeRequestInfos & { intakeType: 'profile' })
+    return readProfileIntakeRequest(req, infos as IntakeRequestInfos & { intakeType: 'profile' })
   }
   return readEventIntakeRequest(req, infos as IntakeRequestInfos & { intakeType: 'rum' | 'logs' | 'debugger' })
 }
 
 async function readEventIntakeRequest(
-  req: IncomingRequest,
+  req: express.Request,
   infos: IntakeRequestInfos & { intakeType: 'rum' | 'logs' | 'debugger' }
 ): Promise<RumIntakeRequest | LogsIntakeRequest | DebuggerIntakeRequest> {
-  const rawBody = isPlaywrightRequest(req) ? req.postDataBuffer()! : await readStream(req)
+  const rawBody = await readStream(req)
   const encodedBody = infos.encoding === 'deflate' ? inflateSync(rawBody) : rawBody
 
   return {

test/e2e/lib/helpers/salesforceApp.ts

@@ -18,10 +18,11 @@ export function getSalesforceConfig(): { targetOrg: string; isConfigured: boolea
   return { targetOrg, isConfigured }
 }
 
-export function buildSalesforceLwcUrl(): string {
+export function buildSalesforceLwcUrl(proxy: string): string {
   const result = spawnSync('node', ['scripts/salesforce-lwc-app.ts', 'open-url'], {
     encoding: 'utf8',
     cwd: repositoryRoot,
+    env: { ...process.env, DD_SALESFORCE_E2E_PROXY: proxy },
   })
 
   if (result.status !== 0) {

test/e2e/scenario/salesforce/salesforceLwc.scenario.ts

@@ -2,6 +2,13 @@ import { expect, test } from '@playwright/test'
 import { createTest } from '../../lib/framework'
 import { getSalesforceConfig } from '../../lib/helpers/salesforceApp'
 
+test.use({
+  bypassCSP: true,
+  launchOptions: {
+    args: ['--disable-web-security'],
+  },
+})
+
 const { targetOrg, isConfigured } = getSalesforceConfig()
 test.skip(
   !isConfigured,
@@ -10,7 +17,7 @@ test.skip(
 
 createTest('salesforce')
   .withSalesforceApp()
-  .run(async ({ page, intakeRegistry, flushEvents }) => {
+  .run(async ({ page, intakeRegistry, flushEvents, withBrowserLogs }) => {
     await expect(page.getByTestId('home-custom-actions')).toBeVisible()
 
     await page.getByTestId('custom-action-1').click()
@@ -21,7 +28,7 @@ createTest('salesforce')
 
     // Verify that the initial view event is present.
     expect(intakeRegistry.rumViewEvents.length).toBeGreaterThanOrEqual(1)
-    const homeView = intakeRegistry.rumViewEvents.find((e) => e.view.name?.includes('/lightning/page/home') === true)
+    const homeView = intakeRegistry.rumViewEvents.find((e) => e.view.name?.includes('/page/home') === true)
     expect(homeView).toBeDefined()
     expect(homeView?.view.loading_type).toBe('initial_load')
 
@@ -38,4 +45,9 @@ createTest('salesforce')
     )
     expect(productExplorerView).toBeDefined()
     expect(productExplorerView?.view.loading_type).toBe('route_change')
+
+    // Salesforce's own app generates console errors we cannot control because of Dev Mode configuration in the application
+    // Clear them so the generic teardown check doesn't fail on noise unrelated to the SDK.
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
+    withBrowserLogs(() => {})
   })