fix: remove create spec from story (#20876)

packages/app/cypress/e2e/specs.cy.ts

@@ -455,177 +455,6 @@ describe('App: Index', () => {
     viewportHeight: 768,
     viewportWidth: 1024,
   }, () => {
-    context('project with storybook', () => {
-      beforeEach(() => {
-        cy.scaffoldProject('no-specs')
-        cy.openProject('no-specs')
-        cy.startAppServer('component')
-        cy.visitApp()
-
-        // With no specs present, the page renders two cards, one for creating from found components,
-        // another for creating from found stories.
-        cy.findAllByTestId('card').eq(0).as('ComponentCard')
-        .within(() => {
-          cy.findByRole('button', {
-            name: defaultMessages.createSpec.component.importFromComponent.header,
-          }).should('be.visible')
-          .and('not.be.disabled')
-
-          cy.contains(defaultMessages.createSpec.component.importFromComponent.description)
-          .should('be.visible')
-        })
-
-        cy.findAllByTestId('card').eq(1).as('StoryCard')
-        .within(() => {
-          cy.findByRole('button', {
-            name: defaultMessages.createSpec.component.importFromStory.header,
-          }).should('be.visible')
-          .and('not.be.disabled')
-
-          cy.contains(defaultMessages.createSpec.component.importFromStory.description)
-          .should('be.visible')
-        })
-      })
-
-      it('shows create first spec page with create from component and create from story options', () => {
-        cy.findByRole('heading', {
-          level: 1,
-          name: defaultMessages.createSpec.page.defaultPatternNoSpecs.title,
-        }).should('be.visible')
-
-        cy.findByTestId('create-spec-page-description')
-        .should('be.visible')
-        .and('contain', defaultMessages.createSpec.page.defaultPatternNoSpecs.component.description)
-
-        cy.get('@ComponentCard').should('be.visible')
-        cy.get('@StoryCard').should('be.visible')
-
-        cy.findByTestId('no-specs-message')
-        .should('be.visible')
-        .and('contain', defaultMessages.createSpec.noSpecsMessage)
-
-        cy.findByRole('button', { name: defaultMessages.createSpec.viewSpecPatternButton })
-        .should('be.visible')
-        .and('not.be.disabled')
-        .click()
-
-        cy.findByRole('dialog', {
-          name: defaultMessages.components.specPatternModal.title,
-        }).should('be.visible').within(() => {
-          cy.validateExternalLink({ name: 'Need help', href: 'https://on.cypress.io/test-type-options' })
-          cy.findByRole('button', { name: 'Close' }).should('be.visible').as('CloseDialogButton')
-          cy.get('[data-cy="file-match-indicator"]').contains('0 Matches')
-          cy.get('[data-cy="spec-pattern"]').contains('**/*.cy.{js,jsx,ts,tsx}')
-        })
-
-        cy.get('@CloseDialogButton').click()
-        cy.findByRole('dialog').should('not.exist')
-      })
-
-      context('create from story', () => {
-        beforeEach(() => {
-          cy.get('@StoryCard').click()
-
-          cy.findByRole('dialog', {
-            name: defaultMessages.createSpec.component.importFromStory.header,
-          }).as('CreateFromStoryDialog')
-
-          cy.findByRole('button', { name: 'Close' }).as('DialogCloseButton')
-        })
-
-        it('shows story dialog that can be dismissed with Close (x) button press', () => {
-          cy.get('@DialogCloseButton').click()
-          cy.findByRole('dialog').should('not.exist')
-        })
-
-        it('shows input for file extension filter', () => {
-          cy.get('@CreateFromStoryDialog').within(() => {
-            cy.findByTestId('file-match-indicator').should('contain', '1 Match')
-            cy.percySnapshot('Create from story generator')
-            cy.findByRole('button', { name: '*.stories.*' }).click()
-            cy.percySnapshot('File list search dropdown')
-            cy.findByPlaceholderText(defaultMessages.components.fileSearch.byExtensionInput)
-            .as('ExtensionInput')
-            .clear()
-            .type('foobar')
-
-            cy.findByTestId('file-match-indicator').should('contain', 'No Matches')
-            cy.percySnapshot('No Results')
-
-            cy.findByTestId('no-results-clear').click()
-
-            cy.get('@ExtensionInput').should('have.value', '*.stories.*')
-
-            cy.findByTestId('file-match-indicator').should('contain', '1 Match')
-          })
-        })
-
-        it('shows input for file name filter', () => {
-          cy.get('@CreateFromStoryDialog').within(() => {
-            cy.findByLabelText('file-name-input').as('FileNameInput')
-            .should('have.value', '')
-
-            cy.findByTestId('file-match-indicator').should('contain', '1 Match')
-
-            cy.get('@FileNameInput')
-            .type('foobar')
-
-            cy.findByTestId('file-match-indicator').should('contain', 'No Matches')
-
-            cy.findByTestId('no-results-clear').click()
-
-            cy.findByTestId('file-match-indicator').should('contain', '1 Match')
-
-            cy.get('@FileNameInput')
-            .type('Button.stories.jsx')
-
-            cy.findByTestId('file-match-indicator').should('contain', '1 of 1 Matches')
-            cy.percySnapshot()
-          })
-        })
-
-        it('shows success modal when spec is created from story', () => {
-          cy.get('@CreateFromStoryDialog').within(() => {
-            cy.findAllByTestId('file-list-row').eq(0).as('NewSpecFile')
-
-            // TODO: assert visibility of secondary text on hover/focus when
-            // item is made keyboard accessible
-            // https://cypress-io.atlassian.net/browse/UNIFY-864
-            // cy.get('@NewSpecFile).focus()
-            // cy.findByText('src/stories/Button.stories.jsx').should('be.visible')
-
-            cy.get('@NewSpecFile').click()
-          })
-
-          cy.percySnapshot()
-
-          cy.findByRole('dialog', {
-            name: defaultMessages.createSpec.successPage.header,
-          }).as('SuccessDialog').within(() => {
-            cy.findByRole('button', { name: 'Close' }).should('be.visible')
-            cy.contains(getPathForPlatform('src/stories/Button.stories.cy.jsx')).should('be.visible')
-
-            cy.findByRole('link', { name: 'Okay, run the spec' })
-            .should('have.attr', 'href', `#/${getRunnerHref('src/stories/Button.stories.cy.jsx')}`)
-
-            cy.findByRole('button', { name: 'Create another spec' }).click()
-          })
-
-          // 'Create a new spec' dialog presents with options when user indicates they want to create
-          // another spec.
-          cy.findByRole('dialog', {
-            name: defaultMessages.createSpec.newSpecModalTitle,
-          }).within(() => {
-            cy.findAllByTestId('card').eq(0)
-
-            // the storybook card remains enabled here
-            cy.contains('button', defaultMessages.createSpec.component.importFromStory.header)
-            .should('not.be.disabled')
-          })
-        })
-      })
-    })
-
     context('project without storybook', () => {
       beforeEach(() => {
         cy.scaffoldProject('no-specs-no-storybook')
@@ -646,17 +475,6 @@ describe('App: Index', () => {
           cy.contains(defaultMessages.createSpec.component.importFromComponent.description)
           .should('be.visible')
         })
-
-        cy.findAllByTestId('card').eq(1).as('StoryCard')
-        .within(() => {
-          cy.findByRole('button', {
-            name: defaultMessages.createSpec.component.importFromStory.header,
-          }).should('be.visible')
-          .and('be.disabled')
-
-          cy.contains(defaultMessages.createSpec.component.importFromStory.notSetupDescription)
-          .should('be.visible')
-        })
       })
 
       it('shows create first spec page with create from component option', () => {
@@ -669,7 +487,6 @@ describe('App: Index', () => {
         .and('contain', defaultMessages.createSpec.page.defaultPatternNoSpecs.component.description)
 
         cy.get('@ComponentCard').should('be.visible')
-        cy.get('@StoryCard').should('be.visible')
 
         cy.findByTestId('no-specs-message').should('be.visible')
         .and('contain', defaultMessages.createSpec.noSpecsMessage)
@@ -767,10 +584,6 @@ describe('App: Index', () => {
           // another spec.
           cy.findByRole('dialog', { name: defaultMessages.createSpec.newSpecModalTitle }).within(() => {
             cy.findAllByTestId('card').eq(0)
-
-            // the storybook card remains disabled here
-            cy.contains('button', defaultMessages.createSpec.component.importFromStory.header)
-            .should('be.disabled')
           })
         })
 
@@ -901,9 +714,6 @@ describe('App: Index', () => {
         cy.findByRole('dialog', { name: defaultMessages.createSpec.newSpecModalTitle }).within(() => {
           cy.findAllByTestId('card').eq(0)
           .and('contain', defaultMessages.createSpec.component.importFromComponent.description)
-
-          cy.findAllByTestId('card').eq(1)
-          .and('contain', defaultMessages.createSpec.component.importFromStory.description)
         })
       })
 
@@ -954,36 +764,6 @@ describe('App: Index', () => {
           }).should('have.attr', 'href', `#/${getRunnerHref('src/specs-folder/MyTest.cy.jsx')}`)
         })
       })
-
-      it('shows create first spec page with create from story option', () => {
-        cy.findByRole('button', { name: 'New Spec', exact: false }).click()
-
-        cy.findByRole('dialog', { name: defaultMessages.createSpec.newSpecModalTitle }).within(() => {
-          cy.findAllByTestId('card').eq(1)
-          .and('contain', defaultMessages.createSpec.component.importFromStory.description).click()
-        })
-
-        cy.get('[data-cy=file-list-row]').first().click()
-
-        cy.get('input').invoke('val').should('eq', getPathForPlatform('src/stories/Button.stories.cy.jsx'))
-        cy.contains(defaultMessages.createSpec.component.importEmptySpec.header)
-        cy.contains(defaultMessages.createSpec.component.importEmptySpec.invalidComponentWarning)
-        cy.get('input').clear()
-        cy.contains(defaultMessages.createSpec.component.importEmptySpec.invalidComponentWarning).should('not.exist')
-        cy.contains('button', defaultMessages.createSpec.createSpec).should('be.disabled')
-
-        cy.get('input').clear().type(getPathForPlatform('src/specs-folder/Button.stories.cy.jsx'))
-        cy.contains('button', defaultMessages.createSpec.createSpec).should('not.be.disabled').click()
-        cy.contains('h2', defaultMessages.createSpec.successPage.header)
-
-        cy.get('[data-cy="file-row"]').contains(getPathForPlatform('src/specs-folder/Button.stories.cy.jsx')).click()
-
-        cy.findByRole('dialog', { name: defaultMessages.createSpec.successPage.header }).as('SuccessDialog').within(() => {
-          cy.findByRole('link', {
-            name: 'Okay, run the spec',
-          }).should('have.attr', 'href', `#/${getRunnerHref('src/specs-folder/Button.stories.cy.jsx')}`)
-        })
-      })
     })
 
     describe('Code Generation', () => {
@@ -1033,30 +813,6 @@ describe('App: Index', () => {
           expect(spec).to.exist
         }, { path: getPathForPlatform('src/stories/Button.cy.jsx') })
       })
-
-      it('should generate spec from story', () => {
-        cy.findByTestId('new-spec-button').click()
-
-        cy.contains('Create from story').click()
-        const storyGlob = '*.stories.*'
-
-        cy.findByTestId('file-match-button').contains(storyGlob)
-        cy.percySnapshot('Story Generator')
-        checkCodeGenCandidates(['Button.stories.jsx'])
-
-        cy.contains('Button.stories.jsx').click()
-        cy.findByTestId('file-row').contains(getPathForPlatform('src/stories/Button.stories.cy.js')).click()
-        cy.contains('composeStories')
-        cy.contains('ExampleWithLongName')
-        cy.percySnapshot('Story Generator Success')
-
-        cy.withCtx(async (ctx, o) => {
-          const spec = (await ctx.project.findSpecs(ctx.currentProject ?? '', 'component', ['**/*.cy.jsx'], [], []))
-          .find((spec) => spec.relative === o.path)
-
-          expect(spec).to.exist
-        }, { path: getPathForPlatform('src/stories/Button.stories.cy.jsx') })
-      })
     })
   })
 })

packages/app/cypress/e2e/specs_list_component.cy.ts

@@ -33,7 +33,6 @@ describe('App: Spec List (Component)', () => {
     cy.get('[data-cy="new-spec-button"]').click()
     cy.get('[data-cy="standard-modal"]').get('h2').contains('Create a new spec')
     cy.get('button').contains('Create from component').should('be.visible')
-    cy.get('button').contains('Create from story').should('be.visible')
     cy.get('button').get('[aria-label="Close"]').click()
     cy.get('[data-cy="standard-modal"]').should('not.exist')
   })

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

@@ -21,7 +21,6 @@ describe('<CreateSpecModal />', () => {
               id: 'super-unique-id',
               __typename: 'CodeGenGlobs',
               component: '**.vue',
-              story: '**/*.stories.*',
             },
             storybook: null,
             currentTestingType: 'component',
@@ -91,7 +90,6 @@ describe('playground', () => {
               id: 'super-unique-id',
               __typename: 'CodeGenGlobs',
               component: '**.vue',
-              story: '**/*.stories.*',
             },
             storybook: null,
             currentTestingType: 'component',

packages/app/src/specs/CreateSpecModal.vue

@@ -73,7 +73,6 @@ fragment CreateSpecModal on Query {
     defaultSpecFileName
     ...EmptyGenerator
     ...ComponentGeneratorStepOne_codeGenGlob
-    ...StoryGeneratorStepOne_codeGenGlob
   }
 }
 `

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

@@ -46,8 +46,6 @@ describe('<NoSpecsPage />', { viewportHeight: 655, viewportWidth: 1032 }, () =>
 
       cy.contains(text.importFromComponent.header).should('be.visible')
       cy.contains(text.importFromComponent.description).should('be.visible')
-      cy.contains(text.importFromStory.header).should('be.visible')
-      cy.contains(text.importFromStory.notSetupDescription).should('be.visible')
       cy.percySnapshot()
     })
   })

packages/app/src/specs/generators/EmptyGenerator.vue

@@ -118,7 +118,7 @@ import PlusButtonIcon from '~icons/cy/add-large_x16.svg'
 const props = defineProps<{
   title: string
   gql: EmptyGeneratorFragment
-  type: 'e2e' | 'component' | 'story'
+  type: 'e2e' | 'component'
   specFileName: string
   erroredCodegenCandidate?: string
 }>()

packages/app/src/specs/generators/GeneratorsCommon.tsx

@@ -1,6 +1,6 @@
-import type { TestingTypeEnum } from '../../generated/graphql'
+import type { TestingType } from '@packages/types'
 
 export const filters = {
-  matchesCT: (testingType: TestingTypeEnum) => testingType === 'component',
-  matchesE2E: (testingType: TestingTypeEnum) => testingType === 'e2e',
+  matchesCT: (testingType?: TestingType | null) => testingType === 'component',
+  matchesE2E: (testingType?: TestingType | null) => testingType === 'e2e',
 }

packages/app/src/specs/generators/index.ts

@@ -1,7 +1,6 @@
 import { keyBy } from 'lodash'
 import type { SpecGenerator, GeneratorId } from './types'
 import { ComponentGenerator } from './component'
-import { StoryGenerator } from './story'
 import { ScaffoldGenerator } from './scaffold'
 import { EmptyGenerator } from './empty'
 
@@ -11,15 +10,12 @@ export * from './GeneratorsCommon'
 
 export * from './component'
 
-export * from './story'
-
 export * from './scaffold'
 
 export * from './empty'
 
 export const generatorList: SpecGenerator[] = [
   ComponentGenerator,
-  StoryGenerator,
   ScaffoldGenerator,
   EmptyGenerator,
 ]