Comparaciones con otros Ejecutores de Pruebas

Jest

Jest ha sido un referente en el panorama de los frameworks de pruebas, ofreciendo soporte inmediato para la mayoría de los proyectos JavaScript, una API intuitiva (it y expect) y un conjunto completo de características (capturas, simulaciones, cobertura) que cubren las necesidades de la mayoría de las configuraciones. Agradecemos al equipo y a la comunidad de Jest por crear una API de pruebas amigable y por promover muchos de los patrones de prueba que ahora son estándar en el ecosistema web.

Es posible usar Jest en proyectos Vite. @sodatea ha desarrollado vite-jest, que busca proporcionar una integración de primera clase de Vite para Jest. Una vez resueltos los últimos inconvenientes en Jest, se presenta como una opción válida para tus pruebas unitarias.

Sin embargo, en un entorno donde Vite ofrece soporte para las herramientas web más comunes (TypeScript, JSX, los frameworks de UI más populares), Jest puede representar una complejidad innecesaria. Si tu aplicación está impulsada por Vite, la necesidad de configurar y mantener dos pipelines diferentes podría no ser justificable. Con Vitest, puedes definir la configuración para tus entornos de desarrollo, construcción y prueba en un único pipeline, compartiendo los mismos plugins y el mismo vite.config.js.

Incluso si tu librería no utiliza Vite (por ejemplo, si está construida con esbuild o Rollup), Vitest es una opción interesante, ya que ofrece una ejecución más rápida para tus pruebas unitarias y una mejor Experiencia de Desarrollador (DX) gracias al modo de vigilancia predeterminado que utiliza la Recarga de Módulo en Caliente (HMR) instantánea de Vite. Vitest ofrece compatibilidad con la mayoría de la API de Jest y las librerías del ecosistema, por lo que, en la mayoría de los proyectos, debería ser un reemplazo compatible para Jest.

Cypress

Cypress es un ejecutor de pruebas basado en navegador y una herramienta complementaria a Vitest. Si deseas utilizar Cypress, te sugerimos que uses Vitest para toda la lógica headless en tu aplicación y Cypress para la lógica basada en el navegador.

Cypress es conocido como una herramienta de pruebas de extremo a extremo, pero su nuevo ejecutor de pruebas de componentes ofrece un gran soporte para probar componentes de Vite y es una opción ideal para probar cualquier elemento que se renderice en un navegador.

Los ejecutores de pruebas basados en navegador, como Cypress, WebdriverIO y Web Test Runner, detectarán problemas que Vitest no puede, porque utilizan el navegador real y las API del navegador real.

El ejecutor de pruebas de Cypress se centra en determinar si los elementos son visibles, accesibles e interactivos. Cypress está diseñado específicamente para el desarrollo y las pruebas de la interfaz de usuario, y su DX se centra en las pruebas de componentes visuales. Puedes ver tu componente renderizado junto con el informe de pruebas. Una vez que la prueba se completa, el componente permanece interactivo y puedes depurar cualquier fallo que ocurra utilizando las herramientas de desarrollo de tu navegador.

En contraste, Vitest se centra en ofrecer la mejor DX posible para pruebas headless ultrarrápidas. Los ejecutores basados en Node como Vitest admiten varios entornos de navegador implementados parcialmente, como jsdom, que implementan lo suficiente para que puedas probar rápidamente cualquier código que haga referencia a las API del navegador. La desventaja es que estos entornos de navegador tienen limitaciones en lo que pueden implementar. Por ejemplo, jsdom carece de varias características como window.navigation o un motor de diseño (offsetTop, etc.).

Por último, en comparación con Web Test Runner, el ejecutor de pruebas de Cypress se asemeja más a un IDE que a un simple ejecutor de pruebas, ya que también puedes ver el componente renderizado real en el navegador, junto con sus resultados de prueba y registros.

Cypress también se ha integrado con Vite en sus productos: reconstruyendo la interfaz de usuario de su aplicación utilizando Vitesse y utilizando Vite como herramienta de desarrollo.

Creemos que Cypress no es una buena opción para las pruebas unitarias de código headless, pero que el uso de Cypress (para pruebas E2E y de componentes) y Vitest (para pruebas unitarias) satisfaría las necesidades de pruebas de tu aplicación.

WebdriverIO

WebdriverIO es, similar a Cypress, un ejecutor de pruebas alternativo basado en navegador y una herramienta complementaria a Vitest. Se puede utilizar como una herramienta de pruebas end-to-end, así como para probar componentes web. Incluso utiliza componentes de Vitest internamente, por ejemplo, para simulación y sustitución dentro de las pruebas de componentes.

WebdriverIO ofrece las mismas ventajas que Cypress, permitiéndote probar tu lógica directamente en un navegador real. Sin embargo, utiliza estándares web reales para la automatización, lo que supera algunas de las desventajas y limitaciones al ejecutar pruebas en Cypress. Además, te permite ejecutar pruebas también en dispositivos móviles, ampliando las posibilidades de prueba de tu aplicación a más entornos.

Web Test Runner

@web/test-runner ejecuta pruebas dentro de un navegador sin interfaz gráfica, proporcionando el mismo entorno de ejecución que tu aplicación web sin la necesidad de simular las API del navegador o el DOM. Esto también permite la depuración en un navegador real utilizando las herramientas de desarrollo, aunque no se muestra ninguna interfaz de usuario para recorrer la prueba, como ocurre en las pruebas de Cypress. Dispone de un modo de vigilancia, pero no es tan preciso como el de Vitest, y podría no volver a ejecutar siempre las pruebas deseadas. Para utilizar @web/test-runner con un proyecto de Vite, utiliza @remcovaes/web-test-runner-vite-plugin. @web/test-runner no incluye librerías de aserción o simulación, por lo que su adición es responsabilidad del usuario.

uvu

uvu es un ejecutor de pruebas para Node.js y el navegador. Ejecuta las pruebas en un solo hilo, lo que implica que las pruebas no están aisladas y pueden generar conflictos entre archivos. Vitest, sin embargo, utiliza hilos de trabajo para aislar las pruebas y ejecutarlas en paralelo. Para transformar tu código, uvu se basa en require y los hooks de carga. Vitest utiliza Vite, por lo que los archivos se transforman con toda la potencia del sistema de plugins de Vite. Dado que Vite ofrece soporte para las herramientas web más comunes (TypeScript, JSX, los frameworks de UI más populares), uvu podría representar una complejidad innecesaria. Si tu aplicación está impulsada por Vite, la necesidad de configurar y mantener dos pipelines diferentes podría no ser justificable. uvu no proporciona un modo de vigilancia inteligente para volver a ejecutar las pruebas modificadas, mientras que Vitest ofrece una excelente DX gracias a su modo de vigilancia predeterminado, que utiliza la Recarga de Módulo en Caliente (HMR) instantánea de Vite. uvu es una opción rápida para ejecutar pruebas simples, pero Vitest puede ser más rápido y más confiable para pruebas y proyectos más complejos.