chore(server): share common routes (#18055)

Author: lmiller1990

cli/types/cypress.d.ts

@@ -22,6 +22,19 @@ declare namespace Cypress {
     password: string
   }
 
+  interface RemoteState {
+    auth?: {
+      username: string
+      password: string
+    }
+    domainName: string
+    strategy: 'file' | 'http'
+    origin: string
+    fileServer: string
+    props: Record<string, any>
+    visiting: string
+  }
+
   interface Backend {
     /**
      * Firefox only: Force Cypress to run garbage collection routines.
@@ -2856,19 +2869,15 @@ declare namespace Cypress {
     projectName: string
     projectRoot: string
     proxyUrl: string
+    remote: RemoteState
     report: boolean
     reporterRoute: string
     reporterUrl: string
     socketId: null | string
     socketIoCookie: string
     socketIoRoute: string
-    spec: {
-      absolute: string
-      name: string
-      relative: string
-      specFilter: null | string
-      specType: 'integration' | 'component'
-    }
+    spec: Cypress['spec']
+    specs: Array<Cypress['spec']>
     xhrRoute: string
     xhrUrl: string
   }

packages/proxy/lib/http/request-middleware.ts

@@ -1,5 +1,4 @@
 import _ from 'lodash'
-import type CyServer from '@packages/server'
 import { blocked, cors } from '@packages/network'
 import { InterceptRequest } from '@packages/net-stubbing'
 import debugModule from 'debug'
@@ -126,7 +125,7 @@ const StripUnsupportedAcceptEncoding: RequestMiddleware = function () {
   this.next()
 }
 
-function reqNeedsBasicAuthHeaders (req, { auth, origin }: CyServer.RemoteState) {
+function reqNeedsBasicAuthHeaders (req, { auth, origin }: Cypress.RemoteState) {
   //if we have auth headers, this request matches our origin, protection space, and the user has not supplied auth headers
   return auth && !req.headers['authorization'] && cors.urlMatchesOriginProtectionSpace(req.proxiedUrl, origin)
 }

packages/resolve-dist/lib/index.ts

@@ -2,7 +2,9 @@ import path from 'path'
 
 let fs: typeof import('fs-extra')
 
-type FoldersWithDist = 'static' | 'runner' | 'runner-ct' | 'driver'
+export type RunnerPkg = 'runner' | 'runner-ct'
+
+type FoldersWithDist = 'static' | 'driver' | RunnerPkg
 
 export const getPathToDist = (folder: FoldersWithDist, ...args: string[]) => {
   return path.join(...[__dirname, '..', '..', folder, 'dist', ...args])
@@ -14,7 +16,7 @@ export const getRunnerInjectionContents = () => {
   return fs.readFile(getPathToDist('runner', 'injection.js'))
 }
 
-export const getPathToIndex = (pkg: 'runner' | 'runner-ct') => {
+export const getPathToIndex = (pkg: RunnerPkg) => {
   return getPathToDist(pkg, 'index.html')
 }
 

packages/server/index.d.ts

@@ -14,7 +14,7 @@
 
 // types for the `server` package
 export namespace CyServer {
-  export type getRemoteState = () => RemoteState
+  export type getRemoteState = () => Cypress.RemoteState
 
   // TODO: pull this from main types
   export interface Config {
@@ -28,18 +28,6 @@ export namespace CyServer {
     responseTimeout: number
   }
 
-  export interface RemoteState {
-    auth?: {
-      username: string
-      password: string
-    }
-    domainName: string
-    strategy: 'file' | 'http'
-    origin: string
-    fileServer: string
-    visiting: string
-  }
-
   export interface Socket {
     toDriver: (eventName: string, ...args: any) => void
   }

packages/server/lib/controllers/iframes.ts

@@ -0,0 +1,56 @@
+import type { Request, Response } from 'express'
+import type httpProxy from 'http-proxy'
+import Debug from 'debug'
+import files from './files'
+import type { Cfg } from '../project-base'
+
+const debug = Debug('cypress:server:iframes')
+
+interface IFramesController {
+  config: Cfg
+}
+
+interface E2E extends IFramesController {
+  getRemoteState: () => any
+  getSpec: () => Cypress.Cypress['spec'] | null
+}
+
+interface CT extends IFramesController {
+  nodeProxy: httpProxy
+}
+
+export const iframesController = {
+  e2e: ({ getSpec, getRemoteState, config }: E2E, req: Request, res: Response) => {
+    const extraOptions = {
+      specFilter: getSpec()?.specFilter,
+      specType: 'integration',
+    }
+
+    debug('handling iframe for project spec %o', {
+      spec: getSpec(),
+      extraOptions,
+    })
+
+    files.handleIframe(req, res, config, getRemoteState, extraOptions)
+  },
+
+  component: ({ config, nodeProxy }: CT, req: Request, res: Response) => {
+    // always proxy to the index.html file
+    // attach header data for webservers
+    // to properly intercept and serve assets from the correct src root
+    // TODO: define a contract for dev-server plugins to configure this behavior
+    req.headers.__cypress_spec_path = req.params[0]
+    req.url = `${config.devServerPublicPathRoute}/index.html`
+
+    // user the node proxy here instead of the network proxy
+    // to avoid the user accidentally intercepting and modifying
+    // our internal index.html handler
+
+    nodeProxy.web(req, res, {}, (e) => {
+      if (e) {
+        // eslint-disable-next-line
+        debug('Proxy request error. This is likely the socket hangup issue, we can basically ignore this because the stream will automatically continue once the asset will be available', e)
+      }
+    })
+  },
+}

packages/server/lib/controllers/runner.js

@@ -0,0 +1,91 @@
+import _ from 'lodash'
+import type { Response } from 'express'
+import send from 'send'
+import os from 'os'
+import { fs } from '../util/fs'
+import path from 'path'
+import Debug from 'debug'
+import pkg from '@packages/root'
+import { getPathToDist, getPathToIndex, RunnerPkg } from '@packages/resolve-dist'
+import type { InitializeRoutes } from '../routes'
+import type { PlatformName } from '@packages/launcher'
+import type { Cfg } from '../project-base'
+
+const debug = Debug('cypress:server:runner')
+
+const PATH_TO_NON_PROXIED_ERROR = path.join(__dirname, '..', 'html', 'non_proxied_error.html')
+
+const _serveNonProxiedError = (res: Response) => {
+  return fs.readFile(PATH_TO_NON_PROXIED_ERROR)
+  .then((html) => {
+    return res.type('html').end(html)
+  })
+}
+
+export interface ServeOptions extends Pick<InitializeRoutes, 'getSpec' | 'config' | 'getCurrentBrowser' | 'getRemoteState' | 'specsStore'> {
+  testingType: Cypress.TestingType
+}
+
+export const serveRunner = (runnerPkg: RunnerPkg, config: Cfg, res: Response) => {
+  // base64 before embedding so user-supplied contents can't break out of <script>
+  // https://github.com/cypress-io/cypress/issues/4952
+  const base64Config = Buffer.from(JSON.stringify(config)).toString('base64')
+
+  const runnerPath = process.env.CYPRESS_INTERNAL_RUNNER_PATH || getPathToIndex(runnerPkg)
+
+  return res.render(runnerPath, {
+    base64Config,
+    projectName: config.projectName,
+  })
+}
+
+export const runner = {
+  serve (req, res, runnerPkg: RunnerPkg, options: ServeOptions) {
+    if (req.proxiedUrl.startsWith('/')) {
+      debug('request was not proxied via Cypress, erroring %o', _.pick(req, 'proxiedUrl'))
+
+      return _serveNonProxiedError(res)
+    }
+
+    let { config, getRemoteState, getCurrentBrowser, getSpec, specsStore } = options
+
+    config = _.clone(config)
+    // at any given point, rather than just arbitrarily modifying it.
+    // @ts-ignore
+    config.testingType = options.testingType
+
+    // TODO #1: bug. Passing `remote.domainName` breaks CT for unknown reasons.
+    // If you pass a remote object with a domainName key, we get cross-origin
+    // iframe access errors.
+    // repro:
+    // {
+    //    "domainName": "localhost"
+    // }
+    // TODO: Find out what the problem.
+    if (options.testingType === 'e2e') {
+      config.remote = getRemoteState()
+    }
+
+    config.version = pkg.version
+    config.platform = os.platform() as PlatformName
+    config.arch = os.arch()
+    config.spec = getSpec() ?? undefined
+    config.specs = specsStore.specFiles
+    config.browser = getCurrentBrowser()
+
+    debug('serving runner index.html with config %o',
+      _.pick(config, 'version', 'platform', 'arch', 'projectName'))
+
+    // log the env object's keys without values to avoid leaking sensitive info
+    debug('env object has the following keys: %s', _.keys(config.env).join(', '))
+
+    return serveRunner(runnerPkg, config, res)
+  },
+
+  handle (testingType, req, res) {
+    const pathToFile = getPathToDist(testingType === 'e2e' ? 'runner' : 'runner-ct', req.params[0])
+
+    return send(req, pathToFile)
+    .pipe(res)
+  },
+}

packages/server/lib/controllers/runner.ts

@@ -0,0 +1,12 @@
+import send from 'send'
+import type { Request, Response } from 'express'
+import { getPathToDist } from '@packages/resolve-dist'
+
+export const staticCtrl = {
+  handle (req: Request, res: Response) {
+    const pathToFile = getPathToDist('static', req.params[0])
+
+    return send(req, pathToFile)
+    .pipe(res)
+  },
+}