Skip to content

Conversation

@scottohara
Copy link
Contributor

@scottohara scottohara commented Nov 11, 2025

Additional details

This change extends the existing experimentalRunAllSpecs config option to support component testing as well as e2e testing, allowing a full suite of component tests to be executed in the Cypress UI with a single click.

By reusing most of the existing experimentalRunAllSpecs machinery, many of files touched by this PR are simply just to relax the previous restriction on it being for e2e testing only.

With this PR, experimentalRunAllSpecs can now be configured at either root level to enable it for both testing types:

import { defineConfig } from 'cypress'

export default defineConfig({
  experimentalRunAllSpecs: true,
  e2e: { ... },
  component: { ... },
}

...or individually for each testing type:

import { defineConfig } from 'cypress'

export default defineConfig({
  e2e: {
    experimentalRunAllSpecs: true,
  },
  component: {
    experimentalRunAllSpecs: true,
  },
}

Description of files changed

  • packages/app/src/store/run-all-specs-store.ts - removed checks on the testing type, allowing both e2e and component
  • packages/config/src/options.ts - removes the option from the breakingRootOptions and testingTypeBreakingOptions arrays, allowing configuration at any level
  • packages/data-context/schemas/schema.graphql - removed the now redundant EXPERIMENTAL_RUN_ALL_SPECS_E2E_ONLY enum
  • packages/errors/src/errors.ts - removed the now redundant EXPERIMENTAL_RUN_ALL_SPECS_E2E_ONLY error
  • packages/errors/test/visualSnapshotErrors.spec.ts - removes the now redundant EXPERIMENTAL_RUN_ALL_SPECS_E2E_ONLY error
  • packages/launchpad/cypress/e2e/config-warning.cy.ts - removed warnings relating to where the option config is allowed

With the above changes, the "Run [n] specs" buttons should now appear in the UI for component testing when the option is configured.

The next set of changes handle how the set of all specs is provided to either webpack-dev-server or vite-dev-server (depending on the bundler used).

Starting with webpack:

  • packages/server/lib/socket-base.ts - was taught to handle the RUN_ALL_SPECS_KEY ("__all"), and pass a set of specs to the CT dev server instead of a single spec
  • npm/webpack-dev-server/src/loader.ts - was also taught to handle ?specPath=__all, allowing all specs to be loaded

Vite was a bit tricker, and to be honest I'm not entirely happy with the implementation, so I would appreciate any feedback on a more robust and less hacky way to do this. For now:

  • packages/data-context/src/sources/HtmlDataSource.ts - sets a new window.__RUN_ALL_SPECS__ property with the list of all specs to run
  • npm/vite-dev-server/client/initCypressTests.js - reads the above list of specs and adds each to the list of imports to load into the dev server

I'm not a regular Cypress contributor, so please do let me know if I have missed anything, if there are any additional tests needed for the above changes, or any improvements can be suggested.

Steps to test

  1. Update your cypress.config.(js|ts) with experimentalRunAllSpecs: true at either the root level or the component level
  2. Open the Cypress UI
  3. Navigate to a project with more than one component spec and start component testing in your browser of choice
  4. Click the "Run [n] specs" button and observe that all specs are run

How has the user experience changed?

image image

PR Tasks


Note

Extends experimentalRunAllSpecs to Component Testing and wires Vite/Webpack dev servers and the app to load/run all specs via __all.

  • Component Testing / Runner:
    • Allow experimentalRunAllSpecs for CT (no longer e2e-only) and enable UI “Run [n] specs” in CT (run-all-specs-store.ts).
  • Dev Servers:
    • Vite: teach client loader to handle specPath=__all and import all specs from window.__RUN_ALL_SPECS__ (initCypressTests.js), with comprehensive tests.
    • Webpack: loader shouldLoad now treats __all as load-all (loader.ts).
    • Server: on CT spec update, if spec is RUN_ALL_SPECS_KEY, compile/update dev server with the full spec set (socket-base.ts).
  • App Bootstrapping:
    • Inject window.__RUN_ALL_SPECS__ alongside __RUN_MODE_SPECS__ in served HTML (HtmlDataSource.ts).
  • Config / Validation / Errors:
    • Remove e2e-only restriction and related schema/error enums/tests (options.ts, schema.graphql, errors.ts, visual error tests, launchpad config warnings cleanup).
  • Changelog:
    • Document feature enabling experimentalRunAllSpecs for Component Testing.

Written by Cursor Bugbot for commit 490dd67. This will update automatically on new commits. Configure here.

@cypress-app-bot
Copy link
Collaborator

@jennifer-shehane
Copy link
Member

@scottohara I'll enable the tests to run, so keep an eye out on the results if anything needs updating.

I'm not quite remembering the blocker for this originally and whether all those blockers are addressed here. It does seem like there should be more test coverage here somehow, but I'll see if someone from our team has ideas on that.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Run All Specs for Component Testing

3 participants