Menu

Post image 1
Post image 2
1 / 2
0

Using Cypress Component Testing with Angular and Vite

DEV Community·Brandon Roberts·18 days ago
#yYMI4eV9
Reading 0:00
15s threshold

Cypress is an end-to-end and component testing framework that runs tests in a real browser. Cypress component testing supports both Webpack and Vite as its dev server bundler. This guide configures an existing Cypress component testing setup in an Angular project to use Cypress's Vite bundler support instead of Webpack. Installing the Vite plugin First, install @analogjs/vite-plugin-angular as a dev dependency so Vite can compile Angular components: npm install @analogjs/vite-plugin-angular --save-dev Enter fullscreen mode Exit fullscreen mode Configuring Cypress Next, Update cypress.config.ts at the project root to use the Vite bundler: import { defineConfig } from ' cypress ' ; import angular from ' @analogjs/vite-plugin-angular ' ; export default defineConfig ({ component : { devServer : { bundler : ' vite ' , // @ts-expect-error Cypress's public types do not yet pair `bundler: 'vite'` // with `framework: 'angular'`.…

Continue reading — create a free account

Join HashtagPLUS to read full articles, follow hashtags, vote, and join the conversation.

Read More