From 1c385e0d424f4c5ee50541626a6af994dcb45b49 Mon Sep 17 00:00:00 2001 From: Mike Plummer Date: Fri, 31 Mar 2023 16:00:12 -0500 Subject: [PATCH] fix: Detect CT framework when unconfigured project opened with `--component` (#26306) Co-authored-by: Ryan Manuel --- cli/CHANGELOG.md | 1 + .../src/actions/ProjectActions.ts | 4 +++ .../src/data/ProjectLifecycleManager.ts | 25 +++++++++++--- .../schemaTypes/objectTypes/gql-Mutation.ts | 12 +------ .../launchpad/cypress/e2e/open-mode.cy.ts | 33 ++++++++++++++----- 5 files changed, 52 insertions(+), 23 deletions(-) diff --git a/cli/CHANGELOG.md b/cli/CHANGELOG.md index 079fcd0db276..85e2cf6c665e 100644 --- a/cli/CHANGELOG.md +++ b/cli/CHANGELOG.md @@ -6,6 +6,7 @@ _Released 04/11/2023 (PENDING)_ **Bugfixes:** - Capture the [Azure](https://azure.microsoft.com/) CI provider's environment variable [`SYSTEM_PULLREQUEST_PULLREQUESTNUMBER`](https://learn.microsoft.com/en-us/azure/devops/pipelines/build/variables?view=azure-devops&tabs=yaml#system-variables-devops-services) to display the linked PR number in the Cloud. Addressed in [#26215](https://github.com/cypress-io/cypress/pull/26215). + - Fixed an issue in the onboarding wizard where project framework & bundler would not be auto-detected when opening directly into component testing mode using the `--component` CLI flag. Fixes [#22777](https://github.com/cypress-io/cypress/issues/22777). **Dependency Updates:** diff --git a/packages/data-context/src/actions/ProjectActions.ts b/packages/data-context/src/actions/ProjectActions.ts index a0d0e887dd61..e0f52325c0b1 100644 --- a/packages/data-context/src/actions/ProjectActions.ts +++ b/packages/data-context/src/actions/ProjectActions.ts @@ -130,6 +130,10 @@ export class ProjectActions { this.ctx.lifecycleManager.setAndLoadCurrentTestingType(type) } + async initializeProjectSetup (type: TestingType) { + await this.ctx.lifecycleManager.initializeProjectSetup(type) + } + async setCurrentProject (projectRoot: string) { await this.updateProjectList(() => this.api.insertProjectToCache(projectRoot)) diff --git a/packages/data-context/src/data/ProjectLifecycleManager.ts b/packages/data-context/src/data/ProjectLifecycleManager.ts index f163e804143a..fdce2f5c1fa0 100644 --- a/packages/data-context/src/data/ProjectLifecycleManager.ts +++ b/packages/data-context/src/data/ProjectLifecycleManager.ts @@ -752,10 +752,27 @@ export class ProjectLifecycleManager { if (this._projectRoot && testingType && await this.waitForInitializeSuccess()) { this.setAndLoadCurrentTestingType(testingType) - if (testingType === 'e2e' && !this.ctx.migration.needsCypressJsonMigration() && !this.isTestingTypeConfigured(testingType)) { - // E2E doesn't have a wizard, so if we have a testing type on load we just create/update their cypress.config.js. - await this.ctx.actions.wizard.scaffoldTestingType() - } + await this.initializeProjectSetup(testingType) + } + } + + /** + * Prepare the setup process for a project if one exists, otherwise complete setup + * + * @param testingType + * @returns + */ + async initializeProjectSetup (testingType: TestingType) { + if (this.isTestingTypeConfigured(testingType)) { + return + } + + if (testingType === 'e2e' && !this.ctx.migration.needsCypressJsonMigration()) { + // E2E doesn't have a wizard, so if we have a testing type on load we just create/update their cypress.config.js. + await this.ctx.actions.wizard.scaffoldTestingType() + } else if (testingType === 'component') { + await this.ctx.actions.wizard.detectFrameworks() + await this.ctx.actions.wizard.initialize() } } diff --git a/packages/graphql/src/schemaTypes/objectTypes/gql-Mutation.ts b/packages/graphql/src/schemaTypes/objectTypes/gql-Mutation.ts index 9da9fe8c3724..058f9e01e1e5 100644 --- a/packages/graphql/src/schemaTypes/objectTypes/gql-Mutation.ts +++ b/packages/graphql/src/schemaTypes/objectTypes/gql-Mutation.ts @@ -178,17 +178,7 @@ export const mutation = mutationType({ resolve: async (source, args, ctx) => { ctx.actions.project.setAndLoadCurrentTestingType(args.testingType) - // if necessary init the wizard for configuration - if (ctx.coreData.currentTestingType && !ctx.lifecycleManager.isTestingTypeConfigured(ctx.coreData.currentTestingType)) { - // Component Testing has a wizard to help users configure their project - if (ctx.coreData.currentTestingType === 'component') { - await ctx.actions.wizard.detectFrameworks() - await ctx.actions.wizard.initialize() - } else { - // E2E doesn't have such a wizard, we just create/update their cypress.config.js. - await ctx.actions.wizard.scaffoldTestingType() - } - } + await ctx.actions.project.initializeProjectSetup(args.testingType) return {} }, diff --git a/packages/launchpad/cypress/e2e/open-mode.cy.ts b/packages/launchpad/cypress/e2e/open-mode.cy.ts index cf813aabeede..6cf172032231 100644 --- a/packages/launchpad/cypress/e2e/open-mode.cy.ts +++ b/packages/launchpad/cypress/e2e/open-mode.cy.ts @@ -109,14 +109,31 @@ describe('Launchpad: Open Mode', () => { }) }) - it('goes to component test onboarding when launched with --component and not configured', () => { - cy.scaffoldProject('launchpad') - cy.openProject('launchpad', ['--component']) - cy.visitLaunchpad() - cy.skipWelcome() - cy.get('[data-cy=header-bar-content]').contains('component testing', { matchCase: false }) - // Component testing is not configured for the todo project - cy.get('h1').should('contain', 'Project setup') + describe('when launched with --component and not configured', () => { + beforeEach(() => { + cy.scaffoldProject('react-vite-ts-unconfigured') + cy.openProject('react-vite-ts-unconfigured', ['--component']) + cy.visitLaunchpad() + cy.skipWelcome() + }) + + it('goes to component test onboarding', () => { + cy.get('[data-cy=header-bar-content]').contains('component testing', { matchCase: false }) + // Component testing is not configured for the todo project + cy.get('h1').should('contain', 'Project setup') + }) + + it('detects CT project framework', () => { + cy.get('[data-testid="select-framework"]').within(() => { + cy.contains('React.js').should('be.visible') + cy.contains('(detected)').should('be.visible') + }) + + cy.get('[data-testid="select-bundler"]').within(() => { + cy.contains('Vite').should('be.visible') + cy.contains('(detected)').should('be.visible') + }) + }) }) // since circle cannot have firefox installed by default,