Vitest, the Vite-native testing framework, has released version 4.0, delivering improvements to browser-based testing, visual regression capabilities, and developer experience enhancements.
Vitest 4.0 introduces several major features, including Browser Mode graduating to stable status, built-in visual regression testing support, Playwright Traces integration, and enhanced debugging capabilities. The release also includes breaking changes that require developers to review the migration path before upgrading.
A significant new feature in Vitest 4.0 is the stabilization of Browser Mode, which has been in experimental status since earlier versions. This feature allows developers to run tests in real browsers rather than simulated environments like jsdom or happy-dom, providing more accurate testing results. To use Browser Mode, developers now need to install separate provider packages such as @vitest/browser-playwright, @vitest/browser-webdriverio, or @vitest/browser-preview. This change simplifies working with custom options and eliminates the need for TypeScript reference directives.
The context import location has also changed. Previously imported from @vitest/browser/context, developers should now import from vitest/browser directly, though the old import path will continue working until the next major version for compatibility.
Visual regression testing in Vitest 4.0 can be accomplished through the toMatchScreenshot assertion. Vitest captures screenshots of UI components and pages, then compares them against reference images to detect unintended visual changes. Alongside this feature, Vitest introduces a toBeInViewport matcher that allows developers to check if an element is currently in the viewport using the IntersectionObserver API.
Vitest 4.0 supports generating Playwright Traces for browser tests. Developers can enable tracing by setting the trace option in the test.browser configuration or passing the browser.trace flag with options including on, off, on-first-retry, on-all-retries, and retain-on-failure. The traces are available in reporters as annotations, and can be viewed using the Playwright Trace Viewer.
The vscode extension now supports a Debug Test button when running browser tests, improving the debugging experience. Developers can also start Vitest with the inspect flag when using playwright and webdriverio providers to connect to DevTools manually.
Reporter updates include the removal of the basic reporter, which can be replaced with the default reporter using summary: false. The default reporter now only prints tests in a tree format when running a single test file, while a new tree reporter is available for developers who prefer always seeing tests as a tree. The verbose reporter now consistently prints tests one by one when finished, whereas previously this behaviour only occurred in CI environments.
The community response to Vitest 4.0 has highlighted several key improvements. A Reddit user noted that having visual regression testing natively integrated means one less dependency to manage compared to bolt-on solutions like Percy or Chromatic. The same developer praised the developer experience improvements, stating that watch mode performance has been consistently better than Jest, and that Vitest now feels like a more complete testing solution with features that previously required separate tools.
However, some developers have encountered issues during the upgrade. A recent GitHub issue reports a TypeScript error when using Vitest 4.x with Vite versions 7.1.0 or earlier, despite Vitest 4.x listing vite versions ^6.0.0 or ^7.0.0 as compatible dependencies. The error manifests as a missing createImportMeta property on ModuleRunnerOptions, and only occurs when the vitest.config.ts file is included in the TypeScript context. The issue has been tagged as a minor bug affecting specific usage patterns.
Vitest 4.0 has breaking changes that could affect existing projects. The Vitest team has published a detailed Migration Guide to help developers transition from earlier versions. The complete list of changes is available in the Vitest 4 Changelog on GitHub.
According to the VoidZero blog, Vitest usage has grown from 7 million to 17 million weekly downloads in the past year.
Vitest is an open-source testing framework developed for Vite projects but can be used independently. It provides Jest-compatible APIs including expect, snapshot, and coverage features, with first-class support for ESM, TypeScript, and JSX powered by esbuild.
