@cypress/angular
Mount Angular components in the open source Cypress.io test runner v7.0.0+
Note: This package is bundled with the cypress package and should not need to be installed separately. See the Angular Component Testing Docs for mounting Angular components. Installing and importing mount from @cypress/angular should only be used for advanced use-cases.
Install
- Requires Cypress v7.0.0 or later
- Requires Node version 12 or above
npm install --save-dev @cypress/angular
Run
Open cypress test runner
npx cypress open --component
If you need to run test in CI
npx cypress run --component
For more information, please check the official docs for running Cypress and for component testing.
API
mount is the most important function, allows to mount a given Angular component as a mini web application and interact with it using Cypress commands
MountConfig Configuration used to configure your test
createOutputSpy factory function that creates new EventEmitter for your component and spies on it's emit method.
Examples
import { mount } from '@cypress/angular'
import { HelloWorldComponent } from './hello-world.component'
describe('HelloWorldComponent', () => {
it('works', () => {
mount(HelloWorldComponent)
cy.contains('Hello World!').should('be.visible')
})
})
import { mount } from '@cypress/angular'
import { HelloWorldComponent } from './hello-world.component'
describe('HelloWorldComponent', () => {
it('works', () => {
mount('<app-hello-world></app-hello-world>', {
declarations: [HelloWorldComponent]
})
cy.contains('Hello World!').should('be.visible')
})
})
Look at the examples in cypress-component-testing-apps repo. Here in the angular and angular-standalone folders are the two example applications showing various testing scenarios.
Compatibility
Development
Run yarn build to compile and sync packages to the cypress cli package.
License

This project is licensed under the terms of the MIT license.