misc: Remove 'Alternatively you can use CommonJS syntax' comment from scaffolded component supportFile (#30738)

* Remove 'Alternatively you can use CommonJS syntax' comment from scaffolded ct supportFile

* changelog entry

cli/CHANGELOG.md

@@ -9,6 +9,10 @@ _Released 12/17/2024 (PENDING)_
 - Updated Firefox `userChrome.css` to correctly hide the toolbox during headless mode. Addresses [#30721](https://github.com/cypress-io/cypress/issues/30721).
 - Fixed an issue loading the `cypress.config.ts` file with Node.js version `22.12.0`. Addresses [#30715](https://github.com/cypress-io/cypress/issues/30715).
 
+**Misc:**
+
+- Removed a comment from the scaffolded `supportFile` for component tests around CommonJS syntax. Addresses [#23287](https://github.com/cypress-io/cypress/issues/23287).
+
 **Dependency Updates:**
 
 - Updated `chai` from `4.2.0` to `4.5.0`. Addressed in [#30737](https://github.com/cypress-io/cypress/pull/30737).

packages/driver/cypress/support/e2e.js

@@ -1,18 +1 @@
-// ***********************************************************
-// This example support/e2e.js is processed and
-// loaded automatically before your other test files.
-//
-// This is a great place to put global configuration and
-// behavior that modifies Cypress.
-//
-// You can change the location of this file or turn off
-// automatically serving support files with the
-// 'supportFile' configuration option.
-//
-// You can read more here:
-// https://on.cypress.io/guides/configuration#section-global
-// ***********************************************************
-
-// Alternatively you can use CommonJS syntax:
-// require("./commands")
 require('./defaults')

packages/scaffold-config/src/supportFile.ts

@@ -20,9 +20,6 @@ export function supportFileE2E (language: CodeLanguage['type']) {
 
     // Import commands.js using ES2015 syntax:
     import './commands'
-
-    // Alternatively you can use CommonJS syntax:
-    // require('./commands')
   `
 }
 
@@ -45,9 +42,6 @@ export function supportFileComponent (language: CodeLanguage['type'], mountModul
 
     // Import commands.js using ES2015 syntax:
     import './commands'
-
-    // Alternatively you can use CommonJS syntax:
-    // require('./commands')
   `
 
   const exampleUse = dedent`

packages/scaffold-config/test/unit/supportFile.spec.ts

@@ -27,9 +27,6 @@ describe('supportFileComponent', () => {
           // Import commands.js using ES2015 syntax:
           import './commands'
 
-          // Alternatively you can use CommonJS syntax:
-          // require('./commands')
-
           import { mount } from '${mountModule}'
 
           Cypress.Commands.add('mount', mount)
@@ -61,9 +58,6 @@ describe('supportFileComponent', () => {
         // Import commands.js using ES2015 syntax:
         import './commands'
 
-        // Alternatively you can use CommonJS syntax:
-        // require('./commands')
-
         import { mount } from '${mountModule}'
 
         // Augment the Cypress namespace to include type definitions for
@@ -111,9 +105,6 @@ describe('supportFileComponent', () => {
           // Import commands.js using ES2015 syntax:
           import './commands'
 
-          // Alternatively you can use CommonJS syntax:
-          // require('./commands')
-
           import { mount } from '${mountModule}'
 
           Cypress.Commands.add('mount', mount)
@@ -145,9 +136,6 @@ describe('supportFileComponent', () => {
         // Import commands.js using ES2015 syntax:
         import './commands'
 
-        // Alternatively you can use CommonJS syntax:
-        // require('./commands')
-
         import { mount } from '${mountModule}'
 
         // Augment the Cypress namespace to include type definitions for
@@ -195,9 +183,6 @@ describe('supportFileComponent', () => {
         // Import commands.js using ES2015 syntax:
         import './commands'
 
-        // Alternatively you can use CommonJS syntax:
-        // require('./commands')
-
         import { mount } from '${mountModule}'
 
         // Augment the Cypress namespace to include type definitions for
@@ -244,9 +229,6 @@ describe('supportFileComponent', () => {
           // Import commands.js using ES2015 syntax:
           import './commands'
 
-          // Alternatively you can use CommonJS syntax:
-          // require('./commands')
-
           import { mount } from 'cypress/svelte'
 
           Cypress.Commands.add('mount', mount)
@@ -278,9 +260,6 @@ describe('supportFileComponent', () => {
         // Import commands.js using ES2015 syntax:
         import './commands'
 
-        // Alternatively you can use CommonJS syntax:
-        // require('./commands')
-
         import { mount } from 'cypress/svelte'
 
         // Augment the Cypress namespace to include type definitions for

system-tests/projects/angular-cli-configured/cypress/support/component.ts

@@ -16,9 +16,6 @@
 // Import commands.js using ES2015 syntax:
 import './commands'
 
-// Alternatively you can use CommonJS syntax:
-// require('./commands')
-
 import { mount } from 'cypress/angular'
 
 // Augment the Cypress namespace to include type definitions for

system-tests/projects/config-with-invalid-browser/cypress/support/e2e.js

@@ -15,6 +15,3 @@
 
 // Import commands.js using ES2015 syntax:
 import './commands'
-
-// Alternatively you can use CommonJS syntax:
-// require('./commands')

system-tests/projects/migration-e2e-custom-supportFile/src/platform/testing/e2e/cypress/support/index.js

@@ -15,6 +15,3 @@
 
 // Import commands.js using ES2015 syntax:
 import './commands'
-
-// Alternatively you can use CommonJS syntax:
-// require('./commands')

system-tests/projects/no-specs-vue-2/cypress/support/component.js

@@ -16,9 +16,6 @@
 // Import commands.js using ES2015 syntax:
 import './commands'
 
-// Alternatively you can use CommonJS syntax:
-// require('./commands')
-
 import { mount } from 'cypress/vue2'
 
 Cypress.Commands.add('mount', mount)

system-tests/projects/no-specs/cypress/support/component.js

@@ -16,9 +16,6 @@
 // Import commands.js using ES2015 syntax:
 import './commands'
 
-// Alternatively you can use CommonJS syntax:
-// require('./commands')
-
 import { mount } from 'cypress/react'
 
 Cypress.Commands.add('mount', mount)

system-tests/projects/plugin-code-coverage/cypress/support/e2e.js

@@ -15,5 +15,3 @@
 
 // Import commands.js using ES2015 syntax:
 import '@cypress/code-coverage/support'
-// Alternatively you can use CommonJS syntax:
-// require('./commands')

system-tests/projects/plugin-returns-bad-config/cypress/support/e2e.js

@@ -15,6 +15,3 @@
 
 // Import commands.js using ES2015 syntax:
 import './commands'
-
-// Alternatively you can use CommonJS syntax:
-// require('./commands')

system-tests/projects/plugin-returns-empty-browsers-list/cypress/support/e2e.js

@@ -15,6 +15,3 @@
 
 // Import commands.js using ES2015 syntax:
 import './commands'
-
-// Alternatively you can use CommonJS syntax:
-// require('./commands')

system-tests/projects/plugin-returns-invalid-browser/cypress/support/e2e.js

@@ -15,6 +15,3 @@
 
 // Import commands.js using ES2015 syntax:
 import './commands'
-
-// Alternatively you can use CommonJS syntax:
-// require('./commands')

system-tests/projects/pristine-cjs-project/expected-cypress-js-component-vue.js-3-webpack/support/component.js

@@ -16,9 +16,6 @@
 // Import commands.js using ES2015 syntax:
 import './commands'
 
-// Alternatively you can use CommonJS syntax:
-// require('./commands')
-
 import { mount } from 'cypress/vue'
 
 Cypress.Commands.add('mount', mount)

system-tests/projects/pristine-module/expected-cypress-js-e2e/cypress/support/e2e.js

@@ -15,6 +15,3 @@
 
 // Import commands.js using ES2015 syntax:
 import './commands'
-
-// Alternatively you can use CommonJS syntax:
-// require('./commands')

system-tests/projects/pristine/expected-cypress-js-component-create-react-app-v5/cypress/support/component.js

@@ -16,9 +16,6 @@
 // Import commands.js using ES2015 syntax:
 import './commands'
 
-// Alternatively you can use CommonJS syntax:
-// require('./commands')
-
 import { mount } from 'cypress/react'
 
 Cypress.Commands.add('mount', mount)

system-tests/projects/pristine/expected-cypress-js-e2e-without-fixtures/cypress/support/e2e.js

@@ -15,6 +15,3 @@
 
 // Import commands.js using ES2015 syntax:
 import './commands'
-
-// Alternatively you can use CommonJS syntax:
-// require('./commands')

system-tests/projects/pristine/expected-cypress-js-e2e/cypress/support/e2e.js

@@ -15,6 +15,3 @@
 
 // Import commands.js using ES2015 syntax:
 import './commands'
-
-// Alternatively you can use CommonJS syntax:
-// require('./commands')

system-tests/projects/pristine/expected-cypress-ts-component-create-react-app-v5-without-fixtures/cypress/support/component.ts

@@ -15,6 +15,3 @@
 
 // Import commands.js using ES2015 syntax:
 import './commands'
-
-// Alternatively you can use CommonJS syntax:
-// require('./commands')

system-tests/projects/pristine/expected-cypress-ts-component-create-react-app-v5/cypress/support/component.ts

@@ -16,9 +16,6 @@
 // Import commands.js using ES2015 syntax:
 import './commands'
 
-// Alternatively you can use CommonJS syntax:
-// require('./commands')
-
 import { mount } from 'cypress/react'
 
 // Augment the Cypress namespace to include type definitions for

system-tests/projects/pristine/expected-cypress-ts-e2e/cypress/support/e2e.ts

@@ -15,6 +15,3 @@
 
 // Import commands.js using ES2015 syntax:
 import './commands'
-
-// Alternatively you can use CommonJS syntax:
-// require('./commands')

system-tests/projects/ts-proj-4-5/cypress/support/e2e.ts

@@ -15,6 +15,3 @@
 
 // Import commands.js using ES2015 syntax:
 // import './commands'
-
-// Alternatively you can use CommonJS syntax:
-// require('./commands')

system-tests/projects/ts-proj-5/cypress/support/e2e.ts

@@ -15,6 +15,3 @@
 
 // Import commands.js using ES2015 syntax:
 // import './commands'
-
-// Alternatively you can use CommonJS syntax:
-// require('./commands')

system-tests/projects/ts-proj/cypress/support/e2e.ts

@@ -15,6 +15,3 @@
 
 // Import commands.js using ES2015 syntax:
 import './commands'
-
-// Alternatively you can use CommonJS syntax:
-// require('./commands')