refactor(tests): dedup some code, add more label test coverage

ui/src/Components/Labels/FilterInputLabel/index.test.js

@@ -0,0 +1,23 @@
+import React from "react";
+import renderer from "react-test-renderer";
+
+import { AlertStore, NewUnappliedFilter } from "Stores/AlertStore";
+
+import { FilterInputLabel } from ".";
+
+let alertStore;
+
+beforeEach(() => {
+  alertStore = new AlertStore([]);
+});
+
+describe("<FilterInputLabel />", () => {
+  it("renders without crashing", () => {
+    renderer.create(
+      <FilterInputLabel
+        alertStore={alertStore}
+        filter={NewUnappliedFilter("foo=bar")}
+      />
+    );
+  });
+});

ui/src/Components/Labels/FilteringCounterBadge/index.test.js

@@ -1,7 +1,7 @@
 import React from "react";
 import renderer from "react-test-renderer";
 
-import { AlertStore } from "Stores/AlertStore";
+import { AlertStore, NewUnappliedFilter } from "Stores/AlertStore";
 
 import { FilteringCounterBadge } from ".";
 
@@ -54,15 +54,9 @@ const validateOnClick = value => {
   tree.props.onClick({ preventDefault: () => {} });
 
   expect(alertStore.filters.values).toHaveLength(1);
-  expect(alertStore.filters.values).toContainEqual({
-    applied: false,
-    isValid: true,
-    raw: `@state=${value}`,
-    hits: 0,
-    name: "",
-    matcher: "",
-    value: ""
-  });
+  expect(alertStore.filters.values).toContainEqual(
+    NewUnappliedFilter(`@state=${value}`)
+  );
 };
 
 describe("<FilteringCounterBadge />", () => {

ui/src/Components/Labels/FilteringLabel/index.test.js

@@ -0,0 +1,50 @@
+import React from "react";
+import renderer from "react-test-renderer";
+
+import { AlertStore, NewUnappliedFilter } from "Stores/AlertStore";
+
+import { FilteringLabel } from ".";
+
+let alertStore;
+
+beforeEach(() => {
+  alertStore = new AlertStore([]);
+});
+
+const RenderAndClick = (name, value) => {
+  const tree = renderer
+    .create(
+      <FilteringLabel alertStore={alertStore} name={name} value={value} />
+    )
+    .toJSON();
+
+  tree.props.onClick({ preventDefault: () => {} });
+};
+
+describe("<FilteringLabel />", () => {
+  it("renders without crashing", () => {
+    renderer.create(
+      <FilteringLabel alertStore={alertStore} name="foo" value="bar" />
+    );
+  });
+
+  it("calling onClick() adds a new filter 'foo=bar'", () => {
+    RenderAndClick("foo", "bar");
+    expect(alertStore.filters.values).toHaveLength(1);
+    expect(alertStore.filters.values).toContainEqual(
+      NewUnappliedFilter("foo=bar")
+    );
+  });
+
+  it("calling onClick() multiple times appends extra filter 'baz=bar'", () => {
+    RenderAndClick("foo", "bar");
+    RenderAndClick("bar", "baz");
+    expect(alertStore.filters.values).toHaveLength(2);
+    expect(alertStore.filters.values).toContainEqual(
+      NewUnappliedFilter("foo=bar")
+    );
+    expect(alertStore.filters.values).toContainEqual(
+      NewUnappliedFilter("bar=baz")
+    );
+  });
+});

ui/src/Stores/AlertStore.js

@@ -71,7 +71,7 @@ const AlertStoreStatuses = Object.freeze({
   Failure: Symbol("failure")
 });
 
-function newUnappliedFilter(raw) {
+function NewUnappliedFilter(raw) {
   return {
     applied: false,
     isValid: true,
@@ -89,7 +89,7 @@ class AlertStore {
       values: [],
       addFilter(raw) {
         if (this.values.filter(f => f.raw === raw).length === 0) {
-          this.values.push(newUnappliedFilter(raw));
+          this.values.push(NewUnappliedFilter(raw));
           UpdateLocationSearch({ q: this.values.map(f => f.raw) });
         }
       },
@@ -108,13 +108,13 @@ class AlertStore {
             this.removeFilter(oldRaw);
           } else {
             // no dups, continue with a swap
-            this.values[index] = newUnappliedFilter(newRaw);
+            this.values[index] = NewUnappliedFilter(newRaw);
             UpdateLocationSearch({ q: this.values.map(f => f.raw) });
           }
         }
       },
       setFilters(raws) {
-        this.values = raws.map(raw => newUnappliedFilter(raw));
+        this.values = raws.map(raw => NewUnappliedFilter(raw));
         UpdateLocationSearch({ q: this.values.map(f => f.raw) });
       }
     },
@@ -318,5 +318,6 @@ export {
   AlertStoreStatuses,
   FormatUnseeBackendURI,
   FormatAPIFilterQuery,
-  DecodeLocationSearch
+  DecodeLocationSearch,
+  NewUnappliedFilter
 };