✅ add Google pixel pro 6 tests on browserStack

DataDog · Feb 6, 2025 · 0e744fa · 0e744fa
1 parent 72d7d7f
commit 0e744fa
Show file tree

Hide file tree

Showing 4 changed files with 74 additions and 25 deletions.
diff --git a/test/e2e/browsers.conf.js b/test/e2e/browsers.conf.js
@@ -25,13 +25,12 @@ const browserConfigurations = [
     os: 'OS X',
     osVersion: 'Big Sur',
   },
-  // {
-  //   sessionName: 'Chrome mobile',
-  //   name: 'chrome',
-  //   os: 'android',
-  //   osVersion: '12.0',
-  //   device: 'Google Pixel 6 Pro',
-  // },
+  {
+    sessionName: 'Chrome mobile',
+    name: 'chrome',
+    osVersion: '12.0',
+    device: 'Google Pixel 6 Pro',
+  },
 ]
 
 module.exports = {

diff --git a/test/e2e/lib/framework/createTest.ts b/test/e2e/lib/framework/createTest.ts
@@ -1,8 +1,9 @@
 import type { LogsInitConfiguration } from '@datadog/browser-logs'
 import type { RumInitConfiguration } from '@datadog/browser-rum-core'
 import { DefaultPrivacyLevel } from '@datadog/browser-rum'
-import type { BrowserContext, Page, PlaywrightWorkerOptions } from '@playwright/test'
+import type { AndroidDevice, BrowserContext, Page, PlaywrightWorkerOptions } from '@playwright/test'
 import { test, expect } from '@playwright/test'
+import { connectToAndroidDevice } from '../helpers/playwright'
 import type { Tag } from '../helpers/tags'
 import { addTag, addBrowserConfigurationTags } from '../helpers/tags'
 import { getRunId } from '../../../envUtils'
@@ -190,17 +191,30 @@ function declareTestsForSetups(
 }
 
 function declareTest(title: string, setupOptions: SetupOptions, factory: SetupFactory, runner: TestRunner) {
-  test(title, async ({ page, context, browserName }) => {
+  test(title, async ({ page, context, browserName, playwright }) => {
+    const projectMetadata = test.info().project.metadata as BrowserConfiguration
+
     addTag('browserName' as any as Tag, browserName)
-    addBrowserConfigurationTags(test.info().project.metadata as BrowserConfiguration)
+    addBrowserConfigurationTags(projectMetadata)
 
     const title = test.info().titlePath.join(' > ')
     setupOptions.context.test_name = title
 
     const servers = await getTestServers()
     const browserLogs = new BrowserLogsManager()
 
-    const testContext = createTestContext(servers, page, context, browserLogs, browserName, setupOptions)
+    let _page = page
+    let _context = context
+    let _device: AndroidDevice | undefined
+
+    if (projectMetadata.device) {
+      const { page, context, device } = await connectToAndroidDevice(playwright._android, projectMetadata)
+      _page = page
+      _context = context
+      _device = device
+    }
+
+    const testContext = createTestContext(servers, _page, _context, browserLogs, browserName, setupOptions)
     servers.intake.bindServerApp(createIntakeServerApp(testContext.intakeRegistry))
 
     const setup = factory(setupOptions, servers)
@@ -213,7 +227,7 @@ function declareTest(title: string, setupOptions: SetupOptions, factory: SetupFa
       await runner(testContext)
       tearDownPassedTest(testContext)
     } finally {
-      await tearDownTest(testContext)
+      await tearDownTest(testContext, _device)
     }
   })
 }
@@ -279,10 +293,15 @@ function tearDownPassedTest({ intakeRegistry, withBrowserLogs }: TestContext) {
   })
 }
 
-async function tearDownTest({ flushEvents, deleteAllCookies }: TestContext) {
+async function tearDownTest({ flushEvents, deleteAllCookies, page }: TestContext, device?: AndroidDevice) {
   await flushEvents()
   await deleteAllCookies()
 
+  if (device) {
+    await page.close()
+    await device.close()
+  }
+
   const skipReason = test.info().annotations.find((annotation) => annotation.type === 'skip')?.description
   if (skipReason) {
     addTag('skip', skipReason)

diff --git a/test/e2e/lib/helpers/playwright.ts b/test/e2e/lib/helpers/playwright.ts
@@ -1,4 +1,4 @@
-import type { PlaywrightWorkerOptions } from '@playwright/test'
+import type { Android, PlaywrightWorkerOptions } from '@playwright/test'
 import type { BrowserConfiguration } from '../../../browsers.conf'
 import { getBuildInfos } from '../../../envUtils'
 
@@ -20,12 +20,11 @@ export function getEncodedCapabilities(configuration: BrowserConfiguration) {
 
 // see: https://www.browserstack.com/docs/automate/playwright/playwright-capabilities
 function getCapabilities(configuration: BrowserConfiguration) {
-  return {
+  const capabilities: Record<string, any> = {
     os: configuration.os,
     os_version: configuration.osVersion,
     browser: configuration.name,
     browser_version: configuration.version,
-    ...(configuration.device ? { deviceName: configuration.device } : {}),
     'browserstack.username': process.env.BS_USERNAME,
     'browserstack.accessKey': process.env.BS_ACCESS_KEY,
     project: 'browser sdk e2e',
@@ -39,4 +38,22 @@ function getCapabilities(configuration: BrowserConfiguration) {
     'browserstack.networkLogs': false,
     'browserstack.interactiveDebugging': false,
   }
+
+  if (configuration.device) {
+    capabilities.deviceName = configuration.device
+    capabilities.realMobile = true
+  }
+
+  return capabilities
+}
+
+export async function connectToAndroidDevice(android: Android, configuration: BrowserConfiguration) {
+  const device = await android.connect(
+    `wss://cdp.browserstack.com/playwright?caps=${getEncodedCapabilities(configuration)}`
+  )
+  await device.shell('am force-stop com.android.chrome')
+  const context = await device.launchBrowser()
+  const page = await context.newPage()
+
+  return { page, context, device }
 }
diff --git a/test/e2e/playwright.bs.config.ts b/test/e2e/playwright.bs.config.ts
@@ -1,3 +1,4 @@
+import type { Project } from '@playwright/test'
 import { defineConfig } from '@playwright/test'
 import { getBrowserName, getEncodedCapabilities } from './lib/helpers/playwright'
 import { config as baseConfig } from './playwright.base.config'
@@ -9,14 +10,27 @@ export default defineConfig({
   workers: 5, // BrowserStack has a limit of 5 parallel sessions
   testIgnore: ['**/developerExtension.scenario.ts', '**/s8sInject.scenario.ts'], // The following test won't run in the BrowserStack
   // maxFailures: process.env.CI ? 1 : 0,
-  projects: browserConfigurations.map((configuration) => ({
-    name: configuration.name,
-    metadata: configuration,
-    use: {
-      browserName: getBrowserName(configuration.name),
-      connectOptions: {
-        wsEndpoint: `wss://cdp.browserstack.com/playwright?caps=${getEncodedCapabilities(configuration)}`,
+  projects: browserConfigurations.map((configuration) => {
+    const project: Project = {
+      name: configuration.sessionName,
+      metadata: configuration,
+    }
+
+    if (configuration.device) {
+      return {
+        ...project,
+        timeout: 60_000,
+      }
+    }
+
+    return {
+      ...project,
+      use: {
+        browserName: getBrowserName(configuration.name),
+        connectOptions: {
+          wsEndpoint: `wss://cdp.browserstack.com/playwright?caps=${getEncodedCapabilities(configuration)}`,
+        },
       },
-    },
-  })),
+    }
+  }),
 })