Revert "chore: remove unused codeGenGlobs (#21438)"

This reverts commit df3ca15.

packages/app/src/specs/CreateSpecModal.cy.tsx

@@ -15,6 +15,11 @@ describe('<CreateSpecModal />', () => {
         gql={{
           currentProject: {
             id: 'id',
+            codeGenGlobs: {
+              id: 'super-unique-id',
+              __typename: 'CodeGenGlobs',
+              component: '**.vue',
+            },
             currentTestingType: 'component',
             configFile: 'cypress.config.js',
             configFileAbsolutePath: '/path/to/cypress.config.js',
@@ -163,6 +168,11 @@ describe('playground', () => {
         gql={{
           currentProject: {
             id: 'id',
+            codeGenGlobs: {
+              id: 'super-unique-id',
+              __typename: 'CodeGenGlobs',
+              component: '**.vue',
+            },
             currentTestingType: 'component',
             configFile: 'cypress.config.js',
             configFileAbsolutePath: '/path/to/cypress.config.js',

packages/app/src/specs/CreateSpecModal.vue

@@ -20,6 +20,7 @@
         v-if="generator"
         :key="`${generator.id}-${iteration}`"
         v-model:title="title"
+        :code-gen-glob="codeGenGlob"
         :gql="props.gql.currentProject"
         :type="props.gql.currentProject?.currentTestingType"
         :spec-file-name="specFileName"
@@ -77,6 +78,10 @@ fragment CreateSpecModal on Query {
     id
     fileExtensionToUse
     defaultSpecFileName
+    codeGenGlobs {
+      id
+      component
+    }
     ...EmptyGenerator
   }
 }
@@ -105,6 +110,14 @@ const specFileName = computed(() => {
   return getPathForPlatform(props.gql.currentProject?.defaultSpecFileName || '')
 })
 
+const codeGenGlob = computed(() => {
+  if (!generator.value) {
+    return null
+  }
+
+  return props.gql.currentProject?.codeGenGlobs[generator.value.id]
+})
+
 const filteredGenerators = getFilteredGeneratorList(props.gql.currentProject?.currentTestingType)
 
 const singleGenerator = computed(() => filteredGenerators.value.length === 1 ? filteredGenerators.value[0] : null)

packages/data-context/package.json

@@ -23,6 +23,7 @@
     "@urql/exchange-graphcache": "4.3.6",
     "chokidar": "3.5.1",
     "common-path-prefix": "3.0.0",
+    "create-cypress-tests": "0.0.0-development",
     "cross-fetch": "^3.1.4",
     "dataloader": "^2.0.0",
     "dayjs": "^1.9.3",

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

@@ -1,6 +1,8 @@
 import os from 'os'
 import chokidar from 'chokidar'
 import type { ResolvedFromConfig, RESOLVED_FROM, FoundSpec, TestingType } from '@packages/types'
+import { WIZARD_FRAMEWORKS } from '@packages/scaffold-config'
+import { scanFSForAvailableDependency } from 'create-cypress-tests'
 import minimatch from 'minimatch'
 import _ from 'lodash'
 import path from 'path'
@@ -478,6 +480,31 @@ export class ProjectDataSource {
     return preferences[projectTitle] ?? null
   }
 
+  private guessFramework (projectRoot: string) {
+    const guess = WIZARD_FRAMEWORKS.find((framework) => {
+      const lookingForDeps = framework.detectors.map((x) => x.package).reduce(
+        (acc, dep) => ({ ...acc, [dep]: '*' }),
+        {},
+      )
+
+      return scanFSForAvailableDependency(projectRoot, lookingForDeps)
+    })
+
+    return guess ?? null
+  }
+
+  async getCodeGenGlobs () {
+    assert(this.ctx.currentProject, `Cannot find glob without currentProject.`)
+
+    const looseComponentGlob = '*.{js,jsx,ts,tsx,.vue}'
+
+    const framework = this.guessFramework(this.ctx.currentProject)
+
+    return {
+      component: framework?.glob ?? looseComponentGlob,
+    }
+  }
+
   async getResolvedConfigFields (): Promise<ResolvedFromConfig[]> {
     const config = this.ctx.lifecycleManager.loadedFullConfig?.resolved ?? {}
 

packages/data-context/test/unit/codegen/code-generator.spec.ts

@@ -1,8 +1,10 @@
 import { parse } from '@babel/parser'
+import { WIZARD_FRAMEWORKS } from '@packages/scaffold-config'
 import { expect } from 'chai'
 import dedent from 'dedent'
 import fs from 'fs-extra'
 import path from 'path'
+import sinon from 'sinon'
 import { DataContext } from '../../../src'
 import {
   Action, codeGenerator, CodeGenResult, CodeGenResults,
@@ -219,6 +221,9 @@ describe('code-generator', () => {
       target,
     }
 
+    // @ts-ignore
+    sinon.stub(ctx.project, 'guessFramework').returns(WIZARD_FRAMEWORKS[0])
+
     const newSpecCodeGenOptions = new SpecOptions(ctx, {
       codeGenPath: path.join(__dirname, 'files', 'react', 'Button.jsx'),
       codeGenType: 'component',
@@ -239,6 +244,9 @@ describe('code-generator', () => {
       target,
     }
 
+    // @ts-ignore
+    sinon.stub(ctx.project, 'guessFramework').returns(WIZARD_FRAMEWORKS[1])
+
     const newSpecCodeGenOptions = new SpecOptions(ctx, {
       codeGenPath: path.join(__dirname, 'files', 'vue', 'Button.vue'),
       codeGenType: 'component',

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

@@ -45,6 +45,11 @@ export const createTestCurrentProject = (title: string, currentProject: Partial<
     ],
     config,
     cloudProject: CloudProjectStubs.componentProject,
+    codeGenGlobs: {
+      id: 'super-unique-id',
+      __typename: 'CodeGenGlobs',
+      component: '**/*.vue',
+    },
     activeBrowser: stubBrowsers[0],
     browsers: stubBrowsers,
     isDefaultSpecPattern: true,

packages/graphql/schemas/schema.graphql

@@ -502,6 +502,14 @@ type CodeFrame {
   line: Int
 }
 
+"""Glob patterns for detecting files for code gen."""
+type CodeGenGlobs implements Node {
+  component: String!
+
+  """Relay style Node ID field for the CodeGenGlobs field"""
+  id: ID!
+}
+
 enum CodeGenType {
   component
   e2e
@@ -543,6 +551,7 @@ type CurrentProject implements Node & ProjectLike {
 
   """List of all code generation candidates stories"""
   codeGenCandidates(glob: String!): [FileParts]
+  codeGenGlobs: CodeGenGlobs!
 
   """Project configuration"""
   config: JSON!

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

@@ -0,0 +1,10 @@
+import { objectType } from 'nexus'
+
+export const CodeGenGlobs = objectType({
+  name: 'CodeGenGlobs',
+  description: 'Glob patterns for detecting files for code gen.',
+  node: 'component',
+  definition (t) {
+    t.nonNull.string('component')
+  },
+})

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

@@ -4,6 +4,7 @@ import path from 'path'
 import { BrowserStatusEnum, FileExtensionEnum } from '..'
 import { TestingTypeEnum } from '../enumTypes/gql-WizardEnums'
 import { Browser } from './gql-Browser'
+import { CodeGenGlobs } from './gql-CodeGenGlobs'
 import { FileParts } from './gql-FileParts'
 import { ProjectPreferences } from './gql-ProjectPreferences'
 import { Spec } from './gql-Spec'
@@ -193,6 +194,11 @@ export const CurrentProject = objectType({
       },
     })
 
+    t.nonNull.field('codeGenGlobs', {
+      type: CodeGenGlobs,
+      resolve: (src, args, ctx) => ctx.project.getCodeGenGlobs(),
+    })
+
     t.list.field('codeGenCandidates', {
       type: FileParts,
       description: 'List of all code generation candidates stories',

packages/graphql/src/schemaTypes/objectTypes/index.ts

@@ -5,6 +5,7 @@ export * from './gql-AuthState'
 export * from './gql-Browser'
 export * from './gql-CachedUser'
 export * from './gql-CodeFrame'
+export * from './gql-CodeGenGlobs'
 export * from './gql-CurrentProject'
 export * from './gql-DevState'
 export * from './gql-Editor'

packages/scaffold-config/src/frameworks.ts

@@ -76,6 +76,7 @@ export const WIZARD_FRAMEWORKS = [
       ]
     },
     codeGenFramework: 'react',
+    glob: '*.{js,jsx,tsx}',
     mountModule: 'cypress/react',
     supportStatus: 'full',
     componentIndexHtml: componentIndexHtmlGenerator(),
@@ -95,6 +96,7 @@ export const WIZARD_FRAMEWORKS = [
       ]
     },
     codeGenFramework: 'vue',
+    glob: '*.vue',
     mountModule: 'cypress/vue2',
     supportStatus: 'full',
     componentIndexHtml: componentIndexHtmlGenerator(),
@@ -114,6 +116,7 @@ export const WIZARD_FRAMEWORKS = [
       ]
     },
     codeGenFramework: 'vue',
+    glob: '*.vue',
     mountModule: 'cypress/vue',
     supportStatus: 'full',
     componentIndexHtml: componentIndexHtmlGenerator(),
@@ -133,6 +136,7 @@ export const WIZARD_FRAMEWORKS = [
       ]
     },
     codeGenFramework: 'react',
+    glob: '*.{js,jsx,tsx}',
     mountModule: 'cypress/react',
     supportStatus: 'alpha',
     /**
@@ -158,6 +162,7 @@ export const WIZARD_FRAMEWORKS = [
       ]
     },
     codeGenFramework: 'vue',
+    glob: '*.vue',
     mountModule: 'cypress/vue2',
     supportStatus: 'alpha',
     componentIndexHtml: componentIndexHtmlGenerator(),
@@ -176,6 +181,7 @@ export const WIZARD_FRAMEWORKS = [
       ]
     },
     codeGenFramework: 'vue',
+    glob: '*.vue',
     mountModule: 'cypress/vue2',
     supportStatus: 'full',
     componentIndexHtml: componentIndexHtmlGenerator(),
@@ -194,6 +200,7 @@ export const WIZARD_FRAMEWORKS = [
       ]
     },
     codeGenFramework: 'vue',
+    glob: '*.vue',
     mountModule: 'cypress/vue',
     supportStatus: 'full',
     componentIndexHtml: componentIndexHtmlGenerator(),
@@ -213,6 +220,7 @@ export const WIZARD_FRAMEWORKS = [
       ]
     },
     codeGenFramework: 'react',
+    glob: '*.{js,jsx,tsx}',
     mountModule: 'cypress/react',
     supportStatus: 'full',
     componentIndexHtml: componentIndexHtmlGenerator(),