v2.3.0 - Classic Formatter

Features:

• The formatter used by jest-serializer-vue-tjw is now available in vue3-snapshot-serializer as "Classic"
  • global.vueSnapshots.formatter = 'classic'; - Switch from 'diffable' to 'classic'
  • global.vueSnapshots.classicFormatter = {}; - pass in any settings. They are documented in types.js

Maintenance:

• Test coverage remains at 100%
• Updated types.js for new API

Diff:

• v2.2.0...v2.3.0

v2.2.0 - Classes Per Line and Sorted Classes

Features:

• There is now an sortClasses option to sort your classes, similar to sortAttributes. The goal is to reduce noise in snapshots to give more meaningful diffs. It is enabled by default, you'll likely see some snapshots needing updated after this.
  • vueSnapshots.sortClasses = false;
    • <span class="dog cat zebra pig"></span>
  • vueSnapshots.sortClasses = true;
    • <span class="cat dog pig zebra"></span>
• There is now a formatting.classesPerLine option, similar to formatting.attributesPerLine. This breaks up classes on to multiple lines based on the numeric setting (defaults to allowing 1 class on the same line as the class attribute). The goal with this setting is to decrease visual fatigue when looking at snapshot diffs, making them more "diffable".
  • vueSnapshots.formatting.classesPerLine = 500;

    <button
      class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline"
      disabled
    >
      9 classes
    </button>

  • vueSnapshots.formatting.classesPerLine = 1;

    <button
      class="
        bg-blue-500
        hover:bg-blue-700
        text-white
        font-bold
        py-2
        px-4
        rounded
        focus:outline-none
        focus:shadow-outline
      "
      disabled
    >
      9 classes
    </button>

  • vueSnapshots.formatting.classesPerLine = 0;

    <button
      class="
        bg-blue-500
      "
      disabled
    >
      1 class
    </button>

  • vueSnapshots.formatting.classesPerLine = 1;

    <button
      class="bg-blue-500"
      disabled
    >
      1 class
    </button>

Maintenance:

• Test coverage remains at 100%
• Updated Types.js for new API

Diff:

• v2.1.0...v2.2.0

v2.1.0 - Formatter re-write, escapeAttributes

Features:

• New Diffable formatting option escapeAttributes was added. Previously, attributes used the same setting as escapeInnerText. The two have now been split up because the presumed desired default settings for each are actually different. But now you can control them, so feel free to toggle them however you like.
• Total dependencies for this library has dropped from 3 down to 2 with the removal of parse5.

Bug fixes:

• The built-in diffable formatter has been re-written to use htmlparser2 for AST generation, replacing parse5. Expect some minor snapshot differences from this, however if you find any issues, report them. This fixes an issue involving stubbed components (#70), thanks to @FloEdelmann for reporting this bug.

Maintenance:

• Update Deps
• Test coverage remains at 100%
• Updated Types.js for new API
• Updated to latest Node 23 and npm 11

Diff:

• v2.0.0...v2.1.0

v2.0.0 - Post Processor replaces custom formatter

Features:

• A new API feature was added, global.vueSnapshots.postProcessor which is a custom function you write that is handed a string of markup (after it has been formatted). Your function must return a string (not a promise).

Breaking Change:

• Previously you could set global.vueSnapshots.formatter to 'diffable', 'none', or a custom function. Now it only supports 'diffable' or 'none'. Use postProcessor instead. Reasoning for this change can be seen in #74.

Maintenance:

• Updated dependencies.
• Test coverage remains at 100%.

Diff:

• v1.0.1...v2.0.0

v1.0.1 - Export `test`/`print` functions

Features:

• Now the test and print functions can be directly imported. Thanks to @FloEdelmann for (#69)

Maintenance:

• Update dependencies
• Test coverage remains at 100%

Diff:

• v1.0.0...v1.0.1

v1.0.0 - Types

Features:

• Bumping this to v1, as I have been using it in real-world projects and not ran into any major issues. So I'm deeming it ready for general consumption. Report bugs if you find them.
• Thanks to @FloEdelmann for catching a minor bug and making a PR for it (#68)
• Updated types.js to match new API changes (#65)

Maintenance:

• Update dependencies
• Test coverage remains at 100%

Diff:

• v0.14.0...v1.0.0

v0.14.0 - Self-closing SVG Filter Tags

Features:

• Updated the list of self-closing SVG tags to include filter tags.

Maintenance:

• Test coverage remains at 100%

Diff:

• v0.13.0...v0.14.0

v0.13.0 - Nested attr indent on whitespace children

Features:

• Nested attribute indentation on whitespace preserved children is now improved.

Maintenance:

• Updated dependencies
• Test coverage remains at 100%

Diff:

• v0.12.0...v0.13.0

v0.12.0 - Whitespace dependent tag improvements

Bug fixes:

• global.vueSnapshots.formatting.tagsWithWhitespacePreserved
  • Fixed bug where child element white space was not retained.
  • Fixed bug where the closing tag was not followed by a return.

Maintenance:

• Updated dependencies
• Test coverage remains at 100%

Diff:

• v0.11.0...v0.12.0

v0.11.0 - Simplify whitespace preservation feature

Breaking Changes:

The global.vueSnapshots.formatting.tagsWithWhitespacePreserved feature previously supported

• undefined would default to ['a', 'pre']
• false would be the same as []
• Any array of strings
• true would apply to all tags

However, the true option ran into complex technical issues with the implementation, and likely isn't really possible (without 3rd party libraries that don't exist currently). So it is removed. Since false is equivalent to an empty array, it was removed too, to simplify this rule.

Now global.vueSnapshots.formatting.tagsWithWhitespacePreserved only accepts undefined and an array of string tag names (or an empty array).

Maintenance:

• Added JSDocs linting
• Added JSDoc comments throughout the codebase
• Updated all dependencies
• Test coverage remains at 100%

Diff:

• v0.10.0...v0.11.0