cypress-io/cypress · error · Error

cy.visit from a component spec is not allowed

Error message

cy.visit from a component spec is not allowed

What it means

Thrown by @cypress/mount-utils setupHooks, which overwrites the `visit` command during component testing (testingType === 'component'). In CT the AUT iframe already hosts the mounted component; calling cy.visit would navigate away, destroy the mounted DOM and React/Vue state, and is semantically meaningless. The overwrite unconditionally throws whenever the command is invoked.

Source

Thrown at npm/mount-utils/src/index.ts:34

}

/**
 * Utility function to register CT side effects and run cleanup code during the "test:before:run" Cypress hook
 * @param optionalCallback Callback to be called before the next test runs
 */
export function setupHooks (optionalCallback?: Function) {
  // We don't want CT side effects to run when e2e
  // testing so we early return.
  // System test to verify CT side effects do not pollute e2e: system-tests/test/e2e_with_mount_import_spec.ts
  if (Cypress.testingType !== 'component') {
    return
  }

  // When running component specs, we cannot allow "cy.visit"
  // because it will wipe out our preparation work, and does not make much sense
  // thus we overwrite "cy.visit" to throw an error
  Cypress.Commands.overwrite('visit', () => {
    throw new Error(
      'cy.visit from a component spec is not allowed',
    )
  })

  Cypress.Commands.overwrite('session', () => {
    throw new Error(
      'cy.session from a component spec is not allowed',
    )
  })

  Cypress.Commands.overwrite('origin', () => {
    throw new Error(
      'cy.origin from a component spec is not allowed',
    )
  })

  // @ts-ignore
  Cypress.on('test:before:after:run:async', () => {

View on GitHub (pinned to 0d85fdc912)

Solutions

1. Remove the cy.visit call from the component spec — CT does not navigate, it mounts.
2. If you need to set route state, mock it via cy.intercept or pass props to the mounted component instead.
3. Move any cy.visit usage to an e2e spec (testingType='e2e') where it belongs.
4. If the visit is in a shared support file, gate it behind `if (Cypress.testingType === 'e2e')`.

Example fix

// before (component spec)
beforeEach(() => { cy.visit('/dashboard') })
it('shows widget', () => { cy.mount(<Dashboard/>) })
// after
it('shows widget', () => { cy.mount(<Dashboard user={{name:'Sam'}}/>) })

// never call cy.visit in CT specs; gate shared helpers
if (Cypress.testingType === 'e2e') { cy.visit(url) }

const isE2E = (): boolean => Cypress.testingType === 'e2e'

When it happens

Trigger: Calling `cy.visit(url)` inside a component spec (a *.cy.{tsx,jsx,vue,...} file run with testingType='component'). The guard fires only after setupHooks has run, which happens for every CT run.

Common situations: Copy-pasting an e2e pattern into a component spec; testing a component that loads external routes and forgetting CT mounts the component directly; a shared support file imported by both e2e and CT specs that calls visit.

Related errors

• cy.session from a component spec is not allowed
• cy.origin from a component spec is not allowed
• [@cypress/react] 🔥 Hmm, cannot find root element to mount t
• Could not find a project with projectType "application" in "
• Your Cypress devServer config is missing a required webpackC

AI-assisted analysis of cypress-io/cypress@0d85fdc912 (2026-08-12). Data as JSON: /api/errors/d9a127c7aa5272d9. Report an issue: GitHub.