feat: Create default config file (#18943)

Author: estrada9166

packages/data-context/src/actions/FileActions.ts

@@ -25,4 +25,14 @@ export class FileActions {
 
     await this.ctx.fs.remove(path.join(this.ctx.currentProject?.projectRoot, relativePath))
   }
+
+  async checkIfFileExists (relativePath: string) {
+    if (!this.ctx.currentProject) {
+      throw new Error(`Cannot check file in project exists without active project`)
+    }
+
+    const filePath = path.join(this.ctx.currentProject?.projectRoot, relativePath)
+
+    return await this.ctx.fs.stat(filePath)
+  }
 }

packages/data-context/src/actions/ProjectActions.ts

@@ -1,4 +1,4 @@
-import type { CodeGenType, MutationAddProjectArgs, MutationAppCreateConfigFileArgs, MutationSetProjectPreferencesArgs, TestingTypeEnum } from '@packages/graphql/src/gen/nxs.gen'
+import type { CodeGenType, MutationAddProjectArgs, MutationSetProjectPreferencesArgs, TestingTypeEnum } from '@packages/graphql/src/gen/nxs.gen'
 import type { FindSpecs, FoundBrowser, FoundSpec, FullConfig, LaunchArgs, LaunchOpts, OpenProjectLaunchOptions, Preferences, SettingsOptions } from '@packages/types'
 import path from 'path'
 import type { ActiveProjectShape, ProjectShape } from '../data/coreDataShape'
@@ -62,22 +62,38 @@ export class ProjectActions {
     await this.clearActiveProject()
 
     // Set initial properties, so we can set the config object on the active project
-    this.setCurrentProjectProperties({
+    await this.setCurrentProjectProperties({
       projectRoot,
       title,
       ctPluginsInitialized: false,
       e2ePluginsInitialized: false,
       config: null,
       configChildProcess: null,
-    })
-
-    this.setCurrentProjectProperties({
-      isCTConfigured: await this.ctx.project.isTestingTypeConfigured(projectRoot, 'component'),
-      isE2EConfigured: await this.ctx.project.isTestingTypeConfigured(projectRoot, 'e2e'),
+      isMissingConfigFile: false,
       preferences: await this.ctx.project.getProjectPreferences(title),
     })
 
-    return this
+    try {
+      // read the config and cache it
+      await this.ctx.project.getConfig(projectRoot)
+
+      this.setCurrentProjectProperties({
+        isCTConfigured: await this.ctx.project.isTestingTypeConfigured(projectRoot, 'component'),
+        isE2EConfigured: await this.ctx.project.isTestingTypeConfigured(projectRoot, 'e2e'),
+      })
+
+      return this
+    } catch (error: any) {
+      if (error.type === 'NO_DEFAULT_CONFIG_FILE_FOUND') {
+        this.setCurrentProjectProperties({
+          isMissingConfigFile: true,
+        })
+
+        return this
+      }
+
+      throw error
+    }
   }
 
   // Temporary: remove after other refactor lands
@@ -277,14 +293,29 @@ export class ProjectActions {
     //
   }
 
-  createConfigFile (args: MutationAppCreateConfigFileArgs) {
+  async createConfigFile (type?: 'component' | 'e2e' | null) {
     const project = this.ctx.currentProject
 
     if (!project) {
       throw Error(`Cannot create config file without currentProject.`)
     }
 
-    this.ctx.fs.writeFileSync(path.resolve(project.projectRoot, args.configFilename), args.code)
+    let obj: { [k: string]: object } = {
+      e2e: {},
+      component: {},
+    }
+
+    if (type) {
+      obj = {
+        [type]: {},
+      }
+    }
+
+    await this.ctx.fs.writeFile(path.resolve(project.projectRoot, 'cypress.config.js'), `module.exports = ${JSON.stringify(obj, null, 2)}`)
+
+    this.setCurrentProjectProperties({
+      isMissingConfigFile: false,
+    })
   }
 
   async clearLatestProjectCache () {

packages/data-context/src/data/coreDataShape.ts

@@ -51,6 +51,7 @@ export interface ActiveProjectShape extends ProjectShape {
   configChildProcess?: ConfigChildProcessShape | null
   preferences?: Preferences | null
   browsers: FoundBrowser[] | null
+  isMissingConfigFile: boolean
 }
 
 export interface AppDataShape {

packages/data-context/src/sources/ProjectDataSource.ts

@@ -88,21 +88,29 @@ export class ProjectDataSource {
   }
 
   async isTestingTypeConfigured (projectRoot: string, testingType: 'e2e' | 'component') {
-    const config = await this.getConfig(projectRoot)
+    try {
+      const config = await this.getConfig(projectRoot)
 
-    if (!config) {
-      return true
-    }
+      if (!config) {
+        return true
+      }
 
-    if (testingType === 'e2e') {
-      return Boolean(Object.keys(config.e2e ?? {}).length)
-    }
+      if (testingType === 'e2e') {
+        return Boolean(Object.keys(config.e2e ?? {}).length)
+      }
 
-    if (testingType === 'component') {
-      return Boolean(Object.keys(config.component ?? {}).length)
-    }
+      if (testingType === 'component') {
+        return Boolean(Object.keys(config.component ?? {}).length)
+      }
 
-    return false
+      return false
+    } catch (error: any) {
+      if (error.type === 'NO_DEFAULT_CONFIG_FILE_FOUND') {
+        return false
+      }
+
+      throw error
+    }
   }
 
   async getProjectPreferences (projectTitle: string) {

packages/frontend-shared/cypress/support/mock-graphql/stubgql-Mutation.ts

@@ -18,12 +18,6 @@ export const stubMutation: MaybeResolver<Mutation> = {
 
     return true
   },
-  appCreateConfigFile: (source, args, ctx) => {
-    ctx.wizard.chosenManualInstall = true
-    ctx.wizard.canNavigateForward = true
-
-    return true
-  },
   clearActiveProject (source, args, ctx) {
     ctx.currentProject = null
 

packages/graphql/schemas/schema.graphql

@@ -456,9 +456,6 @@ type Mutation {
 
   """Create an Index HTML file for a new component testing project"""
   appCreateComponentIndexHtml(template: String!): Boolean
-
-  """Create a Cypress config file for a new project"""
-  appCreateConfigFile(code: String!, configFilename: String!): Boolean
   clearActiveProject: Boolean
 
   """

packages/graphql/src/schemaTypes/objectTypes/gql-Mutation.ts

@@ -84,12 +84,16 @@ export const mutation = mutationType({
         })),
       },
       resolve: async (_, args, ctx) => {
+        if (ctx.coreData.currentProject?.isMissingConfigFile) {
+          await ctx.actions.project.createConfigFile(args.input.testingType)
+        }
+
         if (args.input.testingType) {
-          await ctx.actions.wizard.setTestingType(args.input.testingType)
+          ctx.actions.wizard.setTestingType(args.input.testingType)
         }
 
         if (args.input.direction) {
-          await ctx.actions.wizard.navigate(args.input.direction)
+          ctx.actions.wizard.navigate(args.input.direction)
         }
       },
     })
@@ -133,17 +137,6 @@ export const mutation = mutationType({
       },
     })
 
-    t.liveMutation('appCreateConfigFile', {
-      args: {
-        code: nonNull('String'),
-        configFilename: nonNull('String'),
-      },
-      description: 'Create a Cypress config file for a new project',
-      resolve: async (_, args, ctx) => {
-        await ctx.actions.project.createConfigFile(args)
-      },
-    })
-
     t.liveMutation('appCreateComponentIndexHtml', {
       args: {
         template: nonNull('String'),

packages/launchpad/cypress/e2e/integration/config-files-error-handling.spec.ts

@@ -1,16 +1,14 @@
 describe('Config files error handling', () => {
-  beforeEach(() => {
+  it('it handles multiples config files', () => {
     cy.setupE2E('pristine-with-config-file')
     cy.visitLaunchpad()
-  })
 
-  it('it handles multiples config files', () => {
+    cy.get('[data-cy-testingType=e2e]').click()
+
     cy.withCtx(async (ctx) => {
       await ctx.actions.file.writeFileInProject('cypress.config.ts', 'export default {}')
     })
 
-    cy.get('[data-cy-testingType=e2e]').click()
-
     cy.get('body').should('contain.text', 'Configuration Files')
 
     cy.get('button').contains('Continue').click()
@@ -28,13 +26,16 @@ describe('Config files error handling', () => {
   })
 
   it('it handles legacy config file', () => {
+    cy.setupE2E('pristine-with-config-file')
+    cy.visitLaunchpad()
+
+    cy.get('[data-cy-testingType=e2e]').click()
+
     cy.withCtx(async (ctx) => {
       await ctx.actions.file.writeFileInProject('cypress.json', '{}')
       await ctx.actions.file.removeFileInProject('cypress.config.js')
     })
 
-    cy.get('[data-cy-testingType=e2e]').click()
-
     cy.get('body').should('contain.text', 'Configuration Files')
 
     cy.get('button').contains('Continue').click()
@@ -62,12 +63,15 @@ describe('Config files error handling', () => {
   })
 
   it('it handles config files with legacy config file in same project', () => {
+    cy.setupE2E('pristine-with-config-file')
+    cy.visitLaunchpad()
+
+    cy.get('[data-cy-testingType=e2e]').click()
+
     cy.withCtx(async (ctx) => {
       await ctx.actions.file.writeFileInProject('cypress.json', '{}')
     })
 
-    cy.get('[data-cy-testingType=e2e]').click()
-
     cy.get('body').should('contain.text', 'Configuration Files')
 
     cy.get('button').contains('Continue').click()
@@ -84,4 +88,22 @@ describe('Config files error handling', () => {
     cy.get('body')
     .should('not.contain.text', 'Cypress Configuration Error')
   })
+
+  it('creates config file if it do not exist', () => {
+    cy.setupE2E('pristine')
+    cy.visitLaunchpad()
+
+    cy.get('[data-cy-testingType=e2e]').click()
+
+    cy.get('body').should('contain.text', 'Configuration Files')
+
+    cy.get('button').contains('Continue').click()
+
+    cy.get('body')
+    .should('contain.text', 'Initializing Config')
+
+    cy.withCtx(async (ctx) => {
+      await ctx.actions.file.checkIfFileExists('cypress.config.js')
+    })
+  })
 })