Merge branch 'feat/cy-prompt' into alejandro/chore/handle-cy-prompt-error

Author: ryanthemanuel

.circleci/workflows.yml

@@ -1,6 +1,6 @@
 version: 2.1
 
-chrome-stable-version: &chrome-stable-version "138.0.7204.92"
+chrome-stable-version: &chrome-stable-version "138.0.7204.100"
 chrome-beta-version: &chrome-beta-version "139.0.7258.5"
 firefox-stable-version: &firefox-stable-version "137.0"
 

cli/CHANGELOG.md

@@ -6,6 +6,7 @@ _Released 7/15/2025 (PENDING)_
 **Bugfixes:**
 
 - Fixed a regression introduced in [`14.5.0`](https://docs.cypress.io/guides/references/changelog#14-5-0) where the Stop button would not immediately stop the spec timer. Addresses [#31920](https://github.com/cypress-io/cypress/issues/31920).
+- Fixed an issue with the `CloudRequest` where it used the wrong port for `https` requests. Addressed in [#31992](https://github.com/cypress-io/cypress/pull/31992).
 
 ## 14.5.1
 

packages/app/src/prompt/PromptGetCodeModal.vue

@@ -46,11 +46,11 @@ const closeModal = () => {
 const container = ref<HTMLDivElement | null>(null)
 const error = ref<string | null>(null)
 const ReactGetCodeModalContents = ref<GetCodeModalContentsShape | null>(null)
-const reactRoot = ref<Root | null>(null)
+const containerReactRootMap = new WeakMap<HTMLElement, Root>()
 const promptStore = usePromptStore()
 
 const maybeRenderReactComponent = () => {
-  if (!ReactGetCodeModalContents.value || !!error.value) {
+  if (!ReactGetCodeModalContents.value || !!error.value || !container.value) {
     return
   }
 
@@ -63,19 +63,32 @@ const maybeRenderReactComponent = () => {
     },
   })
 
-  if (!reactRoot.value) {
-    reactRoot.value = window.UnifiedRunner.ReactDOM.createRoot(container.value)
+  // Store the react root in a weak map keyed by the container. We do this so that we have a reference
+  // to it that's tied to the container value but absolutely do not want to use vue to do the tracking.
+  // If vue tracks it (e.g. using a ref) it creates proxies that do not play nicely with React in
+  // production
+  let reactRoot = containerReactRootMap.get(container.value)
+
+  if (!reactRoot) {
+    reactRoot = window.UnifiedRunner.ReactDOM.createRoot(container.value) as Root
+    containerReactRootMap.set(container.value, reactRoot)
   }
 
-  reactRoot.value?.render(panel)
+  reactRoot.render(panel)
 }
 
 const unmountReactComponent = () => {
   if (!ReactGetCodeModalContents.value || !container.value) {
     return
   }
 
-  reactRoot.value?.unmount()
+  const reactRoot = containerReactRootMap.get(container.value)
+
+  if (!reactRoot) {
+    return
+  }
+
+  reactRoot.unmount()
 }
 
 onMounted(maybeRenderReactComponent)

packages/app/src/prompt/PromptMoreInfoNeededModal.vue

@@ -46,11 +46,11 @@ const closeModal = () => {
 const container = ref<HTMLDivElement | null>(null)
 const error = ref<string | null>(null)
 const ReactMoreInfoNeededModalContents = ref<MoreInfoNeededModalContentsShape | null>(null)
-const reactRoot = ref<Root | null>(null)
+const containerReactRootMap = new WeakMap<HTMLElement, Root>()
 const promptStore = usePromptStore()
 
 const maybeRenderReactComponent = () => {
-  if (!ReactMoreInfoNeededModalContents.value || !!error.value) {
+  if (!ReactMoreInfoNeededModalContents.value || !!error.value || !container.value) {
     return
   }
 
@@ -65,19 +65,32 @@ const maybeRenderReactComponent = () => {
     },
   })
 
-  if (!reactRoot.value) {
-    reactRoot.value = window.UnifiedRunner.ReactDOM.createRoot(container.value)
+  // Store the react root in a weak map keyed by the container. We do this so that we have a reference
+  // to it that's tied to the container value but absolutely do not want to use vue to do the tracking.
+  // If vue tracks it (e.g. using a ref) it creates proxies that do not play nicely with React in
+  // production
+  let reactRoot = containerReactRootMap.get(container.value)
+
+  if (!reactRoot) {
+    reactRoot = window.UnifiedRunner.ReactDOM.createRoot(container.value) as Root
+    containerReactRootMap.set(container.value, reactRoot)
   }
 
-  reactRoot.value?.render(panel)
+  reactRoot.render(panel)
 }
 
 const unmountReactComponent = () => {
   if (!ReactMoreInfoNeededModalContents.value || !container.value) {
     return
   }
 
-  reactRoot.value?.unmount()
+  const reactRoot = containerReactRootMap.get(container.value)
+
+  if (!reactRoot) {
+    return
+  }
+
+  reactRoot.unmount()
 }
 
 onMounted(maybeRenderReactComponent)

packages/driver/cypress/e2e/commands/prompt/prompt.cy.ts

@@ -12,13 +12,13 @@ describe('src/cy/commands/prompt', () => {
     // TODO: add more tests when cy.prompt is built out, but for now this just
     // verifies that the command executes without throwing an error
     // @ts-expect-error - this will not error when we actually release the experimentalPromptCommand flag
-    cy.prompt('Hello, world!')
+    cy.prompt(['Hello, world!'])
 
     cy.visit('http://www.barbaz.com:3500/fixtures/dom.html')
 
     cy.origin('http://www.barbaz.com:3500', () => {
       // @ts-expect-error - this will not error when we actually release the experimentalPromptCommand flag
-      cy.prompt('Hello, world!')
+      cy.prompt(['Hello, world!'])
     })
   })
 
@@ -37,6 +37,6 @@ describe('src/cy/commands/prompt', () => {
 
     cy.visit('http://www.foobar.com:3500/fixtures/dom.html')
     // @ts-expect-error - this will not error when we actually release the experimentalPromptCommand flag
-    cy.prompt('Hello, world!')
+    cy.prompt(['Hello, world!'])
   })
 })

packages/network/lib/agent.ts

@@ -126,7 +126,7 @@ export const createProxySock = (opts: CreateProxySockOpts, cb: CreateProxySockCb
 
 export const isRequestHttps = (options: http.RequestOptions) => {
   // WSS connections will not have an href, but you can tell protocol from the defaultAgent
-  return _.get(options, '_defaultAgent.protocol') === 'https:' || (options.href || '').slice(0, 6) === 'https:'
+  return _.get(options, '_defaultAgent.protocol') === 'https:' || options.protocol === 'https:' || (options.href || '').slice(0, 6) === 'https:'
 }
 
 export const isResponseStatusCode200 = (head: string) => {
@@ -226,6 +226,11 @@ export class CombinedAgent {
 
     const isHttps = isRequestHttps(options)
 
+    // Ensure that HTTPS requests are using 443
+    if (isHttps && options.port === 80) {
+      options.port = 443
+    }
+
     if (!options.href) {
       // options.path can contain query parameters, which url.format will not-so-kindly urlencode for us...
       // so just append it to the resultant URL string

packages/server/test/unit/cloud/api/cloud_request_spec.ts

@@ -6,14 +6,17 @@ import agent from '@packages/network/lib/agent'
 import axios, { CreateAxiosDefaults, AxiosInstance } from 'axios'
 import debugLib from 'debug'
 import stripAnsi from 'strip-ansi'
-import { createCloudRequest } from '../../../../lib/cloud/api/cloud_request'
+import { CloudRequest, createCloudRequest } from '../../../../lib/cloud/api/cloud_request'
 import cloudApi from '../../../../lib/cloud/api'
 import app_config from '../../../../config/app.json'
 import os from 'os'
 import pkg from '@packages/root'
 import { transformError } from '../../../../lib/cloud/api/axios_middleware/transform_error'
 import { DestroyableProxy, fakeServer, fakeProxy } from './utils/fake_proxy_server'
 import dedent from 'dedent'
+import { PassThrough } from 'stream'
+import fetch from 'cross-fetch'
+import nock from 'nock'
 
 chai.use(sinonChai)
 
@@ -444,6 +447,48 @@ describe('CloudRequest', () => {
     })
   })
 
+  describe('https requests', () => {
+    it('handles https requests properly', async () => {
+      nock.restore()
+
+      // @ts-ignore
+      const addRequestSpy = sinon.stub(agent.httpsAgent, 'addRequest').callsFake((req, options) => {
+        // fake IncomingMessage
+        const res = new PassThrough() as any
+
+        res.statusCode = 200
+        res.headers = {
+          'content-type': 'application/json',
+        }
+
+        process.nextTick(() => {
+          req.emit('response', res)
+          res.write(JSON.stringify({ ok: options.port === 443 && options.protocol === 'https:' }))
+          res.end()
+        })
+      })
+
+      const result1 = await CloudRequest.post('https://cloud.cypress.io/ping', {})
+
+      expect(result1.data).to.eql({ ok: true })
+
+      const result2 = await createCloudRequest({ baseURL: 'https://api.cypress.io' }).post('/ping', {})
+
+      expect(result2.data).to.eql({ ok: true })
+
+      const result3 = await fetch('https://cloud.cypress.io/ping', {
+        method: 'POST',
+        body: '{}',
+        // @ts-expect-error - this is supported
+        agent,
+      })
+
+      expect(await result3.json()).to.eql({ ok: true })
+
+      expect(addRequestSpy).to.have.been.calledThrice
+    })
+  })
+
   ;[undefined, 'development', 'test', 'staging', 'production'].forEach((env) => {
     describe(`base url for CYPRESS_CONFIG_ENV "${env}"`, () => {
       let prevEnv