🐛 [RUM-6411] RUM should not crash with puppeteer injection

packages/rum-core/src/domain/view/viewMetrics/trackScrollMetrics.ts

@@ -102,7 +102,9 @@ export function createScrollValuesObservable(
 
       const observerTarget = document.scrollingElement || document.documentElement
       const resizeObserver = new ResizeObserver(monitor(throttledNotify.throttled))
-      resizeObserver.observe(observerTarget)
+      if (observerTarget instanceof Element) {
+        resizeObserver.observe(observerTarget)
+      }
       const eventListener = addEventListener(configuration, window, DOM_EVENT.SCROLL, throttledNotify.throttled, {
         passive: true,
       })

test/e2e/lib/framework/createTest.ts

@@ -1,3 +1,4 @@
+import * as fs from 'fs'
 import type { LogsInitConfiguration } from '@datadog/browser-logs'
 import type { RumInitConfiguration } from '@datadog/browser-rum-core'
 import { DefaultPrivacyLevel } from '@datadog/browser-rum'
@@ -14,6 +15,7 @@ import type { SetupFactory, SetupOptions } from './pageSetups'
 import { DEFAULT_SETUPS, npmSetup } from './pageSetups'
 import { createIntakeServerApp } from './serverApps/intake'
 import { createMockServerApp } from './serverApps/mock'
+import { RUM_BUNDLE } from './sdkBuilds'
 
 const DEFAULT_RUM_CONFIGURATION = {
   applicationId: APPLICATION_ID,
@@ -228,3 +230,33 @@ async function tearDownTest({ intakeRegistry }: TestContext) {
   })
   await deleteAllCookies()
 }
+
+export async function injectRumWithPuppeteer() {
+  const ddRUM = fs.readFileSync(RUM_BUNDLE, 'utf8')
+  const puppeteerBrowser = await browser.getPuppeteer()
+  let injected = true
+
+  await browser.call(async () => {
+    const page = await puppeteerBrowser.newPage()
+    await page.evaluateOnNewDocument(
+      `
+        if (location.href !== 'about:blank') {
+          ${ddRUM}
+          window.DD_RUM._setDebug(true)
+          window.DD_RUM.init({
+            applicationId: ${APPLICATION_ID},
+            clientToken: ${CLIENT_TOKEN},
+          })
+          window.DD_RUM.startView()
+        }
+      `
+    )
+    page.on('console', (msg) => {
+      if (msg.type() === 'error') {
+        injected = false
+      }
+    })
+    await page.goto('https://webdriver.io')
+  })
+  return injected
+}

test/e2e/lib/framework/index.ts

@@ -1,4 +1,4 @@
-export { createTest } from './createTest'
+export { createTest, injectRumWithPuppeteer } from './createTest'
 export { bundleSetup, html } from './pageSetups'
 export { IntakeRegistry } from './intakeRegistry'
 export { getTestServers, waitForServersIdle } from './httpServers'

test/e2e/scenario/rum/s8sInject.scenario.ts

@@ -0,0 +1,8 @@
+import { injectRumWithPuppeteer } from '../../lib/framework'
+describe('Inject RUM with Puppeteer', () => {
+  // S8s tests inject RUM with puppeteer evaluateOnNewDocument
+  it('should not throw error in chrome', async () => {
+    const isInjected = await injectRumWithPuppeteer()
+    expect(isInjected).toBe(true)
+  })
+})

test/e2e/wdio.bs.conf.ts

@@ -7,7 +7,7 @@ export const config: Options.Testrunner = {
   ...baseConfig,
 
   specFileRetries: 1,
-
+  exclude: [...baseConfig.exclude!, './scenario/rum/s8sInject.scenario.ts'],
   capabilities: browserConfigurations.map((configuration) =>
     // See https://www.browserstack.com/automate/capabilities?tag=selenium-4
     // Make sure to look at the "W3C Protocol" tab