misc: use pnpm add for ct dependency scaffolding (#29056)

Co-authored-by: Jennifer Shehane <[email protected]>

Author: MikeMcC399

cli/CHANGELOG.md

@@ -20,6 +20,7 @@ _Released 3/12/2024 (PENDING)_
 
 **Misc:**
 
+- Changed Component Testing scaffolding instruction to `pnpm add` to add framework dependencies when a project uses pnpm as package manager. Addresses [#29052](https://github.com/cypress-io/cypress/issues/29052).
 - Command messages in the Cypress command logs will now truncate display at 100 lines instead of 50. Fixes [#29023](https://github.com/cypress-io/cypress/issues/29023).
 - Capture the `beforeTest` timestamp inside the browser for the purposes of accurately determining test start for Test Replay. Addressed in [#29061](https://github.com/cypress-io/cypress/pull/29061).
 

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

@@ -31,7 +31,7 @@ export class WizardDataSource {
   async installDependenciesCommand () {
     const commands = {
       'npm': 'npm install -D',
-      'pnpm': 'pnpm install -D',
+      'pnpm': 'pnpm add -D',
       'yarn': 'yarn add -D',
     } as const
 

packages/launchpad/cypress/e2e/project-setup.cy.ts

@@ -581,7 +581,7 @@ describe('Launchpad: Setup Project', () => {
       cy.get('[data-testid="select-framework"]').click()
       cy.findByText('Create React App').click()
       cy.contains('button', 'Next step').should('not.be.disabled').click()
-      cy.findByDisplayValue('pnpm install -D react-scripts react-dom react')
+      cy.findByDisplayValue('pnpm add -D react-scripts react-dom react')
     })
 
     // TODO: Had to revert due to regression: https://github.com/cypress-io/cypress/pull/26452