Merge branch 'develop' into update-v8-snapshot-cache-on-develop

cypress-io · Apr 21, 2023 · 8141a76 · 8141a76 · cypress-bot · Apr 21, 2023
2 parents 013a481 + c86a97e
commit 8141a76
Show file tree

Hide file tree

Showing 15 changed files with 60 additions and 22 deletions.
diff --git a/packages/app/cypress/e2e/debug.cy.ts b/packages/app/cypress/e2e/debug.cy.ts
@@ -64,7 +64,7 @@ describe('App - Debug Page', () => {
     cy.findByTestId('header-top').contains('update projectId')
     cy.findByTestId('debug-header-dashboard-link')
     .contains('View in Cypress Cloud')
-    .should('have.attr', 'href', 'https://cloud.cypress.io/projects/7p5uce/runs/2')
+    .should('have.attr', 'href', 'https://cloud.cypress.io/projects/7p5uce/runs/2?utm_medium=Debug+Tab&utm_campaign=View+in+Cypress+Cloud&utm_source=Binary%3A+App')
 
     cy.findByTestId('debug-runNumber-PASSED').contains('#2')
     cy.findByTestId('debug-commitsAhead').contains('You are 1 commit ahead')
@@ -133,7 +133,7 @@ describe('App - Debug Page', () => {
     cy.findByTestId('header-top').contains('chore: testing cypress')
     cy.findByTestId('debug-header-dashboard-link')
     .contains('View in Cypress Cloud')
-    .should('have.attr', 'href', 'https://cloud.cypress.io/projects/vgqrwp/runs/136')
+    .should('have.attr', 'href', 'https://cloud.cypress.io/projects/vgqrwp/runs/136?utm_medium=Debug+Tab&utm_campaign=View+in+Cypress+Cloud&utm_source=Binary%3A+App')
 
     cy.findByLabelText('Relevant run had 1 test failure').should('be.visible').contains('1')
 

diff --git a/packages/app/src/debug/DebugFailedTest.cy.tsx b/packages/app/src/debug/DebugFailedTest.cy.tsx
@@ -117,6 +117,12 @@ describe('<DebugFailedTest/>', () => {
 
     cy.findByTestId('test-group').realHover()
     cy.findByTestId('debug-artifacts').should('be.visible').children().should('have.length', 3)
+    cy.findByTestId('debug-artifacts').children().each((artifact) => {
+      cy.wrap(artifact).find('a').should('have.attr', 'href')
+      .and('match', /utm_medium/)
+      .and('match', /utm_campaign/)
+      .and('match', /utm_source/)
+    })
 
     cy.percySnapshot()
   })

diff --git a/packages/app/src/debug/DebugOverLimit.vue b/packages/app/src/debug/DebugOverLimit.vue
@@ -28,6 +28,7 @@ import { getUtmSource } from '@packages/frontend-shared/src/utils/getUtmSource'
 import { useI18n } from '@cy/i18n'
 import { getUrlWithParams } from '@packages/frontend-shared/src/utils/getUrlWithParams'
 import { computed } from 'vue'
+import { DEBUG_TAB_MEDIUM } from './utils/constants'
 
 export type CloudRunHidingReason = DebugReasonsRunIsHiddenFragment['reasonsRunIsHidden'][number]
 
@@ -60,7 +61,7 @@ const props = defineProps<{
 }>()
 
 const actionUrl = computed(() => {
-  return getUrlWithParams({ url: props.overLimitActionUrl, params: { utmMedium: 'Debug Tab', utmSource: getUtmSource() } })
+  return getUrlWithParams({ url: props.overLimitActionUrl, params: { utmMedium: DEBUG_TAB_MEDIUM, utmSource: getUtmSource() } })
 })
 
 const overLimitReason = computed<CloudRunHidingReason>(() => {

diff --git a/packages/app/src/debug/DebugPageHeader.cy.tsx b/packages/app/src/debug/DebugPageHeader.cy.tsx
@@ -37,6 +37,8 @@ describe('<DebugPageHeader />', {
     cy.findByTestId('debug-header').children().should('have.length', 2)
     cy.findByTestId('debug-test-summary').should('have.text', 'Adding a hover state to the button component')
 
+    cy.findByTestId('debug-header-dashboard-link').should('be.visible').should('have.attr', 'href', 'http://dummy.cypress.io/runs/1?utm_medium=Debug+Tab&utm_campaign=View+in+Cypress+Cloud&utm_source=Binary%3A+Launchpad')
+
     cy.findByTestId('debug-commitsAhead').should('have.text', 'You are 2 commits ahead')
 
     cy.findByTestId('debug-results').should('be.visible')

diff --git a/packages/app/src/debug/DebugPageHeader.vue b/packages/app/src/debug/DebugPageHeader.vue
@@ -38,7 +38,7 @@
         <li class="font-normal text-sm text-indigo-500 inline">
           <ExternalLink
             data-cy="debug-header-dashboard-link"
-            :href="debug.url || '#'"
+            :href="runUrl"
           >
             {{ t('debugPage.header.runUrl') }}
           </ExternalLink>
@@ -116,6 +116,8 @@ import { useI18n } from 'vue-i18n'
 import DebugRunNumber from './DebugRunNumber.vue'
 import UserAvatar from '@cy/gql-components/topnav/UserAvatar.vue'
 import { useRunDateTimeInterval } from './useRunDateTimeInterval'
+import { getUrlWithParams } from '@packages/frontend-shared/src/utils/getUrlWithParams'
+import { DEBUG_TAB_MEDIUM } from './utils/constants'
 
 const { t } = useI18n()
 
@@ -147,6 +149,10 @@ const props = defineProps<{
 
 const debug = computed(() => props.gql)
 
+const runUrl = computed(() => {
+  return debug.value.url ? getUrlWithParams({ url: debug.value.url, params: { utm_medium: DEBUG_TAB_MEDIUM, utm_campaign: 'View in Cypress Cloud' } }) : '#'
+})
+
 const { relativeCreatedAt, totalDuration } = useRunDateTimeInterval(debug)
 
 </script>

diff --git a/packages/app/src/debug/DebugRunNavigation.cy.tsx b/packages/app/src/debug/DebugRunNavigation.cy.tsx
@@ -240,7 +240,7 @@ describe('<DebugRunNavigation />', () => {
     cy.findByTestId('debug-toggle').click()
 
     cy.contains('We found more than 100 runs.').should('be.visible')
-    cy.findByRole('link', { name: 'Go to Cypress Cloud to see all runs' }).should('be.visible').should('have.attr', 'href', 'https://cloud.cypress.io/projects/ypt4pf/')
+    cy.findByRole('link', { name: 'Go to Cypress Cloud to see all runs' }).should('be.visible').should('have.attr', 'href', 'https://cloud.cypress.io/projects/ypt4pf/?utm_medium=Debug+Tab&utm_campaign=Run+Navigation+Limit&utm_source=Binary%3A+Launchpad')
 
     cy.percySnapshot()
   })

diff --git a/packages/app/src/debug/DebugRunNavigationLimitMessage.cy.tsx b/packages/app/src/debug/DebugRunNavigationLimitMessage.cy.tsx
@@ -4,7 +4,7 @@ describe('DebugRunNavigationLimitMessage', () => {
   it('renders link if cloudProjectUrl is passed', () => {
     cy.mount(<DebugRunNavigationLimitMessage cloudProjectUrl="https://cloud.cypress.io/projects/ypt4pf/" />)
 
-    cy.findByRole('link', { name: 'Go to Cypress Cloud to see all runs' }).should('be.visible').should('have.attr', 'href', 'https://cloud.cypress.io/projects/ypt4pf/')
+    cy.findByRole('link', { name: 'Go to Cypress Cloud to see all runs' }).should('be.visible').should('have.attr', 'href', 'https://cloud.cypress.io/projects/ypt4pf/?utm_medium=Debug+Tab&utm_campaign=Run+Navigation+Limit&utm_source=Binary%3A+Launchpad')
 
     cy.percySnapshot()
   })

diff --git a/packages/app/src/debug/DebugRunNavigationLimitMessage.vue b/packages/app/src/debug/DebugRunNavigationLimitMessage.vue
@@ -9,8 +9,8 @@
     <div class="text-gray-700">
       {{ t('debugPage.foundMoreThan100Runs') }}
       <ExternalLink
-        v-if="cloudProjectUrl"
-        :href="cloudProjectUrl"
+        v-if="cloudProjectUrlWithUtmParams"
+        :href="cloudProjectUrlWithUtmParams"
       >
         {{ t('debugPage.goToCypressCloud') }}
       </ExternalLink>
@@ -19,12 +19,17 @@
 </template>
 
 <script setup lang="ts">
+import { computed } from 'vue'
 import ExternalLink from '@cy/gql-components/ExternalLink.vue'
 import { useI18n } from '@cy/i18n'
 import { IconWarningCircle } from '@cypress-design/vue-icon'
+import { getUrlWithParams } from '@packages/frontend-shared/src/utils/getUrlWithParams'
+import { DEBUG_TAB_MEDIUM } from './utils/constants'
 
 const { t } = useI18n()
 
-defineProps<{ cloudProjectUrl?: string }>()
+const props = defineProps<{ cloudProjectUrl?: string }>()
+
+const cloudProjectUrlWithUtmParams = computed(() => props.cloudProjectUrl && getUrlWithParams({ url: props.cloudProjectUrl, params: { utm_medium: DEBUG_TAB_MEDIUM, utm_campaign: 'Run Navigation Limit' } }))
 
 </script>
diff --git a/packages/app/src/debug/DebugSpecLimitBanner.cy.tsx b/packages/app/src/debug/DebugSpecLimitBanner.cy.tsx
@@ -14,6 +14,11 @@ describe('<DebugSpecLimitBanner />', () => {
     cy.contains(defaultMessages.debugPage.limit.message.split('|')[0].trim().replace('{n}', '120'))
     cy.contains(defaultMessages.debugPage.limit.link)
 
+    cy.get('a').should('have.attr', 'href')
+    .and('match', /utm_medium/)
+    .and('match', /utm_campaign/)
+    .and('match', /utm_source/)
+
     cy.viewport(1000, 400)
     cy.percySnapshot('large viewport')
 

diff --git a/packages/app/src/debug/DebugSpecLimitBanner.vue b/packages/app/src/debug/DebugSpecLimitBanner.vue
@@ -12,10 +12,10 @@
         {{ t('debugPage.limit.message', { n: failedTestCount }) }}
       </li>
       <li
-        v-if="cloudRunUrl"
+        v-if="cloudRunUrlWithUtmParams"
         class="text-sm"
       >
-        <ExternalLink :href="cloudRunUrl">
+        <ExternalLink :href="cloudRunUrlWithUtmParams">
           {{ t('debugPage.limit.link') }}
         </ExternalLink>
       </li>
@@ -26,14 +26,19 @@
 <script lang="ts" setup>
 import ExternalLink from '@cy/gql-components/ExternalLink.vue'
 import { useI18n } from '@cy/i18n'
+import { getUrlWithParams } from '@packages/frontend-shared/src/utils/getUrlWithParams'
+import { computed } from 'vue'
+import { DEBUG_TAB_MEDIUM } from './utils/constants'
 
 const { t } = useI18n()
 
-defineProps<{
+const props = defineProps<{
   failedTestCount: number
   cloudRunUrl: string | null
 }>()
 
+const cloudRunUrlWithUtmParams = computed(() => props.cloudRunUrl && getUrlWithParams({ url: props.cloudRunUrl, params: { utm_medium: DEBUG_TAB_MEDIUM, utm_campaign: 'Spec Limit' } }))
+
 </script>
 
 <style scoped>

diff --git a/packages/app/src/debug/empty/DebugEmptyView.vue b/packages/app/src/debug/empty/DebugEmptyView.vue
@@ -51,7 +51,7 @@ import { useCohorts } from '@packages/frontend-shared/src/gql-components/composa
 
 import DebugSlide from './DebugSlide.vue'
 import Slideshow, { SlideshowStep } from '../../components/Slideshow.vue'
-import { DebugSlideshowCampaigns, DEBUG_SLIDESHOW } from '../utils/constants'
+import { DebugSlideshowCampaigns, DEBUG_SLIDESHOW, DEBUG_TAB_MEDIUM } from '../utils/constants'
 import { DebugEmptyViewDocument, DebugEmptyView_SetPreferencesDocument, DebugEmptyView_RecordEventDocument } from '../../generated/graphql'
 import DebugSkeleton from './DebugSkeleton.vue'
 
@@ -112,7 +112,7 @@ const helpLink = getUrlWithParams({
   url: props.helpLinkHref || '',
   params: {
     utm_source: getUtmSource(),
-    utm_medium: 'Debug Tab',
+    utm_medium: DEBUG_TAB_MEDIUM,
     utm_campaign: 'Learn More',
   },
 })

diff --git a/packages/app/src/debug/empty/DebugNoProject.vue b/packages/app/src/debug/empty/DebugNoProject.vue
@@ -9,7 +9,7 @@
   >
     <template #cta="slotProps">
       <CloudConnectButton
-        utm-medium="Debug Tab"
+        :utm-medium="DEBUG_TAB_MEDIUM"
         :utm-content="slotProps.utmContent"
       />
     </template>
@@ -20,7 +20,7 @@
 import DebugEmptyView from './DebugEmptyView.vue'
 import { useI18n } from '@cy/i18n'
 import CloudConnectButton from '../../runs/CloudConnectButton.vue'
-import { DEBUG_SLIDESHOW } from '../utils/constants'
+import { DEBUG_SLIDESHOW, DEBUG_TAB_MEDIUM } from '../utils/constants'
 
 const { t } = useI18n()
 

diff --git a/packages/app/src/debug/empty/DebugNotLoggedIn.vue b/packages/app/src/debug/empty/DebugNotLoggedIn.vue
@@ -9,7 +9,7 @@
   >
     <template #cta="slotProps">
       <CloudConnectButton
-        utm-medium="Debug Tab"
+        :utm-medium="DEBUG_TAB_MEDIUM"
         :utm-content="slotProps.utmContent"
       />
     </template>
@@ -20,7 +20,7 @@
 import DebugEmptyView from './DebugEmptyView.vue'
 import { useI18n } from '@cy/i18n'
 import CloudConnectButton from '../../runs/CloudConnectButton.vue'
-import { DEBUG_SLIDESHOW } from '../utils/constants'
+import { DEBUG_SLIDESHOW, DEBUG_TAB_MEDIUM } from '../utils/constants'
 
 const { t } = useI18n()
 

diff --git a/packages/app/src/debug/utils/constants.ts b/packages/app/src/debug/utils/constants.ts
@@ -1,13 +1,15 @@
 type ValueOf<T> = T[keyof T]
 
+export const DEBUG_TAB_MEDIUM = 'Debug Tab'
+
 export const DEBUG_SLIDESHOW = {
   id: 'iatr_debug_slideshow',
   campaigns: {
     login: 'Debug Login Empty State',
     connectProject: 'Debug Connect Project Empty State',
     recordRun: 'Debug Record Run Empty State',
   },
-  medium: 'Debug Tab',
+  medium: DEBUG_TAB_MEDIUM,
 } as const
 
 export type DebugSlideshowCampaigns = ValueOf<typeof DEBUG_SLIDESHOW['campaigns']>
diff --git a/packages/app/src/debug/utils/debugArtifacts.ts b/packages/app/src/debug/utils/debugArtifacts.ts
@@ -1,23 +1,29 @@
 import type { CloudRunInstance } from '@packages/data-context/src/gen/graphcache-config.gen'
+import { getUrlWithParams } from '@packages/frontend-shared/src/utils/getUrlWithParams'
 import type { useI18n } from '@cy/i18n'
+import { DEBUG_TAB_MEDIUM } from './constants'
 
 export type ArtifactType = 'TERMINAL_LOG' | 'IMAGE_SCREENSHOT' | 'PLAY'
 
 export type DebugArtifact = { icon: ArtifactType, text: string, url: string }
 
+const formatUrl = (url: string, campaign: string): string => {
+  return getUrlWithParams({ url, params: { utm_medium: DEBUG_TAB_MEDIUM, utm_campaign: campaign } })
+}
+
 export const getDebugArtifacts = (instance: CloudRunInstance | null, t: ReturnType<typeof useI18n>['t']): DebugArtifact[] => {
   const debugArtifacts: DebugArtifact[] = []
 
   if (instance?.hasStdout && instance.stdoutUrl) {
-    debugArtifacts.push({ icon: 'TERMINAL_LOG', text: t('debugPage.artifacts.stdout'), url: instance.stdoutUrl })
+    debugArtifacts.push({ icon: 'TERMINAL_LOG', text: t('debugPage.artifacts.stdout'), url: formatUrl(instance.stdoutUrl, 'Output') })
   }
 
   if (instance?.hasScreenshots && instance.screenshotsUrl) {
-    debugArtifacts.push({ icon: 'IMAGE_SCREENSHOT', text: t('debugPage.artifacts.screenshots'), url: instance.screenshotsUrl })
+    debugArtifacts.push({ icon: 'IMAGE_SCREENSHOT', text: t('debugPage.artifacts.screenshots'), url: formatUrl(instance.screenshotsUrl, 'Screenshots') })
   }
 
   if (instance?.hasVideo && instance.videoUrl) {
-    debugArtifacts.push({ icon: 'PLAY', text: t('debugPage.artifacts.video'), url: instance.videoUrl })
+    debugArtifacts.push({ icon: 'PLAY', text: t('debugPage.artifacts.video'), url: formatUrl(instance.videoUrl, 'Video') })
   }
 
   return debugArtifacts