From 29847a97d427ac7802afdcebf596b8c34ff45868 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=81ukasz=20Mierzwa?= <l.mierzwa@gmail.com>
Date: Thu, 23 Aug 2018 21:46:43 +0100
Subject: [PATCH] feat(tests): add history dropdown visibility test

---
 ui/__mocks__/popper.js.js                         | 14 ++++++++++++++
 ui/__mocks__/react-onclickoutside.js              |  6 ++++++
 .../Components/NavBar/FilterInput/History.test.js | 15 +++++++++++++++
 3 files changed, 35 insertions(+)
 create mode 100644 ui/__mocks__/popper.js.js
 create mode 100644 ui/__mocks__/react-onclickoutside.js

diff --git a/ui/__mocks__/popper.js.js b/ui/__mocks__/popper.js.js
new file mode 100644
index 000000000..d09c808a8
--- /dev/null
+++ b/ui/__mocks__/popper.js.js
@@ -0,0 +1,14 @@
+// https://github.com/FezVrasta/popper.js/issues/478#issuecomment-341506071
+
+import PopperJs from "popper.js";
+
+export default class Popper {
+  static placements = PopperJs.placements;
+
+  constructor() {
+    return {
+      destroy: () => {},
+      scheduleUpdate: () => {}
+    };
+  }
+}
diff --git a/ui/__mocks__/react-onclickoutside.js b/ui/__mocks__/react-onclickoutside.js
new file mode 100644
index 000000000..e6131a53b
--- /dev/null
+++ b/ui/__mocks__/react-onclickoutside.js
@@ -0,0 +1,6 @@
+// mock react-onclickoutside so we bypass it due to:
+// TypeError: Cannot read property 'isReactComponent' of undefined
+
+export default function onClickOutsideHOC(WrappedComponent, config) {
+  return WrappedComponent;
+}
diff --git a/ui/src/Components/NavBar/FilterInput/History.test.js b/ui/src/Components/NavBar/FilterInput/History.test.js
index 934b44cdb..6591bfa1c 100644
--- a/ui/src/Components/NavBar/FilterInput/History.test.js
+++ b/ui/src/Components/NavBar/FilterInput/History.test.js
@@ -1,6 +1,8 @@
 import React from "react";
 import renderer from "react-test-renderer";
 
+import { mount } from "enzyme";
+
 import { AlertStore, NewUnappliedFilter } from "Stores/AlertStore";
 import { Settings } from "Stores/Settings";
 import { History, ReduceFilter } from "./History";
@@ -37,6 +39,19 @@ describe("<History />", () => {
     );
   });
 
+  // Due to https://github.com/FezVrasta/popper.js/issues/478 we can't test
+  // rendered dropdown content, only the fact that toggle value is updated
+  it("renders dropdown button when menu is visible", () => {
+    const tree = mount(
+      <History alertStore={alertStore} settingsStore={settingsStore} />
+    );
+    const toggle = tree.find("button.components-navbar-history");
+
+    expect(tree.instance().collapse.value).toBe(true);
+    toggle.simulate("click");
+    expect(tree.instance().collapse.value).toBe(false);
+  });
+
   it("saves only applied filters to history", () => {
     alertStore.filters.values = [
       AppliedFilter("foo", "=", "bar"),