internal: create cloud studio session ID to group telemetry and errors

packages/app/src/runner/SpecRunnerOpenMode.vue

@@ -102,6 +102,7 @@
           <StudioPanel
             v-if="shouldShowStudioPanel"
             data-cy="studio-panel"
+            :cloud-studio-session-id="studioStore.cloudStudioSessionId"
             :can-access-studio-a-i="studioStore.canAccessStudioAI"
             :on-studio-panel-close="handleStudioPanelClose"
             :event-manager="eventManager"

packages/app/src/runner/event-manager.ts

@@ -283,27 +283,29 @@ export class EventManager {
       this.studioStore.setSuiteId(suiteId)
       this.studioStore.setShowUrlPrompt(showUrlPrompt)
 
-      this.ws.emit('studio:init', ({ canAccessStudioAI, error }) => {
+      this.ws.emit('studio:init', ({ canAccessStudioAI, cloudStudioSessionId, error }) => {
         if (error) {
           // eslint-disable-next-line no-console
           console.error(error)
         }
 
         this.studioStore.setCanAccessStudioAI(canAccessStudioAI)
+        this.studioStore.setCloudStudioSessionId(cloudStudioSessionId)
         studioInit()
       })
     }
 
     this.reporterBus.on('studio:init:test', (testId) => {
       this.studioStore.setTestId(testId)
 
-      this.ws.emit('studio:init', ({ canAccessStudioAI, error }) => {
+      this.ws.emit('studio:init', ({ canAccessStudioAI, cloudStudioSessionId, error }) => {
         if (error) {
           // eslint-disable-next-line no-console
           console.error(error)
         }
 
         this.studioStore.setCanAccessStudioAI(canAccessStudioAI)
+        this.studioStore.setCloudStudioSessionId(cloudStudioSessionId)
         studioInit()
       })
     })

packages/app/src/store/studio-store.ts

@@ -122,6 +122,7 @@ interface StudioRecorderState {
 
   canAccessStudioAI: boolean
   showUrlPrompt: boolean
+  cloudStudioSessionId?: string
 }
 
 export const useStudioStore = defineStore('studioRecorder', {
@@ -138,6 +139,7 @@ export const useStudioStore = defineStore('studioRecorder', {
       _currentId: 1,
       canAccessStudioAI: false,
       showUrlPrompt: true,
+      cloudStudioSessionId: undefined,
     }
   },
 
@@ -161,6 +163,10 @@ export const useStudioStore = defineStore('studioRecorder', {
       this.canAccessStudioAI = canAccessStudioAI
     },
 
+    setCloudStudioSessionId (cloudStudioSessionId: string) {
+      this.cloudStudioSessionId = cloudStudioSessionId
+    },
+
     clearRunnableIds () {
       this.testId = undefined
       this.suiteId = undefined

packages/app/src/studio/StudioPanel.vue

@@ -52,6 +52,7 @@ const props = defineProps<{
   onStudioPanelClose: () => void
   eventManager: EventManager
   studioStatus: string | null
+  cloudStudioSessionId?: string
 }>()
 
 interface StudioApp { default: StudioAppDefaultShape }
@@ -71,7 +72,11 @@ const maybeRenderReactComponent = () => {
     return
   }
 
-  const panel = window.UnifiedRunner.React.createElement(ReactStudioPanel.value, { canAccessStudioAI: props.canAccessStudioAI, onStudioPanelClose: props.onStudioPanelClose })
+  const panel = window.UnifiedRunner.React.createElement(ReactStudioPanel.value, {
+    canAccessStudioAI: props.canAccessStudioAI,
+    onStudioPanelClose: props.onStudioPanelClose,
+    studioSessionId: props.cloudStudioSessionId,
+  })
 
   if (!reactRoot.value) {
     reactRoot.value = window.UnifiedRunner.ReactDOM.createRoot(container.value)
@@ -81,6 +86,7 @@ const maybeRenderReactComponent = () => {
 }
 
 watch(() => props.canAccessStudioAI, maybeRenderReactComponent)
+watch(() => props.cloudStudioSessionId, maybeRenderReactComponent)
 
 const unmountReactComponent = () => {
   if (!ReactStudioPanel.value || !container.value) {

packages/app/src/studio/studio-app-types.ts

@@ -1,6 +1,7 @@
 export interface StudioPanelProps {
   canAccessStudioAI: boolean
   onStudioPanelClose?: () => void
+  studioSessionId?: string
   useRunnerStatus?: RunnerStatusShape
   useTestContentRetriever?: TestContentRetrieverShape
   useStudioAIStream?: StudioAIStreamShape

packages/server/lib/cloud/studio/studio.ts

@@ -84,6 +84,14 @@ export class StudioManager implements StudioManagerShape {
     await this.invokeAsync('initializeStudioAI', { isEssential: true }, options)
   }
 
+  updateSessionId (sessionId: string): void {
+    if (this._studioServer && typeof this._studioServer.updateSessionId === 'function') {
+      this.invokeSync('updateSessionId', { isEssential: false }, sessionId)
+    } else {
+      debug('updateSessionId method not available on studio server')
+    }
+  }
+
   async destroy (): Promise<void> {
     await this.invokeAsync('destroy', { isEssential: true })
   }

packages/server/lib/project-base.ts

@@ -405,6 +405,7 @@ export class ProjectBase extends EE {
 
       onStudioInit: async () => {
         const isStudioReady = this.ctx.coreData.studioLifecycleManager?.isStudioReady()
+        const cloudStudioSessionId = v4()
 
         if (!isStudioReady) {
           debug('User entered studio mode before cloud studio was initialized')
@@ -425,11 +426,16 @@ export class ProjectBase extends EE {
             studioMethodArgs: [],
           })
 
-          return { canAccessStudioAI: false }
+          return { canAccessStudioAI: false, cloudStudioSessionId }
         }
 
         const studio = await this.ctx.coreData.studioLifecycleManager?.getStudio()
 
+        // Update the studio session ID for telemetry
+        if (studio) {
+          studio.updateSessionId(cloudStudioSessionId)
+        }
+
         // only capture studio started event if the user is accessing legacy studio
         if (!this.ctx.coreData.studioLifecycleManager?.cloudStudioRequested) {
           try {
@@ -454,7 +460,7 @@ export class ProjectBase extends EE {
           const canAccessStudioAI = await studio?.canAccessStudioAI(this.browser) ?? false
 
           if (!canAccessStudioAI) {
-            return { canAccessStudioAI }
+            return { canAccessStudioAI, cloudStudioSessionId }
           }
 
           this.protocolManager = studio.protocolManager
@@ -469,19 +475,19 @@ export class ProjectBase extends EE {
           if (!studio.protocolManager.dbPath) {
             debug('Protocol database path is not set after initializing protocol manager')
 
-            return { canAccessStudioAI: false }
+            return { canAccessStudioAI: false, cloudStudioSessionId }
           }
 
           await studio.initializeStudioAI({
             protocolDbPath: studio.protocolManager.dbPath,
           })
 
-          return { canAccessStudioAI: true }
+          return { canAccessStudioAI: true, cloudStudioSessionId }
         }
 
         this.protocolManager = undefined
 
-        return { canAccessStudioAI: false }
+        return { canAccessStudioAI: false, cloudStudioSessionId }
       },
 
       onStudioDestroy: async () => {

packages/server/lib/socket-base.ts

@@ -413,9 +413,9 @@ export class SocketBase {
 
         socket.on('studio:init', async (cb) => {
           try {
-            const { canAccessStudioAI } = await options.onStudioInit()
+            const { canAccessStudioAI, cloudStudioSessionId } = await options.onStudioInit()
 
-            cb({ canAccessStudioAI })
+            cb({ canAccessStudioAI, cloudStudioSessionId })
           } catch (error) {
             cb({ error: errors.cloneErr(error) })
           }

packages/server/test/unit/socket_spec.js

@@ -542,12 +542,27 @@ describe('lib/socket', () => {
 
     context('on(studio:init)', () => {
       it('calls onStudioInit', async function () {
-        this.options.onStudioInit.resolves({ canAccessStudioAI: true })
+        this.options.onStudioInit.resolves({ canAccessStudioAI: true, cloudStudioSessionId: 'test-session-id' })
 
         await new Promise((resolve) => {
-          this.client.emit('studio:init', ({ canAccessStudioAI }) => {
+          this.client.emit('studio:init', ({ canAccessStudioAI, cloudStudioSessionId }) => {
             expect(this.options.onStudioInit).to.be.called
             expect(canAccessStudioAI).to.be.true
+            expect(cloudStudioSessionId).to.eq('test-session-id')
+
+            resolve()
+          })
+        })
+      })
+
+      it('calls onStudioInit and handles undefined cloudStudioSessionId', async function () {
+        this.options.onStudioInit.resolves({ canAccessStudioAI: false, cloudStudioSessionId: undefined })
+
+        await new Promise((resolve) => {
+          this.client.emit('studio:init', ({ canAccessStudioAI, cloudStudioSessionId }) => {
+            expect(this.options.onStudioInit).to.be.called
+            expect(canAccessStudioAI).to.be.false
+            expect(cloudStudioSessionId).to.be.undefined
 
             resolve()
           })

packages/types/src/studio/studio-server-types.ts

@@ -61,6 +61,7 @@ export interface StudioServerShape {
   canAccessStudioAI(browser: Cypress.Browser): Promise<boolean>
   addSocketListeners(socket: Socket): void
   initializeStudioAI(options: StudioAIInitializeOptions): Promise<void>
+  updateSessionId(sessionId: string): void
   reportError(
     error: unknown,
     studioMethod: string,