Merge branch '10.0-release' into UNIFY-1384-snapshot-pinning

packages/launchpad/cypress/e2e/migration.cy.ts

@@ -232,6 +232,14 @@ describe('Full migration flow for each project', { retries: { openMode: 2, runMo
       cy.contains('cypress/e2e/foo.cy.ts')
       cy.contains('cypress/component/button.cy.js')
 
+      cy.get('[data-cy="migrate-before"]').within(() => {
+        cy.get('.text-red-500').should('contain', 'spec')
+      })
+
+      cy.get('[data-cy="migrate-after"]').within(() => {
+        cy.get('.text-jade-500').should('contain', 'cy')
+      })
+
       cy.findByText('change').click()
 
       cy.get('[data-cy=migration-button-proceed]').click()
@@ -242,6 +250,17 @@ describe('Full migration flow for each project', { retries: { openMode: 2, runMo
 
       cy.findByText('Save Changes').click()
 
+      cy.percySnapshot()
+
+      cy.get('[data-cy="migrate-before"]').within(() => {
+        cy.get('.text-red-500').should('not.contain', 'spec')
+      })
+
+      cy.get('[data-cy="migrate-after"]').within(() => {
+        cy.get('.text-jade-500').should('not.contain', 'cy')
+        cy.get('.text-jade-500').should('not.contain', 'spec')
+      })
+
       cy.findByText('Rename the folder for me').click()
 
       // move component specs later

packages/launchpad/src/migration/RenameSpecsAuto.vue

@@ -55,13 +55,13 @@
     <BeforeAfter>
       <template #before>
         <HighlightedFilesList
-          :files="props.gql.specFiles.map(x => x.before)"
+          :files="specFiles.map(x => x.before)"
           highlight-class="text-red-500"
         />
       </template>
       <template #after>
         <HighlightedFilesList
-          :files="props.gql.specFiles.map(x => x.after)"
+          :files="specFiles.map(x => x.after)"
           highlight-class="text-jade-500"
         />
       </template>
@@ -87,7 +87,7 @@
 </template>
 
 <script lang="ts" setup>
-import { ref } from 'vue'
+import { ref, computed } from 'vue'
 import CodeTag from '@cy/components/CodeTag.vue'
 import BeforeAfter from './fragments/BeforeAfter.vue'
 import HighlightedFilesList from './fragments/HighlightedFilesList.vue'
@@ -100,6 +100,7 @@ import { gql } from '@urql/vue'
 import type { RenameSpecsAutoFragment } from '../generated/graphql'
 import type { PossibleOption } from './types'
 import { useI18n } from '@cy/i18n'
+import _ from 'lodash'
 
 const { t } = useI18n()
 
@@ -113,6 +114,7 @@ fragment RenameSpecsAuto on Migration {
         id
         text
         highlight
+        group
       }
     }
 
@@ -122,6 +124,7 @@ fragment RenameSpecsAuto on Migration {
         id
         text
         highlight
+        group
       }
     }
   }
@@ -144,4 +147,42 @@ function applySkipResult (val: PossibleOption) {
   selectOption.value = val
   emits('selectOption', selectOption.value)
 }
+
+type DeepWriteable<T> = { -readonly [P in keyof T]: DeepWriteable<T[P]> };
+
+type WriteableSpecFile = DeepWriteable<RenameSpecsAutoFragment['specFiles'][number]>
+
+const specFiles = computed(() => {
+  if (selectOption.value !== 'renameFolder') {
+    return props.gql.specFiles
+  }
+
+  return _.cloneDeep(props.gql.specFiles).map((specFile) => {
+    const spec = specFile as WriteableSpecFile
+
+    spec.before.parts = spec.before.parts.map((spec) => {
+      if (spec.group === 'preExtension') {
+        spec.highlight = false
+      }
+
+      return spec
+    })
+
+    const beforePreExtension = _.find(spec.before.parts, { group: 'preExtension' })
+
+    spec.after.parts = spec.after.parts.map((spec) => {
+      if (spec.group === 'preExtension') {
+        spec.highlight = false
+
+        if (beforePreExtension) {
+          spec.text = beforePreExtension.text
+        }
+      }
+
+      return spec
+    })
+
+    return spec
+  })
+})
 </script>