@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 commandsMountConfig
Configuration used to configure your testcreateOutputSpy
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
@cypress/angular | cypress |
---|
>= v1 | >= v10.5 |
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.