feat(tests): more test coverage for MultiSelect

ui/src/Components/MultiSelect/__snapshots__/index.test.js.snap

@@ -0,0 +1,105 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<CustomMultiSelect /> matches snapshot with a value 1`] = `
+<StateManager
+  defaultInputValue=""
+  defaultMenuIsOpen={false}
+  defaultValue={
+    Object {
+      "label": "foo",
+      "value": "foo",
+    }
+  }
+  options={
+    Array [
+      Object {
+        "label": "foo",
+        "value": "foo",
+      },
+    ]
+  }
+  styles={
+    Object {
+      "control": [Function],
+      "indicatorsContainer": [Function],
+      "multiValue": [Function],
+      "multiValueLabel": [Function],
+      "multiValueRemove": [Function],
+      "option": [Function],
+      "valueContainer": [Function],
+    }
+  }
+/>
+`;
+
+exports[`<CustomMultiSelect /> matches snapshot with defaults 1`] = `
+<StateManager
+  defaultInputValue=""
+  defaultMenuIsOpen={false}
+  defaultValue={null}
+  styles={
+    Object {
+      "control": [Function],
+      "indicatorsContainer": [Function],
+      "multiValue": [Function],
+      "multiValueLabel": [Function],
+      "multiValueRemove": [Function],
+      "option": [Function],
+      "valueContainer": [Function],
+    }
+  }
+/>
+`;
+
+exports[`<CustomMultiSelect /> matches snapshot with isMulti=true 1`] = `
+<StateManager
+  defaultInputValue=""
+  defaultMenuIsOpen={false}
+  defaultValue={null}
+  isMulti={true}
+  styles={
+    Object {
+      "control": [Function],
+      "indicatorsContainer": [Function],
+      "multiValue": [Function],
+      "multiValueLabel": [Function],
+      "multiValueRemove": [Function],
+      "option": [Function],
+      "valueContainer": [Function],
+    }
+  }
+/>
+`;
+
+exports[`<CustomMultiSelect /> matches snapshot with isMulti=true and a value 1`] = `
+<StateManager
+  defaultInputValue=""
+  defaultMenuIsOpen={false}
+  defaultValue={
+    Object {
+      "label": "foo",
+      "value": "foo",
+    }
+  }
+  isMulti={true}
+  options={
+    Array [
+      Object {
+        "label": "foo",
+        "value": "foo",
+      },
+    ]
+  }
+  styles={
+    Object {
+      "control": [Function],
+      "indicatorsContainer": [Function],
+      "multiValue": [Function],
+      "multiValueLabel": [Function],
+      "multiValueRemove": [Function],
+      "option": [Function],
+      "valueContainer": [Function],
+    }
+  }
+/>
+`;

ui/src/Components/MultiSelect/index.test.js

@@ -0,0 +1,49 @@
+import React from "react";
+
+import { shallow } from "enzyme";
+
+import { MultiSelect } from ".";
+
+const Option = value => ({ label: value, value: value });
+
+class CustomMultiSelect extends MultiSelect {
+  constructor(props) {
+    super(props);
+    this.extraProps = props;
+  }
+
+  renderProps = () => this.extraProps;
+}
+
+describe("<CustomMultiSelect />", () => {
+  it("matches snapshot with defaults", () => {
+    const tree = shallow(<CustomMultiSelect />);
+    expect(tree).toMatchSnapshot();
+  });
+
+  it("matches snapshot with isMulti=true", () => {
+    const tree = shallow(<CustomMultiSelect isMulti />);
+    expect(tree).toMatchSnapshot();
+  });
+
+  it("matches snapshot with a value", () => {
+    const tree = shallow(
+      <CustomMultiSelect
+        defaultValue={Option("foo")}
+        options={[Option("foo", Option("bar"))]}
+      />
+    );
+    expect(tree).toMatchSnapshot();
+  });
+
+  it("matches snapshot with isMulti=true and a value", () => {
+    const tree = shallow(
+      <CustomMultiSelect
+        isMulti
+        defaultValue={Option("foo")}
+        options={[Option("foo", Option("bar"))]}
+      />
+    );
+    expect(tree).toMatchSnapshot();
+  });
+});