Registry / testing / jest-serializer-vue-tjw

jest-serializer-vue-tjw

library4.0.0jsnpmunverified

jest-serializer-vue-tjw is a Jest snapshot serializer specifically designed to make Vue component snapshots more readable and maintainable by normalizing HTML output. It handles common issues like attribute ordering, inline functions, and various `data-` attributes that can cause unnecessary snapshot churn. The package is currently at version 4.0.0, but this version primarily serves as a deprecation notice. The library is no longer actively maintained and has been replaced by `vue3-snapshot-serializer`. While `jest-serializer-vue-tjw` supported both Vue 2 and Vue 3 (with some caveats for the latter), its replacement is Vue 3-only and introduces several new features and improved configuration options. Users are advised to migrate to `vue3-snapshot-serializer` for new projects or Vue 3 codebases, or to pin this library to `3.x.x` if they must remain on Vue 2.

testing

npm install jest-serializer-vue-tjw

github ↗package ↗

INSTALL

IMPORT

SIG · JEST-SERIALIZER-VU

jest-serializer-vue-tjw

testingjavascriptv4.0.0

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

Snapshot Serializer Configuration

✓ "snapshotSerializers": [ "<rootDir>/node_modules/jest-serializer-vue-tjw" ]

This library is configured directly in your Jest or Vitest config file via its path, not via a direct import in test files. It was CommonJS-based.

Configuration options in vue.config.js

✓ // vue.config.js module.exports = { pluginOptions: { jestSerializerVue: { removeDataTest: true } } }

✗ import { configure } from 'jest-serializer-vue-tjw'

Settings were applied via `vue.config.js` or `package.json`, not by importing and calling a configuration function.

Demonstrates the `jest.config.js` setup for integrating the serializer and example configuration settings within `package.json` for customized snapshot behavior.

{ "jest": { "snapshotSerializers": [ "<rootDir>/node_modules/jest-serializer-vue-tjw" ] }, "jest-serializer-vue-tjw": { "removeDataTest": true, "sortAttributes": true, "clearInlineFunctions": true, "attributesToClear": ["data-random", "id"] } }

Debug

Known issues

breakingThe library is deprecated as of v4.0.0. While v4.0.0 introduces no functional changes from v3.x.x, it adds a deprecation notice on install and strongly recommends migration to `vue3-snapshot-serializer`.

fix

For new projects or existing Vue 3 projects, migrate to `vue3-snapshot-serializer`. For Vue 2 projects that cannot migrate to Vue 3, pin `jest-serializer-vue-tjw` to `3.x.x` to avoid deprecation warnings.

affects: >=4.0.0

breakingImproved arrow function detection in v3.20.0 may cause some snapshots to change around inline functions. Comments might also be restored to previous styles.

fix

Review and update affected snapshots after upgrading to v3.20.0 or later.

affects: >=3.20.0

breakingAttributes are sorted by default since v3.18.0. This can lead to snapshot diffs where attribute order changes.

fix

Update snapshots if attribute order changes. To opt-out, set `sortAttributes` to `false` in your configuration.

affects: >=3.18.0

breakingIn v3.16.0, the `removeIstanbulComments` setting was added and enabled by default to clean up Istanbul-injected flags in snapshots when running with code coverage.

fix

If you relied on Istanbul comments being present in snapshots (unlikely), you can disable `removeIstanbulComments`. Otherwise, review and update snapshots.

affects: >=3.16.0

breakingA major bump of the HTML parser in v3.15.0 (4.1.0 -> 5.0.0) might cause minor formatting changes, such as end tags appearing on new lines.

fix

Review and update snapshots to reflect any minor formatting changes.

affects: >=3.15.0

gotchaVersions prior to `3.14.0` might format empty tags (`<div></div>`) differently when `addInputValues` and `stringifyObjects` are false, potentially splitting them onto two lines.

fix

Upgrade to v3.14.0 or later, or manually update affected snapshots.

affects: <3.14.0

Errors

Common errors & fixes

Error: Jest: a snapshot serializer must be a string or a module

Incorrectly specifying the serializer path or importing it directly instead of providing the module path string in `jest.config.js`.

fix

Ensure your `jest.config.js`'s `snapshotSerializers` array contains the string path to the serializer, e.g., `"<rootDir>/node_modules/jest-serializer-vue-tjw"`.

Snapshots changed unexpectedly (diff shows attribute reordering)

The `sortAttributes` feature was enabled by default in v3.18.0, causing attributes within HTML tags to be sorted alphabetically.

fix

This is often an intentional improvement. Accept the new snapshots or set `sortAttributes: false` in your configuration if you need to preserve original attribute order.

Snapshots show 'function () { /* istanbul ignore next */ ... }' artifacts

Code coverage tools like Istanbul inject comments into compiled code, which can appear in snapshots when inline functions are present and `removeIstanbulComments` is not active.

fix

Upgrade to v3.16.0 or later, which enables `removeIstanbulComments` by default, or explicitly set `removeIstanbulComments: true` in your serializer configuration.

My Vue 3 project snapshots are not working correctly or the serializer is not recommended.

This library has limited support for Vue 3 and is officially deprecated in favor of a new, dedicated Vue 3 serializer.

fix

Migrate your project to use `vue3-snapshot-serializer` for full Vue 3 compatibility and access to new features. Follow the migration guide in the `jest-serializer-vue-tjw` README.

Upgrade

Version history

4.0.0latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

6 hits · last 30 days

node

Resources

githubhttps://github.com/tjw-lint/jest-serializer-vue-tjw ↗

packagehttps://www.npmjs.com/package/jest-serializer-vue-tjw ↗