From 5e0c766f4477fc856c041918698b61dcf5a61c19 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Mierzwa?= Date: Sun, 2 Sep 2018 18:14:00 +0100 Subject: [PATCH] fix(tests): use diffable html instead tree snapshots --- .../__snapshots__/index.test.js.snap | 1222 ++++------------- ui/src/Components/MultiSelect/index.test.js | 12 +- 2 files changed, 281 insertions(+), 953 deletions(-) diff --git a/ui/src/Components/MultiSelect/__snapshots__/index.test.js.snap b/ui/src/Components/MultiSelect/__snapshots__/index.test.js.snap index 318800f69..edee4f5ad 100644 --- a/ui/src/Components/MultiSelect/__snapshots__/index.test.js.snap +++ b/ui/src/Components/MultiSelect/__snapshots__/index.test.js.snap @@ -1,968 +1,294 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[` matches snapshot when focused 1`] = ` - - + - - -
- -
- -
-
- -
- -
- - -
- - - - - - -
- - - +
- - - - - + + + +
+ + +
+ + + + +
+
+ + +" `; exports[` matches snapshot with a value 1`] = ` - +" +
+
+
+
+ foo +
+
+
+ +
+
+
+
+
+
+ + +
+ + + + +
+
+
+
+" `; exports[` matches snapshot with defaults 1`] = ` - +" +
+
+
+
+ Select... +
+
+
+ +
+
+
+
+
+
+ + +
+ + + + +
+
+
+
+" `; exports[` matches snapshot with isMulti=true 1`] = ` - +" +
+
+
+
+ Select... +
+
+
+ +
+
+
+
+
+
+ + +
+ + + + +
+
+
+
+" `; exports[` matches snapshot with isMulti=true and a value 1`] = ` - +" +
+
+
+
+
+ foo +
+
+ + + + +
+
+
+
+ +
+
+
+
+
+
+
+ + + + +
+ + +
+ + + + +
+
+
+
+" `; diff --git a/ui/src/Components/MultiSelect/index.test.js b/ui/src/Components/MultiSelect/index.test.js index b575edef4..a60fe54d5 100644 --- a/ui/src/Components/MultiSelect/index.test.js +++ b/ui/src/Components/MultiSelect/index.test.js @@ -2,6 +2,8 @@ import React from "react"; import { shallow, mount } from "enzyme"; +import toDiffableHtml from "diffable-html"; + import { MultiSelect } from "."; const Option = value => ({ label: value, value: value }); @@ -25,19 +27,19 @@ class CustomMultiSelect extends MultiSelect { describe("", () => { it("matches snapshot with defaults", () => { const tree = shallow(); - expect(tree).toMatchSnapshot(); + expect(toDiffableHtml(tree.html())).toMatchSnapshot(); }); it("matches snapshot with isMulti=true", () => { const tree = shallow(); - expect(tree).toMatchSnapshot(); + expect(toDiffableHtml(tree.html())).toMatchSnapshot(); }); it("matches snapshot when focused", () => { // this test is to cover styles state.isFocused conditions const tree = mount(); tree.find("input").simulate("focus"); - expect(tree).toMatchSnapshot(); + expect(toDiffableHtml(tree.html())).toMatchSnapshot(); }); it("matches snapshot with a value", () => { @@ -47,7 +49,7 @@ describe("", () => { options={[Option("foo", Option("bar"))]} /> ); - expect(tree).toMatchSnapshot(); + expect(toDiffableHtml(tree.html())).toMatchSnapshot(); }); it("matches snapshot with isMulti=true and a value", () => { @@ -58,6 +60,6 @@ describe("", () => { options={[Option("foo", Option("bar"))]} /> ); - expect(tree).toMatchSnapshot(); + expect(toDiffableHtml(tree.html())).toMatchSnapshot(); }); });