feat: Cypress Cloud data on Specs page and Runs page use local Git da…

…ta if available (#26991)

cli/CHANGELOG.md

@@ -8,6 +8,7 @@ _Released 06/20/2023 (PENDING)_
 - Added support for running Cypress tests with [Chrome's new `--headless=new` flag](https://developer.chrome.com/articles/new-headless/). Chrome versions 112 and above will now be run in the `headless` mode that matches the `headed` browser implementation. Addresses [#25972](https://github.com/cypress-io/cypress/issues/25972).
 - Cypress can now test pages with targeted `Content-Security-Policy` and `Content-Security-Policy-Report-Only` header directives by specifying the allow list via the [`experimentalCspAllowList`](https://docs.cypress.io/guides/references/configuration#Experimental-Csp-Allow-List) configuration option. Addresses [#1030](https://github.com/cypress-io/cypress/issues/1030). Addressed in [#26483](https://github.com/cypress-io/cypress/pull/26483)
 - The [`videoCompression`](https://docs.cypress.io/guides/references/configuration#Videos) configuration option now accepts both a boolean or a Constant Rate Factor (CRF) number between `1` and `51`. The `videoCompression` default value is still `32` CRF and when `videoCompression` is set to `true` the default of `32` CRF will be used. Addresses [#26658](https://github.com/cypress-io/cypress/issues/26658).
+- The Cypress Cloud data shown on the [Specs](https://docs.cypress.io/guides/core-concepts/cypress-app#Specs) page and [Runs](https://docs.cypress.io/guides/core-concepts/cypress-app#Runs) page will now reflect Cloud Runs that match the current Git tree if Git is being used. Addresses [#26693](https://github.com/cypress-io/cypress/issues/26693).
 
 **Bugfixes:**
 

packages/app/cypress/e2e/debug.cy.ts

@@ -1,5 +1,7 @@
 import type { OpenFileInIdeQuery } from '../../src/generated/graphql-test'
 import RelevantRunsDataSource_RunsByCommitShas from '../fixtures/gql-RelevantRunsDataSource_RunsByCommitShas.json'
+import DebugDataPassing from '../fixtures/debug-Passing/gql-Debug.json'
+import DebugDataFailing from '../fixtures/debug-Failing/gql-Debug.json'
 
 Cypress.on('window:before:load', (win) => {
   win.__CYPRESS_GQL_NO_SOCKET__ = 'true'
@@ -16,45 +18,26 @@ describe('App - Debug Page', () => {
     cy.startAppServer('component')
 
     cy.loginUser()
-    cy.withCtx((ctx) => {
+    cy.withCtx((ctx, o) => {
       ctx.git?.__setGitHashesForTesting(['commit1', 'commit2'])
+      o.sinon.stub(ctx.lifecycleManager.git!, 'currentBranch').value('fakeBranch')
     })
+  })
 
+  it('all tests passed', () => {
     cy.remoteGraphQLIntercept((obj, _testState, options) => {
       if (obj.operationName === 'RelevantRunsDataSource_RunsByCommitShas') {
         obj.result.data = options.RelevantRunsDataSource_RunsByCommitShas.data
       }
 
-      return obj.result
-    }, { RelevantRunsDataSource_RunsByCommitShas })
-  })
-
-  it('all tests passed', () => {
-    // This mocks all the responses so we can get deterministic
-    // results to test the debug page.
-    cy.intercept('query-Debug', {
-      fixture: 'debug-Passing/gql-Debug.json',
-    })
-
-    cy.intercept('query-CloudViewerAndProject_RequiredData', {
-      fixture: 'debug-Passing/gql-CloudViewerAndProject_RequiredData.json',
-    })
-
-    cy.intercept('query-MainAppQuery', {
-      fixture: 'debug-Passing/gql-MainAppQuery.json',
-    })
-
-    cy.intercept('query-SideBarNavigationContainer', {
-      fixture: 'debug-Passing/gql-SideBarNavigationContainer',
-    })
-
-    cy.intercept('query-HeaderBar_HeaderBarQuery', {
-      fixture: 'debug-Passing/gql-HeaderBar_HeaderBarQuery',
-    })
+      if (obj.operationName === 'Debug_currentProject_cloudProject_cloudProjectBySlug') {
+        if (obj.result.data) {
+          obj.result.data.cloudProjectBySlug.runByNumber = options.DebugDataPassing.data.currentProject.cloudProject.runByNumber
+        }
+      }
 
-    cy.intercept('query-SpecsPageContainer', {
-      fixture: 'debug-Passing/gql-SpecsPageContainer',
-    })
+      return obj.result
+    }, { RelevantRunsDataSource_RunsByCommitShas, DebugDataPassing })
 
     cy.visitApp()
 
@@ -84,32 +67,24 @@ describe('App - Debug Page', () => {
     cy.findByTestId('debug-passed').contains('All your tests passed.')
     cy.findByLabelText('Relevant run passed').should('be.visible').contains('0')
     cy.findByTestId('run-failures').should('not.exist')
+
+    cy.get('[data-cy="debug-badge"]').should('be.visible').contains('0')
   })
 
   it('shows information about a failed spec', () => {
-    cy.intercept('query-Debug', {
-      fixture: 'debug-Failing/gql-Debug.json',
-    })
-
-    cy.intercept('query-CloudViewerAndProject_RequiredData', {
-      fixture: 'debug-Failing/gql-CloudViewerAndProject_RequiredData.json',
-    })
-
-    cy.intercept('query-MainAppQuery', {
-      fixture: 'debug-Failing/gql-MainAppQuery.json',
-    })
-
-    cy.intercept('query-SideBarNavigationContainer', {
-      fixture: 'debug-Failing/gql-SideBarNavigationContainer',
-    })
+    cy.remoteGraphQLIntercept((obj, _testState, options) => {
+      if (obj.operationName === 'RelevantRunsDataSource_RunsByCommitShas') {
+        obj.result.data = options.RelevantRunsDataSource_RunsByCommitShas.data
+      }
 
-    cy.intercept('query-HeaderBar_HeaderBarQuery', {
-      fixture: 'debug-Failing/gql-HeaderBar_HeaderBarQuery',
-    })
+      if (obj.operationName === 'Debug_currentProject_cloudProject_cloudProjectBySlug') {
+        if (obj.result.data) {
+          obj.result.data.cloudProjectBySlug.runByNumber = options.DebugDataFailing.data.currentProject.cloudProject.runByNumber
+        }
+      }
 
-    cy.intercept('query-SpecsPageContainer', {
-      fixture: 'debug-Failing/gql-SpecsPageContainer',
-    })
+      return obj.result
+    }, { RelevantRunsDataSource_RunsByCommitShas, DebugDataFailing })
 
     cy.intercept('query-OpenFileInIDE', (req) => {
       req.on('response', (res) => {
@@ -152,7 +127,7 @@ describe('App - Debug Page', () => {
     })
 
     cy.findByTestId('spec-contents').within(() => {
-      cy.contains('src/components/InfoPanel/InfoPanel.cy.ts')
+      cy.contains('src/NewComponent.spec.jsx')
       cy.findByTestId('metaData-Results-spec-duration').contains('00:04')
       cy.findByTestId('metaData-Results-operating-system').contains('Linux Ubuntu')
       cy.findByTestId('metaData-Results-browser').contains('Electron 106')
@@ -161,12 +136,95 @@ describe('App - Debug Page', () => {
 
     cy.findByTestId('test-row').contains('InfoPanel')
     cy.findByTestId('test-row').contains('renders')
-    cy.findByTestId('run-failures').should('exist').should('have.attr', 'href', '#/specs/runner?file=src/components/InfoPanel/InfoPanel.cy.ts&mode=debug')
+    cy.findByTestId('run-failures').should('exist').should('have.attr', 'href', '#/specs/runner?file=src/NewComponent.spec.jsx&mode=debug')
 
     cy.findByLabelText('Open in IDE').click()
     cy.wait('@openFileInIDE')
     cy.withCtx((ctx) => {
-      expect(ctx.actions.file.openFile).to.have.been.calledWith('src/components/InfoPanel/InfoPanel.cy.ts', 1, 1)
+      expect(ctx.actions.file.openFile).to.have.been.calledWith('src/NewComponent.spec.jsx', 1, 1)
+    })
+  })
+
+  it('shows running and updating build', () => {
+    cy.remoteGraphQLIntercept((obj, _testState, options) => {
+      if (obj.operationName === 'RelevantRunsDataSource_RunsByCommitShas') {
+        obj.result.data = options.RelevantRunsDataSource_RunsByCommitShas.data
+      }
+
+      const originalRun = options.DebugDataFailing.data.currentProject.cloudProject.runByNumber
+
+      if (options.testRun === undefined) {
+        options.testRun = JSON.parse(JSON.stringify(originalRun))
+      }
+
+      const run = options.testRun
+
+      run.totalInstanceCount = 5
+      if (run.completedInstanceCount === undefined) {
+        run.completedInstanceCount = 0
+        run.createdAt = (new Date()).toISOString()
+      }
+
+      if (run.totalInstanceCount === run.completedInstanceCount) {
+        run.status = 'FAILED'
+      } else {
+        run.status = 'RUNNING'
+      }
+
+      if (run.completedInstanceCount < 3) {
+        run.testsForReview = []
+      } else {
+        run.testsForReview = originalRun.testsForReview
+      }
+
+      run.totalFailed = run.testsForReview.length
+      run.totalPassed = run.completedInstanceCount - run.totalFailed
+
+      if (obj.operationName === 'Debug_currentProject_cloudProject_cloudProjectBySlug') {
+        if (obj.result.data) {
+          obj.result.data.cloudProjectBySlug.runByNumber = run
+        }
+      }
+
+      if (obj.operationName === 'RelevantRunSpecsDataSource_Specs' && obj.result.data) {
+        //NOTE Figure out how to manually trigger polling instead of adjusting polling intervals
+        obj.result.data.pollingIntervals = {
+          __typename: 'CloudPollingIntervals',
+          runByNumber: 1, //Increase polling interval for debugging test
+        }
+
+        if (run.totalInstanceCount === run.completedInstanceCount) {
+          obj.result.data.pollingIntervals.runByNumber = 100
+        } else {
+          run.completedInstanceCount = run.completedInstanceCount !== undefined ? ++run.completedInstanceCount : 0
+        }
+
+        obj.result.data.cloudNodesByIds = [
+          run,
+        ]
+      }
+
+      return obj.result
+    }, { RelevantRunsDataSource_RunsByCommitShas, DebugDataFailing })
+
+    cy.visitApp()
+
+    cy.findByTestId('sidebar-link-debug-page').click()
+    cy.findByTestId('debug-container').should('be.visible')
+
+    cy.findByTestId('header-top').contains('chore: testing cypress')
+
+    cy.findByTestId('debug-testing-progress').as('progress')
+
+    cy.get('@progress').contains('Testing in progress...')
+    cy.get('[data-cy="debug-badge"]').contains('0').should('be.visible')
+    cy.get('@progress').contains('1 of 5 specs completed')
+    cy.get('@progress').contains('2 of 5 specs completed')
+    cy.get('@progress').contains('3 of 5 specs completed')
+    cy.get('[data-cy="debug-badge"]').contains('1').should('be.visible')
+
+    cy.findByTestId('spec-contents').within(() => {
+      cy.contains('src/NewComponent.spec.jsx')
     })
   })
 })