diff --git a/client/src/components/Common/FilterMenu.test.ts b/client/src/components/Common/FilterMenu.test.ts index c9955acee309..8474981948dc 100644 --- a/client/src/components/Common/FilterMenu.test.ts +++ b/client/src/components/Common/FilterMenu.test.ts @@ -1,7 +1,9 @@ +import { createTestingPinia } from "@pinia/testing"; import { getLocalVue } from "@tests/jest/helpers"; import { mount, Wrapper } from "@vue/test-utils"; import { HistoryFilters } from "@/components/History/HistoryFilters"; +import { WorkflowFilters } from "@/components/Workflow/WorkflowFilters"; import Filtering, { compare, contains, equals, toBool, toDate } from "@/utils/filtering"; import FilterMenu from "./FilterMenu.vue"; @@ -80,6 +82,7 @@ describe("FilterMenu", () => { stubs: { icon: { template: "
" }, }, + pinia: createTestingPinia(), }); } @@ -89,11 +92,13 @@ describe("FilterMenu", () => { await searchButton.trigger("click"); } - async function expectCorrectEmits(showAdvanced: boolean, filterText: string, filterClass: Filtering) { + async function expectCorrectEmits(filterText: string, filterClass: Filtering, showAdvanced?: boolean) { + if (showAdvanced !== undefined) { + const toggleEmit = (wrapper.emitted()?.["update:show-advanced"]?.length ?? 0) - 1; + expect(wrapper.emitted()["update:show-advanced"]?.[toggleEmit]?.[0]).toEqual(showAdvanced); + await wrapper.setProps({ showAdvanced: wrapper.emitted()["update:show-advanced"]?.[toggleEmit]?.[0] }); + } const filterEmit = (wrapper.emitted()["update:filter-text"]?.length ?? 0) - 1; - const toggleEmit = (wrapper.emitted()?.["update:show-advanced"]?.length ?? 0) - 1; - expect(wrapper.emitted()["update:show-advanced"]?.[toggleEmit]?.[0]).toEqual(showAdvanced); - await wrapper.setProps({ showAdvanced: wrapper.emitted()["update:show-advanced"]?.[toggleEmit]?.[0] }); const receivedText = wrapper.emitted()["update:filter-text"]?.[filterEmit]?.[0]; const receivedDict = filterClass.getQueryDict(receivedText); const parsedDict = filterClass.getQueryDict(filterText); @@ -185,11 +190,11 @@ describe("FilterMenu", () => { // perform search await performSearch(); await expectCorrectEmits( - false, "create_time>'January 1, 2022' create_time<'January 1, 2023' " + "filter_key:item-filter has_help:has-help-filter list_item:1234 " + "number>1234 number<5678 name:name-filter radio:true bool_def:true", - TestFilters + TestFilters, + false ); }); @@ -209,17 +214,17 @@ describe("FilterMenu", () => { // -------- Test keyup.enter key: --------- // toggles view out and performs a search await filterName.trigger("keyup.enter"); - await expectCorrectEmits(false, "name:'sample name'", TestFilters); + await expectCorrectEmits("name:'sample name'", TestFilters, false); // Test: clearing the filterText const clearButton = wrapper.find("[data-description='reset query']"); await clearButton.trigger("click"); - await expectCorrectEmits(false, "", TestFilters); + await expectCorrectEmits("", TestFilters, false); // Test: toggling view back in const toggleButton = wrapper.find("[data-description='toggle advanced search']"); await toggleButton.trigger("click"); - await expectCorrectEmits(true, "", TestFilters); + await expectCorrectEmits("", TestFilters, true); // -------- Test keyup.esc key: --------- // toggles view out only (doesn't cause a new search / doesn't emulate enter) @@ -232,7 +237,7 @@ describe("FilterMenu", () => { // press esc key from name field (should not change emitted filterText unlike enter key) await filterName.trigger("keyup.esc"); - await expectCorrectEmits(false, "", TestFilters); + await expectCorrectEmits("", TestFilters, false); }); /** @@ -260,13 +265,13 @@ describe("FilterMenu", () => { // expect "deleted = any" filter to be applied await performSearch(); - await expectCorrectEmits(false, "visible:true", HistoryFilters); + await expectCorrectEmits("visible:true", HistoryFilters, false); // -------- Testing visible filter now: --------- const toggleButton = wrapper.find("[data-description='toggle advanced search']"); await toggleButton.trigger("click"); - await expectCorrectEmits(true, "visible:true", HistoryFilters); + await expectCorrectEmits("visible:true", HistoryFilters, true); const visibleFilterBtnGrp = wrapper.find("[data-description='filter visible']"); const visibleFilterAnyBtn = visibleFilterBtnGrp.find(".btn-secondary"); expect(visibleFilterAnyBtn.text()).toBe("Any"); @@ -283,13 +288,34 @@ describe("FilterMenu", () => { // expect "visible = any" filter to be applied await performSearch(); - await expectCorrectEmits(false, "deleted:any visible:any", HistoryFilters); + await expectCorrectEmits("deleted:any visible:any", HistoryFilters, false); // -------- Testing repeated search if it prevents bug: --------- // (bug reported here: https://github.com/galaxyproject/galaxy/issues/16211) await toggleButton.trigger("click"); - await expectCorrectEmits(true, "deleted:any visible:any", HistoryFilters); + await expectCorrectEmits("deleted:any visible:any", HistoryFilters, true); await performSearch(); - await expectCorrectEmits(false, "deleted:any visible:any", HistoryFilters); + await expectCorrectEmits("deleted:any visible:any", HistoryFilters, false); + }); + + /** + * Testing the default values of the filters defined in the HistoryFilters: Filtering + * class, ensuring the default values are reflected in the radio-group buttons + */ + it("test compact menu with checkbox filters on WorkflowFilters", async () => { + const myWorkflowFilters = WorkflowFilters("my"); + setUpWrapper("Workflows", "search workflows", myWorkflowFilters); + // a compact `FilterMenu` only needs to be opened once (doesn't toggle out automatically) + await wrapper.setProps({ showAdvanced: true, view: "compact" }); + + // -------- Testing auto search on value change: --------- + const nameFilterInput = wrapper.find("#workflows-advanced-filter-name"); + await nameFilterInput.setValue("myworkflow"); + await expectCorrectEmits("name:myworkflow", myWorkflowFilters); + + // -------- Testing deleted filter first: --------- + const deletedFilterCheckbox = wrapper.find("[data-description='filter deleted'] input"); + await deletedFilterCheckbox.setChecked(); + await expectCorrectEmits("name:myworkflow is:deleted", myWorkflowFilters); }); }); diff --git a/client/src/components/Common/FilterMenu.vue b/client/src/components/Common/FilterMenu.vue index f3deb4ee9894..f33bdb70960c 100644 --- a/client/src/components/Common/FilterMenu.vue +++ b/client/src/components/Common/FilterMenu.vue @@ -1,13 +1,13 @@