jest-serializer-html - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

package.json

 {
   "name": "jest-serializer-html",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "Jest snapshot serializer that beautifies HTML.",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -6,2 +6,4 @@ # A Jest snapshot serializer that beautifies HTML.
 
+When using this Jest serializer, it will turn any string starting with '<' to nicely indented HTML in the snapshot.
+
 This serializer is based on [js-beautify](https://github.com/beautify-web/js-beautify) and is configured to indent HTML tags as much as possible to ease readability of diffs in case of failing snapshot tests.
@@ -29,4 +31,68 @@
 
+## Vanilla JS Example
+
+```js
+test('should beautify HTML', () => {
+  expect('<ul><li><a href="#">My HTML</a></li></ul>').toMatchSnapshot();
+});
+```
+
+Will output:
+
+```js
+exports[`should beautify HTML 1`] = `
+<ul>
+    <li>
+        <a href="#">My HTML</a>
+    </li>
+</ul>
+`;
+```
+
+## Vue.js component output example
+
+```js
+import Vue from 'vue';
+const Hello = {
+  props: {
+    msg: {
+      type: String,
+      default: 'World'
+    }
+  },
+  template: `
+    <h1>Hello ${ msg }!</h1>
+    <ul><li><a href="#">My HTML</a></li></ul>
+  `
+};
+
+test('should beautify HTML', () => {
+  const Component = Vue.extend(Hello);
+  const vm = new Component({
+    propsData: {
+      msg: 'You'
+    }
+  });
+
+  vm.$mount();
+
+  expect(vm.$el.outerHTML).toMatchSnapshot();
+});
+```
+
+Will output:
+
+```js
+exports[`should beautify HTML 1`] = `
+<h1>Hello You!</h1>
+<ul>
+    <li>
+        <a href="#">My HTML</a>
+    </li>
+</ul>
+`;
+```
+
 ## Special thanks
 
 This package was inspired by the amazing post here: [Jest for all: Episode 1 — Vue.js](https://hackernoon.com/jest-for-all-episode-1-vue-js-d616bccbe186) by [Cristian Carlesso](https://hackernoon.com/@kentaromiura_the_js_guy).

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

3391

increased by42.9%

Number of lines in readme file

97

increased by212.9%

No dependency changes