From 2a7876c1481cbc88a618994b5f5c2e04f8087a52 Mon Sep 17 00:00:00 2001 From: Copilot <198982749+Copilot@users.noreply.github.com> Date: Mon, 19 Jan 2026 11:05:13 +0100 Subject: [PATCH 1/7] feat(browser): add `filterNode` option to prettyDOM for filtering browser assertion error output (#9475) Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: sheremet-va <16173870+sheremet-va@users.noreply.github.com> Co-authored-by: Vladimir --- api/browser/context.md | 68 ++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 68 insertions(+) diff --git a/api/browser/context.md b/api/browser/context.md index b16d098e..c2112024 100644 --- a/api/browser/context.md +++ b/api/browser/context.md @@ -231,3 +231,71 @@ export const utils: { getElementError(selector: string, container?: Element): Error } ``` + +### configurePrettyDOM 4.0.0 {#configureprettydom} + +The `configurePrettyDOM` function allows you to configure default options for the `prettyDOM` and `debug` functions. This is useful for customizing how HTML is formatted in test failure messages. + +```ts +import { utils } from 'vitest/browser' + +utils.configurePrettyDOM({ + maxDepth: 3, + filterNode: 'script, style, [data-test-hide]' +}) +``` + +#### Options + +- **`maxDepth`** - Maximum depth to print nested elements (default: `Infinity`) +- **`maxLength`** - Maximum length of the output string (default: `7000`) +- **`filterNode`** - A CSS selector string or function to filter out nodes from the output. When a string is provided, elements matching the selector will be excluded. When a function is provided, it should return `false` to exclude a node. +- **`highlight`** - Enable syntax highlighting (default: `true`) +- And other options from [`pretty-format`](https://www.npmjs.com/package/@vitest/pretty-format) + +#### Filtering with CSS Selectors 4.1.0 {#filtering-with-css-selectors} + +The `filterNode` option allows you to hide irrelevant markup (like scripts, styles, or hidden elements) from test failure messages, making it easier to identify the actual cause of failures. + +```ts +import { utils } from 'vitest/browser' + +// Filter out common noise elements +utils.configurePrettyDOM({ + filterNode: 'script, style, [data-test-hide]' +}) + +// Or use directly with prettyDOM +const html = utils.prettyDOM(element, undefined, { + filterNode: 'script, style' +}) +``` + +**Common Patterns:** + +Filter out scripts and styles: +```ts +utils.configurePrettyDOM({ filterNode: 'script, style' }) +``` + +Hide specific elements with data attributes: +```ts +utils.configurePrettyDOM({ filterNode: '[data-test-hide]' }) +``` + +Hide nested content within an element: +```ts +// Hides all children of elements with data-test-hide-content +utils.configurePrettyDOM({ filterNode: '[data-test-hide-content] *' }) +``` + +Combine multiple selectors: +```ts +utils.configurePrettyDOM({ + filterNode: 'script, style, [data-test-hide], svg' +}) +``` + +::: tip +This feature is inspired by Testing Library's [`defaultIgnore`](https://testing-library.com/docs/dom-testing-library/api-configuration/#defaultignore) configuration. +::: From deeab1ac1a12b9a1043ed4f253db782c0c104af5 Mon Sep 17 00:00:00 2001 From: Leo <38490578+yuyinws@users.noreply.github.com> Date: Mon, 19 Jan 2026 18:07:38 +0800 Subject: [PATCH 2/7] docs: update `vitepress-plugin-group-icons` (#9482) --- .vitepress/config.ts | 7 ------- package.json | 2 +- 2 files changed, 1 insertion(+), 8 deletions(-) diff --git a/.vitepress/config.ts b/.vitepress/config.ts index a553a40e..4bc56195 100644 --- a/.vitepress/config.ts +++ b/.vitepress/config.ts @@ -6,7 +6,6 @@ import { tabsMarkdownPlugin } from 'vitepress-plugin-tabs' import { groupIconMdPlugin, groupIconVitePlugin, - localIconLoader, } from 'vitepress-plugin-group-icons' import llmstxt from 'vitepress-plugin-llms' import { version } from '../../package.json' @@ -80,17 +79,11 @@ export default ({ mode }: { mode: string }) => { groupIconVitePlugin({ customIcon: { 'CLI': 'vscode-icons:file-type-shell', - 'vitest.shims': localIconLoader(import.meta.url, '../public/logo-without-border.svg'), - 'vitest.config': localIconLoader(import.meta.url, '../public/logo-without-border.svg'), - 'vitest.workspace': localIconLoader(import.meta.url, '../public/logo-without-border.svg'), '.spec.ts': 'vscode-icons:file-type-testts', '.test.ts': 'vscode-icons:file-type-testts', '.spec.js': 'vscode-icons:file-type-testjs', '.test.js': 'vscode-icons:file-type-testjs', - 'marko': 'vscode-icons:file-type-marko', - 'qwik': 'logos:qwik-icon', 'next': '', - 'vite.config': localIconLoader(import.meta.url, '../public/logo-without-border-vite.svg'), }, }), llmstxt(), diff --git a/package.json b/package.json index 741600cc..12956431 100644 --- a/package.json +++ b/package.json @@ -34,7 +34,7 @@ "vite": "^6.3.5", "vite-plugin-pwa": "^1.2.0", "vitepress": "2.0.0-alpha.15", - "vitepress-plugin-group-icons": "^1.6.5", + "vitepress-plugin-group-icons": "^1.7.1", "vitepress-plugin-llms": "^1.10.0", "vitepress-plugin-tabs": "^0.7.3", "workbox-window": "^7.4.0" From 5f11cb4f8918560d2b129b35dda04c70aec89f8c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EC=9D=B4=EB=8F=99=EA=B8=B8?= <64388032+MoveRoad@users.noreply.github.com> Date: Mon, 19 Jan 2026 19:09:20 +0900 Subject: [PATCH 3/7] docs: clarify server.deps.fallbackCJS heuristic (#9479) --- config/server.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/config/server.md b/config/server.md index a999b7cf..94a986a2 100644 --- a/config/server.md +++ b/config/server.md @@ -68,6 +68,6 @@ If a `RegExp` is provided, it is matched against the full file path. - **Type:** `boolean` - **Default:** `false` -When a dependency is a valid ESM package, try to guess the cjs version based on the path. This might be helpful, if a dependency has the wrong ESM file. +When enabled, Vitest will try to guess a CommonJS build for an ESM entry by checking a few common CJS/UMD file name and folder patterns (like `.mjs`, `.umd.js`, `.cjs.js`, `umd/`, `cjs/`, `lib/`). -This might potentially cause some misalignment if a package has different logic in ESM and CJS mode. +This is a best-effort heuristic to work around confusing or incorrect ESM/CJS packaging and may not work for all dependencies. From 4d475182f4c4b9abf660a3cba157805da52616ac Mon Sep 17 00:00:00 2001 From: AmirHossein Sakhravi Date: Mon, 19 Jan 2026 13:41:58 +0330 Subject: [PATCH 4/7] feat(cli): add @bomb.sh/tab completions (#8639) Co-authored-by: Vladimir --- guide/cli.md | 43 +++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 43 insertions(+) diff --git a/guide/cli.md b/guide/cli.md index a6e6939e..928709ec 100644 --- a/guide/cli.md +++ b/guide/cli.md @@ -121,6 +121,49 @@ tests/test1.test.ts tests/test2.test.ts ``` +## Shell Autocompletions + +Vitest provides shell autocompletions for commands, options, and option values powered by [`@bomb.sh/tab`](https://github.com/bombshell-dev/tab). + +### Setup + +For permanent setup in zsh, add this to your `~/.zshrc`: + +```bash +# Add to ~/.zshrc for permanent autocompletions (same can be done for other shells) +source <(vitest complete zsh) +``` + +### Package Manager Integration + +`@bomb.sh/tab` integrates with [package managers](https://github.com/bombshell-dev/tab?tab=readme-ov-file#package-manager-completions). Autocompletions work when running vitest directly: + +::: code-group + +```bash [npm] +npm vitest +``` + +```bash [npm] +npm exec vitest +``` + +```bash [pnpm] +pnpm vitest +``` + +```bash [yarn] +yarn vitest +``` + +```bash [bun] +bun vitest +``` + +::: + +For package manager autocompletions, you should install [tab's package manager completions](https://github.com/bombshell-dev/tab?tab=readme-ov-file#package-manager-completions) separately. + ## Options ::: tip From 859948151f5ba2b073798691c36e1e4457e6cc66 Mon Sep 17 00:00:00 2001 From: Hiroshi Ogawa Date: Mon, 19 Jan 2026 19:16:20 +0900 Subject: [PATCH 5/7] feat(browser): support playwright persistent context (#9229) Co-authored-by: Claude Opus 4.5 Co-authored-by: Vladimir --- config/browser/playwright.md | 32 ++++++++++++++++++++++++++++++++ 1 file changed, 32 insertions(+) diff --git a/config/browser/playwright.md b/config/browser/playwright.md index 1e7fb0de..e4fb154c 100644 --- a/config/browser/playwright.md +++ b/config/browser/playwright.md @@ -104,3 +104,35 @@ await userEvent.click(page.getByRole('button'), { timeout: 1_000, }) ``` + +## `persistentContext` 4.1.0 {#persistentcontext} + +- **Type:** `boolean | string` +- **Default:** `false` + +When enabled, Vitest uses Playwright's [persistent context](https://playwright.dev/docs/api/class-browsertype#browser-type-launch-persistent-context) instead of a regular browser context. This allows browser state (cookies, localStorage, DevTools settings, etc.) to persist between test runs. + +::: warning +This option is ignored when running tests in parallel (e.g. when headless with [`fileParallelism`](/config/fileparallelism) enalbed) since persistent context cannot be shared across parallel sessions. +::: + +- When set to `true`, the user data is stored in `./node_modules/.cache/vitest-playwright-user-data` +- When set to a string, the value is used as the path to the user data directory + +```ts [vitest.config.js] +import { playwright } from '@vitest/browser-playwright' +import { defineConfig } from 'vitest/config' + +export default defineConfig({ + test: { + browser: { + provider: playwright({ + persistentContext: true, + // or specify a custom directory: + // persistentContext: './my-browser-data', + }), + instances: [{ browser: 'chromium' }], + }, + }, +}) +``` From c3770fdd2f2292516556e37837b0e61e818edbd6 Mon Sep 17 00:00:00 2001 From: noise Date: Wed, 21 Jan 2026 00:26:34 +0800 Subject: [PATCH 6/7] docs(cn): dissolve the conflict --- api/browser/context.md | 2 ++ config/browser/playwright.md | 2 ++ guide/cli.md | 8 +++----- 3 files changed, 7 insertions(+), 5 deletions(-) diff --git a/api/browser/context.md b/api/browser/context.md index b5cf4deb..2daa222d 100644 --- a/api/browser/context.md +++ b/api/browser/context.md @@ -186,6 +186,8 @@ export const server: { } ``` + + ## `utils` Utility functions useful for custom render libraries. diff --git a/config/browser/playwright.md b/config/browser/playwright.md index 5d140f8c..cdbceeca 100644 --- a/config/browser/playwright.md +++ b/config/browser/playwright.md @@ -105,6 +105,8 @@ await userEvent.click(page.getByRole('button'), { }) ``` + + ## `persistentContext` 4.1.0 {#persistentcontext} - **Type:** `boolean | string` diff --git a/guide/cli.md b/guide/cli.md index 17697cde..52acef2a 100644 --- a/guide/cli.md +++ b/guide/cli.md @@ -123,9 +123,8 @@ tests/test1.test.ts tests/test2.test.ts ``` -<<<<<<< HEAD -## 选项 {#options} -======= + + ## Shell Autocompletions Vitest provides shell autocompletions for commands, options, and option values powered by [`@bomb.sh/tab`](https://github.com/bombshell-dev/tab). @@ -169,8 +168,7 @@ bun vitest For package manager autocompletions, you should install [tab's package manager completions](https://github.com/bombshell-dev/tab?tab=readme-ov-file#package-manager-completions) separately. -## Options ->>>>>>> 859948151f5ba2b073798691c36e1e4457e6cc66 +## 选项 {#options} ::: tip Vitest 支持 CLI 参数的 both camel case 和 kebab case 。例如，`--passWithNoTests` 和 `--pass-with-no-tests` 都有效（`--no-color` 和 `--inspect-brk` 是例外）。 From cde3a8b0fc372f1f87552a1b631408d3cd42cf9e Mon Sep 17 00:00:00 2001 From: noise Date: Wed, 21 Jan 2026 00:31:36 +0800 Subject: [PATCH 7/7] chore: update packages --- pnpm-lock.yaml | 18 +++++++++--------- todo.md | 31 ------------------------------- 2 files changed, 9 insertions(+), 40 deletions(-) delete mode 100644 todo.md diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 80a9a517..8f410a81 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -88,8 +88,8 @@ importers: specifier: 2.0.0-alpha.15 version: 2.0.0-alpha.15(@algolia/client-search@5.46.2)(@types/node@25.0.3)(change-case@5.4.4)(jiti@2.6.1)(lightningcss@1.30.2)(postcss@8.5.6)(react@19.2.3)(search-insights@2.17.3)(terser@5.44.1)(tsx@4.21.0)(typescript@5.9.3)(yaml@2.8.2) vitepress-plugin-group-icons: - specifier: ^1.6.5 - version: 1.6.5(vite@7.3.1(@types/node@25.0.3)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2)) + specifier: ^1.7.1 + version: 1.7.1(vite@7.3.1(@types/node@25.0.3)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2)) vitepress-plugin-llms: specifier: ^1.10.0 version: 1.10.0 @@ -1084,8 +1084,8 @@ packages: '@iconify-json/simple-icons@1.2.65': resolution: {integrity: sha512-v/O0UeqrDz6ASuRVE5g2Puo5aWyej4M/CxX6WYDBARgswwxK0mp3VQbGgPFEAAUU9QN02IjTgjMuO021gpWf2w==} - '@iconify-json/vscode-icons@1.2.37': - resolution: {integrity: sha512-HLRdU6nZks4N8x3JYz6j+b3+hcUCvYvlTLwGzM3xyXfTJyDSA2cAdWcEXfoA4hQMJGA+zCDSPAWFelFptH5Kbw==} + '@iconify-json/vscode-icons@1.2.40': + resolution: {integrity: sha512-Q7JIWAxENwmcRg4EGRY+u16gBwrAj6mWeuSmuyuPvNvoTJHh8Ss8qoeDhrFYNgtWqNkzH5hSf4b2T9XLK5MsrA==} '@iconify/types@2.0.0': resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==} @@ -4629,8 +4629,8 @@ packages: yaml: optional: true - vitepress-plugin-group-icons@1.6.5: - resolution: {integrity: sha512-+pg4+GKDq2fLqKb1Sat5p1p4SuIZ5tEPxu8HjpwoeecZ/VaXKy6Bdf0wyjedjaTAyZQzXbvyavJegqAcQ+B0VA==} + vitepress-plugin-group-icons@1.7.1: + resolution: {integrity: sha512-3ZPcIqwHNBg1btrOOSecOqv8yJxHdu3W2ugxE5LusclDF005LAm60URMEmBQrkgl4JvM32AqJirqghK6lGIk8g==} peerDependencies: vite: '>=3' peerDependenciesMeta: @@ -5996,7 +5996,7 @@ snapshots: dependencies: '@iconify/types': 2.0.0 - '@iconify-json/vscode-icons@1.2.37': + '@iconify-json/vscode-icons@1.2.40': dependencies: '@iconify/types': 2.0.0 @@ -10060,10 +10060,10 @@ snapshots: tsx: 4.21.0 yaml: 2.8.2 - vitepress-plugin-group-icons@1.6.5(vite@7.3.1(@types/node@25.0.3)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2)): + vitepress-plugin-group-icons@1.7.1(vite@7.3.1(@types/node@25.0.3)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2)): dependencies: '@iconify-json/logos': 1.2.10 - '@iconify-json/vscode-icons': 1.2.37 + '@iconify-json/vscode-icons': 1.2.40 '@iconify/utils': 3.1.0 optionalDependencies: vite: 7.3.1(@types/node@25.0.3)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2) diff --git a/todo.md b/todo.md deleted file mode 100644 index fbaf505c..00000000 --- a/todo.md +++ /dev/null @@ -1,31 +0,0 @@ -# Remove UnoCSS - Migration Complete - -UnoCSS was causing OOM in CI. Removed entirely and replaced with `@iconify/vue` + plain CSS. - -## Summary - -- Removed UnoCSS plugin from `vite.config.ts` -- Removed `uno.css` import from `theme/index.ts` -- Added `@iconify/vue` for icons -- Converted all UnoCSS utilities to scoped CSS - -## Completed - -- [x] `vite.config.ts` - removed UnoCSS plugin -- [x] `theme/index.ts` - removed `import 'uno.css'` -- [x] `CRoot.vue` - @iconify/vue + CSS -- [x] `ListItem.vue` - @iconify/vue + CSS (spinner, checkmark, close icons) -- [x] `CourseLink.vue` - @iconify/vue + CSS -- [x] `FeaturesList.vue` - plain CSS -- [x] `Advanced.vue` - plain CSS -- [x] `Experimental.vue` - plain CSS - -## Test pages - -- `/guide/features` - FeaturesList, ListItem, CourseLink -- `/config/projects` - CRoot -- `/api/advanced/vitest` - Experimental - -## Not used (skipped) - -- `HomePage.vue` - not used in new theme