feat: display an activity indicator in the CLI output when uploading artifacts to cypress cloud

cli/CHANGELOG.md

@@ -1,4 +1,13 @@
 <!-- See the ../guides/writing-the-cypress-changelog.md for details on writing the changelog. -->
+
+## 13.6.0
+
+_Released 11/21/2023 (PENDING)_
+
+**Features:**
+
+ - Adds an activity indicator to CLI output when artifacts (screenshots, videos, or Test Replay) are being uploaded to the cloud. Addresses [#28239](/~https://github.com/cypress-io/cypress/issues/28239). Addressed in [#28277](/~https://github.com/cypress-io/cypress/pull/28277).
+
 ## 13.5.0
 
 _Released 11/8/2023_

packages/server/lib/modes/record.js

@@ -21,7 +21,7 @@ const Config = require('../config')
 const env = require('../util/env')
 const terminal = require('../util/terminal')
 const ciProvider = require('../util/ci_provider')
-const { printPendingArtifactUpload, printCompletedArtifactUpload } = require('../util/print-run')
+const { printPendingArtifactUpload, printCompletedArtifactUpload, beginUploadActivityOutput } = require('../util/print-run')
 const testsUtils = require('../util/tests_utils')
 const specWriter = require('../util/spec_writer')
 const { fs } = require('../util/fs')
@@ -239,6 +239,12 @@ const uploadArtifactBatch = async (artifacts, protocolManager, quiet) => {
     }
   })
 
+  let stopUploadActivityOutput
+
+  if (!quiet && preparedArtifacts.filter(({ skip }) => !skip).length) {
+    stopUploadActivityOutput = beginUploadActivityOutput()
+  }
+
   const uploadResults = await Promise.all(
     preparedArtifacts.map(async (artifact) => {
       if (artifact.skip) {
@@ -309,7 +315,11 @@ const uploadArtifactBatch = async (artifacts, protocolManager, quiet) => {
         }
       }
     }),
-  )
+  ).finally(() => {
+    if (stopUploadActivityOutput) {
+      stopUploadActivityOutput()
+    }
+  })
 
   const attemptedUploadResults = uploadResults.filter(({ skipped }) => {
     return !skipped

packages/server/lib/util/print-run.ts

@@ -639,3 +639,16 @@ export const printCompletedArtifactUpload = <T extends ArtifactUploadResultLike>
 
   process.stdout.write('\n')
 }
+
+export const beginUploadActivityOutput = () => {
+  console.log('')
+  process.stdout.write('Uploading Cloud Artifacts: . ')
+  const uploadActivityInterval = setInterval(() => {
+    process.stdout.write('. ')
+  }, 15000)
+
+  return () => {
+    clearInterval(uploadActivityInterval)
+    console.log('')
+  }
+}

system-tests/__snapshots__/record_spec.js

@@ -67,6 +67,8 @@ Fix the error in your code and re-run your tests.
   - Screenshot - Nothing to upload 
   - Test Replay - Nothing to upload - Test Replay is disabled for this project. Enable Test Replay in Cloud project settings
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Video - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/videos/record_error.cy.js.mp4
@@ -130,6 +132,8 @@ Because this error occurred during a \`before each\` hook we are skipping the re
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_fail.cy.js/record fails -- fails 1 -- before each hook (failed).png
   - Test Replay - Nothing to upload - Test Replay is disabled for this project. Enable Test Replay in Cloud project settings
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Video - Done Uploading 1 kB 1/2 /XXX/XXX/XXX/cypress/videos/record_fail.cy.js.mp4
@@ -178,6 +182,8 @@ plugin stdout
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - Nothing to upload - Test Replay is disabled for this project. Enable Test Replay in Cloud project settings
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -244,6 +250,8 @@ We dynamically generated a new test to display this failure.
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_uncaught.cy.js/An uncaught error was detected outside of a test (failed).png
   - Test Replay - Nothing to upload - Test Replay is disabled for this project. Enable Test Replay in Cloud project settings
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Video - Done Uploading 1 kB 1/2 /XXX/XXX/XXX/cypress/videos/record_uncaught.cy.js.mp4
@@ -1060,6 +1068,8 @@ plugin stdout
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - Nothing to upload - Test Replay is disabled for this project. Enable Test Replay in Cloud project settings
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -1576,6 +1586,8 @@ exports['e2e record api interaction errors update instance stdout warns but proc
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - Nothing to upload - Test Replay is disabled for this project. Enable Test Replay in Cloud project settings
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -1669,6 +1681,8 @@ exports['e2e record api interaction errors uploading assets warns but proceeds 1
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - Nothing to upload - Test Replay is disabled for this project. Enable Test Replay in Cloud project settings
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Video - Failed Uploading 1/2 /XXX/XXX/XXX/cypress/videos/record_pass.cy.js.mp4 - 500 - "Internal Server Error"
@@ -1775,6 +1789,8 @@ We will retry 3 more times in X second(s)...
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - Nothing to upload - Test Replay is disabled for this project. Enable Test Replay in Cloud project settings
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -2018,6 +2034,8 @@ https://on.cypress.io/dashboard/organizations/org-id-1234/billing
   - Video - Nothing to upload 
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -2103,6 +2121,8 @@ https://on.cypress.io/dashboard/organizations/org-id-1234/billing
   - Video - Nothing to upload 
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -2190,6 +2210,8 @@ https://on.cypress.io/dashboard/organizations/org-id-1234/billing
   - Video - Nothing to upload 
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -2275,6 +2297,8 @@ https://on.cypress.io/dashboard/organizations/org-id-1234/billing
   - Video - Nothing to upload 
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -2360,6 +2384,8 @@ https://on.cypress.io/dashboard/organizations/org-id-1234/billing
   - Video - Nothing to upload 
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -2445,6 +2471,8 @@ https://on.cypress.io/dashboard/organizations/org-id-1234/billing
   - Video - Nothing to upload 
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -2530,6 +2558,8 @@ https://on.cypress.io/dashboard/organizations/org-id-1234/billing
   - Video - Nothing to upload 
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -2615,6 +2645,8 @@ https://on.cypress.io/dashboard/organizations/org-id-1234/billing
   - Video - Nothing to upload 
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -2706,6 +2738,8 @@ Details:
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - Nothing to upload - Test Replay is disabled for this project. Enable Test Replay in Cloud project settings
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -2787,6 +2821,8 @@ exports['e2e record capture-protocol disabled messaging displays disabled messag
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - Nothing to upload - Test Replay is only supported in Chromium browsers
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -2868,6 +2904,8 @@ exports['e2e record capture-protocol enabled passing retrieves the capture proto
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - 1 kB
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/2 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -2954,6 +2992,8 @@ https://on.cypress.io/renderer-process-crashed
   - Screenshot - Nothing to upload 
   - Test Replay - 1 kB
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Test Replay - Done Uploading 1 kB 1/1
@@ -3000,6 +3040,8 @@ https://on.cypress.io/renderer-process-crashed
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay 
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/2 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -3080,6 +3122,8 @@ Error: Async error from plugins file
   - Screenshot - Nothing to upload 
   - Test Replay - 1 kB
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Test Replay - Done Uploading 1 kB 1/1
@@ -3161,6 +3205,8 @@ exports['e2e record capture-protocol enabled protocol runtime errors db size too
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - 1 kB
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/2 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -3243,6 +3289,8 @@ exports['e2e record capture-protocol enabled protocol runtime errors error initi
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - Failed Capturing - Error instantiating Protocol Capture
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -3324,6 +3372,8 @@ exports['e2e record capture-protocol enabled protocol runtime errors error in pr
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - Failed Capturing - Error in beforeSpec
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -3405,6 +3455,8 @@ exports['e2e record capture-protocol enabled protocol runtime errors error in pr
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - Failed Capturing - error in beforeTest
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -3486,6 +3538,8 @@ exports['e2e record capture-protocol enabled protocol runtime errors non-fatal e
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - 1 kB
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/2 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -3568,6 +3622,8 @@ exports['capture-protocol api errors upload 500 - retries 8 times and fails cont
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay 
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/2 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -3650,6 +3706,8 @@ exports['capture-protocol api errors upload 500 - retries 7 times and succeeds o
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - 1 kB
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/2 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -3738,6 +3796,8 @@ We will retry 1 more time in X second(s)...
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - Failed Capturing - Error downloading capture code: 500 - "500 - Internal Server Error"
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
@@ -3819,6 +3879,8 @@ exports['capture-protocol api errors error report 500 continues 1'] = `
   - Screenshot - 1 kB /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png
   - Test Replay - 1 kB
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Screenshot - Done Uploading 1 kB 1/2 /XXX/XXX/XXX/cypress/screenshots/record_pass.cy.js/yay it passes.png

system-tests/__snapshots__/video_compression_spec.js

@@ -187,6 +187,8 @@ exports['video compression true / coerces true to 32 CRF'] = `
   - Screenshot - Nothing to upload 
   - Test Replay - Nothing to upload - Test Replay is disabled for this project. Enable Test Replay in Cloud project settings
 
+Uploading Cloud Artifacts: . . . . .
+
   (Uploaded Cloud Artifacts)
 
   - Video - Done Uploading 1 kB 1/1 /XXX/XXX/XXX/cypress/videos/video_compression.cy.js.mp4

system-tests/lib/normalizeStdout.ts

@@ -64,15 +64,8 @@ const replaceTime = (str: string, p1: string) => {
 
 const replaceScreenshotDims = (str: string, p1: string) => _.padStart('(YxX)', p1.length)
 
-const replaceUploadingResults = function (orig: string, ...rest: string[]) {
-  const adjustedLength = Math.max(rest.length, 2)
-  const match = rest.slice(0, adjustedLength - 2)
-  const results = match[1].split('\n').map((res) => res.replace(/\(\d+\/(\d+)\)/g, '(*/$1)'))
-  .sort()
-  .join('\n')
-  const ret = match[0] + results + match[3]
-
-  return ret
+const replaceUploadActivityIndicator = function (str: string, preamble: string, activity: string, ..._) {
+  return `${preamble}. . . . .`
 }
 
 // this captures an entire stack trace and replaces it with [stack trace lines]
@@ -150,8 +143,8 @@ export const normalizeStdout = function (str: string, options: any = {}) {
   // 15 seconds -> XX seconds
   .replace(/((\d+ minutes?,\s+)?\d+ seconds? *)/g, replaceTime)
   .replace(/\r/g, '')
-  // replaces multiple lines of uploading screenshots & results (since order not guaranteed)
-  .replace(/(Uploading Screenshots & Videos.*?\n\n)((.*-.*[\s\S\r]){2,}?)(\n\n)/g, replaceUploadingResults)
+  // normalizes upload indicator to a consistent number of dots
+  .replace(/(Uploading Cloud Artifacts\: )([\. ]+)/g, replaceUploadActivityIndicator)
   // fix "Require stacks" for CI
   .replace(/^(\- )(\/.*\/packages\/server\/)(.*)$/gm, '$1$3')
   // Different browsers have different cross-origin error messages