diff --git a/assets/static/__snapshots__/filters.test.js.snap b/assets/static/__snapshots__/filters.test.js.snap
new file mode 100644
index 000000000..e458b7b37
--- /dev/null
+++ b/assets/static/__snapshots__/filters.test.js.snap
@@ -0,0 +1,374 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`appended filtes should be present in history 1`] = `
+""
+`;
+
+exports[`appended filtes should be present in history 2`] = `
+"
+
+
+
+
+
+
+"
+`;
+
+exports[`appended filtes should be present in history 3`] = `
+"
+
+
+
+
+
+
+
+
+
+
+
+
+"
+`;
+
+exports[`appended filtes should be present in history 4`] = `
+"
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+"
+`;
+
+exports[`appended filtes should be present in history 5`] = `
+"
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+"
+`;
+
+exports[`appended filtes should be present in history 6`] = `
+"
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+"
+`;
+
+exports[`default filter should be in history after setting filter to foo 1`] = `
+""
+`;
diff --git a/assets/static/filters.js b/assets/static/filters.js
index 2cde60940..ff71a6814 100644
--- a/assets/static/filters.js
+++ b/assets/static/filters.js
@@ -56,6 +56,10 @@ function addFilter(text) {
$(selectors.filter).tagsinput("add", text);
}
+function clearFilters() {
+ $(selectors.filter).tagsinput("removeAll");
+}
+
function setUpdating() {
// visual hint that alerts are reloaded due to filter change
$(selectors.icon).removeClass("fa-search fa-pause").addClass("fa-circle-o-notch fa-spin");
@@ -217,6 +221,7 @@ function init(historyStore) {
exports.init = init;
exports.addFilter = addFilter;
+exports.clearFilters = clearFilters;
exports.setFilters = setFilters;
exports.getFilters = getFilters;
exports.addBadge = addBadge;
diff --git a/assets/static/filters.test.js b/assets/static/filters.test.js
index d01fb3c1e..0fe7ad582 100644
--- a/assets/static/filters.test.js
+++ b/assets/static/filters.test.js
@@ -30,10 +30,10 @@ test("default filter should be in history after setting filter to foo", () => {
filters.setFilters();
filters.renderHistory();
- var elems = $("#historyMenu").find(".rawFilter");
- // foo is active so should only get default
- expect(elems.length).toBe(1);
- expect($(elems[0]).text().trim()).toBe("default");
+ // use snapshot to check that generated HTML is what we expect
+ const historyMenu = $("#historyMenu").html().trim();
+ expect(historyMenu).toMatchSnapshot();
+
// we set foo, so that what should be in history
expect(LocalStorageMock.getItem("filterHistory")).toBe("foo");
});
@@ -62,24 +62,19 @@ test("appended filtes should be present in history", () => {
filters.setFilters();
filters.renderHistory();
- // default is used, expect single history entry
- var elems = $("#historyMenu").find(".rawFilter");
- expect(elems.length).toBe(1);
- // default is used but default is always rendered so should be there
- expect($(elems[0]).text().trim()).toBe("default");
+ // we only used default, so there should be a single (default) entry
+ let historyMenu = $("#historyMenu").html().trim();
+ expect(historyMenu).toMatchSnapshot();
// and that's what history should have
expect(LocalStorageMock.getItem("filterHistory")).toBe("default");
// now we append more filters, so q=default becomes q=default,bar
filters.addFilter("bar");
filters.setFilters();
-
- elems = $("#historyMenu").find(".rawFilter");
- expect(elems.length).toBe(2);
- // default will be repeated because it's both: last filter and the defult
- // that's always rendered
- expect($(elems[0]).text().trim()).toBe("default");
- expect($(elems[1]).text().trim()).toBe("default");
+ // now we got non-default filter as active, so we should have 2 entries
+ // both for default (as recent and as global default)
+ historyMenu = $("#historyMenu").html().trim();
+ expect(historyMenu).toMatchSnapshot();
expect(
LocalStorageMock.getItem("filterHistory").split("\n")
).toMatchObject(
@@ -89,17 +84,50 @@ test("appended filtes should be present in history", () => {
// append another filter, so we now have: q=default,bar,@state=active
filters.addFilter("@state=active");
filters.setFilters();
-
- elems = $("#historyMenu").find(".rawFilter");
- expect(elems.length).toBe(3);
- // default will be repeated because it's both: last filter and the defult
- // that's always rendered
- expect($(elems[0]).text().trim()).toBe("default,bar");
- expect($(elems[1]).text().trim()).toBe("default");
- expect($(elems[1]).text().trim()).toBe("default");
+ // now we should have 3 entries, 2x default + default,bar
+ historyMenu = $("#historyMenu").html().trim();
+ expect(historyMenu).toMatchSnapshot();
expect(
LocalStorageMock.getItem("filterHistory").split("\n")
).toMatchObject(
[ "default,bar,@state=active", "default,bar", "default" ]
);
+
+ // clear filters, so now we have: q=
+ filters.clearFilters();
+ filters.setFilters();
+ // now we should have 4 entries, 2x default + default,bar + default,bar,@state=active
+ historyMenu = $("#historyMenu").html().trim();
+ expect(historyMenu).toMatchSnapshot();
+ expect(
+ LocalStorageMock.getItem("filterHistory").split("\n")
+ ).toMatchObject(
+ [ "default,bar,@state=active", "default,bar", "default" ]
+ );
+
+ // now add a filter back, so now we have: q=@state=active
+ filters.addFilter("@state=active");
+ filters.setFilters();
+ // we should have same filters as before
+ historyMenu = $("#historyMenu").html().trim();
+ expect(historyMenu).toMatchSnapshot();
+ expect(
+ LocalStorageMock.getItem("filterHistory").split("\n")
+ ).toMatchObject(
+ [ "@state=active", "default,bar,@state=active", "default,bar", "default" ]
+ );
+
+ // as a last test add default back to have @state=active rendered
+ filters.clearFilters();
+ filters.addFilter("default");
+ filters.setFilters();
+ // we should have same filters as before
+ historyMenu = $("#historyMenu").html().trim();
+ expect(historyMenu).toMatchSnapshot();
+ // default should move from the bottom to to top of the list
+ expect(
+ LocalStorageMock.getItem("filterHistory").split("\n")
+ ).toMatchObject(
+ [ "default", "@state=active", "default,bar,@state=active", "default,bar" ]
+ );
});
diff --git a/assets/templates/history.html b/assets/templates/history.html
index 3881cfc8c..0fa7e98c9 100644
--- a/assets/templates/history.html
+++ b/assets/templates/history.html
@@ -6,11 +6,9 @@
<% } %>
<% }) %>
<% } %>
-
<% if (defaultFilter) { %>
<%= renderTemplate("historyMenuItem", {filter: defaultFilter, icon: "fa fa-home"}) %>
<% } %>
-
<% if (savedFilter) { %>
<%= renderTemplate("historyMenuItem", {filter: savedFilter, icon: "fa fa-floppy-o"}) %>
<% } %>