chore: add ability to load types from the studio bundle (#31153)

* chore: set up sharing of react via module federation in studio

* chore: add ability to load types from the studio bundle

* fix build

* fix build

* fix build

* PR comments

* Update guides/studio-development.md

Co-authored-by: Matt Schile <mschile@cypress.io>

* fix test

---------

Co-authored-by: Matt Schile <mschile@cypress.io>
This commit is contained in:
Ryan Manuel
2025-02-28 16:30:45 -06:00
committed by GitHub
parent 78b372ae00
commit ffcc6387ef
22 changed files with 180 additions and 112 deletions

View File

@@ -97,8 +97,8 @@ module.exports = async function (params) {
const cloudProtocolFileSource = await getProtocolFileSource(cloudProtocolFilePath)
const projectBaseFilePath = path.join(CY_ROOT_DIR, 'packages/server/lib/project-base.ts')
const projectBaseFileSource = await getStudioFileSource(projectBaseFilePath)
const getAppStudioFilePath = path.join(CY_ROOT_DIR, 'packages/server/lib/cloud/api/get_app_studio.ts')
const getAppStudioFileSource = await getStudioFileSource(getAppStudioFilePath)
const getAndInitializeStudioManagerFilePath = path.join(CY_ROOT_DIR, 'packages/server/lib/cloud/api/get_and_initialize_studio_manager.ts')
const getAndInitializeStudioManagerFileSource = await getStudioFileSource(getAndInitializeStudioManagerFilePath)
await Promise.all([
fs.writeFile(encryptionFilePath, encryptionFileSource),
@@ -106,7 +106,7 @@ module.exports = async function (params) {
fs.writeFile(cloudApiFilePath, cloudApiFileSource),
fs.writeFile(cloudProtocolFilePath, cloudProtocolFileSource),
fs.writeFile(projectBaseFilePath, projectBaseFileSource),
fs.writeFile(getAppStudioFilePath, getAppStudioFileSource),
fs.writeFile(getAndInitializeStudioManagerFilePath, getAndInitializeStudioManagerFileSource),
fs.writeFile(path.join(outputFolder, 'index.js'), binaryEntryPointSource),
])
@@ -120,7 +120,7 @@ module.exports = async function (params) {
validateProtocolFile(cloudApiFilePath),
validateProtocolFile(cloudProtocolFilePath),
validateStudioFile(projectBaseFilePath),
validateStudioFile(getAppStudioFilePath),
validateStudioFile(getAndInitializeStudioManagerFilePath),
])
await flipFuses(

View File

@@ -19,6 +19,7 @@ import { webpackReporter, webpackRunner } from './tasks/gulpWebpack'
import { e2eTestScaffold, e2eTestScaffoldWatch } from './tasks/gulpE2ETestScaffold'
import dedent from 'dedent'
import { ensureCloudValidations, syncCloudValidations } from './tasks/gulpSyncValidations'
import { downloadStudioTypes } from './tasks/gulpCloudDeliveredTypes'
if (process.env.CYPRESS_INTERNAL_VITE_DEV) {
process.env.CYPRESS_INTERNAL_VITE_APP_PORT ??= '3333'
@@ -255,6 +256,8 @@ gulp.task(startCypressWatch)
gulp.task(openCypressApp)
gulp.task(openCypressLaunchpad)
gulp.task(downloadStudioTypes)
// If we want to run individually, for debugging/testing
gulp.task('cyOpenLaunchpadOnly', cyOpenLaunchpad)
gulp.task('cyOpenAppOnly', cyOpenApp)

View File

@@ -0,0 +1,19 @@
process.env.CYPRESS_INTERNAL_ENV = process.env.CYPRESS_INTERNAL_ENV ?? 'production'
import path from 'path'
import fs from 'fs-extra'
import { retrieveAndExtractStudioBundle, studioPath } from '@packages/server/lib/cloud/api/get_and_initialize_studio_manager'
export const downloadStudioTypes = async (): Promise<void> => {
await retrieveAndExtractStudioBundle({ projectId: 'ypt4pf' })
await fs.copyFile(
path.join(studioPath, 'app', 'types.ts'),
path.join(__dirname, '..', '..', '..', 'packages', 'app', 'src', 'studio', 'studio-app-types.ts'),
)
await fs.copyFile(
path.join(studioPath, 'server', 'types.ts'),
path.join(__dirname, '..', '..', '..', 'packages', 'types', 'src', 'studio', 'studio-server-types.ts'),
)
}