feat: add dummy dom events for cypress events to aid in time synchronization (#27094)

packages/app/src/runner/events/capture-protocol.ts

@@ -13,6 +13,13 @@ const attachCypressProtocolInfo = (info) => {
 }
 
 export const addCaptureProtocolListeners = (Cypress: Cypress.Cypress) => {
+  Cypress.on('cy:protocol-snapshot', () => {
+    attachCypressProtocolInfo({
+      type: 'cy:protocol-snapshot',
+      timestamp: performance.now() + performance.timeOrigin,
+    })
+  })
+
   Cypress.on('log:added', (_, log) => {
     // TODO: UNIFY-1318 - Race condition in unified runner - we should not need this null check
     if (!Cypress.runner) {
@@ -21,6 +28,11 @@ export const addCaptureProtocolListeners = (Cypress: Cypress.Cypress) => {
 
     const protocolProps = Cypress.runner.getProtocolPropsForLog(log.attributes)
 
+    attachCypressProtocolInfo({
+      type: 'log:added',
+      timestamp: performance.now() + performance.timeOrigin,
+    })
+
     Cypress.backend('protocol:command:log:added', protocolProps)
   })
 
@@ -32,12 +44,22 @@ export const addCaptureProtocolListeners = (Cypress: Cypress.Cypress) => {
 
     const protocolProps = Cypress.runner.getProtocolPropsForLog(log.attributes)
 
+    attachCypressProtocolInfo({
+      type: 'log:changed',
+      timestamp: performance.now() + performance.timeOrigin,
+    })
+
     Cypress.backend('protocol:command:log:changed', protocolProps)
   })
 
   const viewportChangedHandler = (viewport) => {
     const timestamp = performance.timeOrigin + performance.now()
 
+    attachCypressProtocolInfo({
+      type: 'viewport:changed',
+      timestamp,
+    })
+
     Cypress.backend('protocol:viewport:changed', {
       viewport: {
         width: viewport.viewportWidth,
@@ -52,18 +74,33 @@ export const addCaptureProtocolListeners = (Cypress: Cypress.Cypress) => {
   Cypress.primaryOriginCommunicator.on('viewport:changed', viewportChangedHandler)
 
   Cypress.on('test:before:run:async', async (attributes) => {
+    attachCypressProtocolInfo({
+      type: 'test:before:run:async',
+      timestamp: performance.now() + performance.timeOrigin,
+    })
+
     await Cypress.backend('protocol:test:before:run:async', attributes)
   })
 
   Cypress.on('url:changed', (url) => {
     const timestamp = performance.timeOrigin + performance.now()
 
+    attachCypressProtocolInfo({
+      type: 'url:changed',
+      timestamp,
+    })
+
     Cypress.backend('protocol:url:changed', { url, timestamp })
   })
 
   Cypress.on('page:loading', (loading) => {
     const timestamp = performance.timeOrigin + performance.now()
 
+    attachCypressProtocolInfo({
+      type: 'page:loading',
+      timestamp,
+    })
+
     Cypress.backend('protocol:page:loading', { loading, timestamp })
   })
 

packages/driver/src/cy/snapshots.ts

@@ -265,6 +265,8 @@ export const create = ($$: $Cy['$$'], state: StateFunc) => {
         })
       }
 
+      Cypress.action('cy:protocol-snapshot')
+
       return snapshot
     }
 

packages/driver/src/cypress.ts

@@ -652,6 +652,9 @@ class $Cypress {
       case 'cy:snapshot':
         return this.emit('snapshot', ...args)
 
+      case 'cy:protocol-snapshot':
+        return this.emit('cy:protocol-snapshot', ...args)
+
       case 'cy:before:stability:release':
         return this.emitThen('before:stability:release')
 

packages/driver/types/internal-types-lite.d.ts

@@ -21,6 +21,7 @@ declare namespace Cypress {
     (action: 'command:failed', fn: (command: CommandQueue, error: Error) => void): Cypress
     (action: 'page:loading', fn: (loading: boolean) => void)
     (action: 'test:after:run:async', fn: (attributes: ObjectLike, test: Mocha.Test) => void)
+    (action: 'cy:protocol-snapshot', fn: () => void)
   }
 
   interface Backend {