diff --git a/src/plugins/data/public/query/state_sync/connect_to_query_state.test.ts b/src/plugins/data/public/query/state_sync/connect_to_query_state.test.ts index 5da929c441cde..06e4c1c8be6d5 100644 --- a/src/plugins/data/public/query/state_sync/connect_to_query_state.test.ts +++ b/src/plugins/data/public/query/state_sync/connect_to_query_state.test.ts @@ -463,3 +463,97 @@ describe('connect_to_app_state', () => { }); }); }); + +describe('filters with different state', () => { + let queryServiceStart: QueryStart; + let filterManager: FilterManager; + let state: BaseStateContainer; + let stateSub: Subscription; + let stateChangeTriggered = jest.fn(); + let filterManagerChangeSub: Subscription; + let filterManagerChangeTriggered = jest.fn(); + + let filter: Filter; + + beforeEach(() => { + const queryService = new QueryService(); + queryService.setup({ + uiSettings: setupMock.uiSettings, + storage: new Storage(new StubBrowserStorage()), + }); + queryServiceStart = queryService.start(startMock.savedObjects); + filterManager = queryServiceStart.filterManager; + + state = createStateContainer({}); + stateChangeTriggered = jest.fn(); + stateSub = state.state$.subscribe(stateChangeTriggered); + + filterManagerChangeTriggered = jest.fn(); + filterManagerChangeSub = filterManager.getUpdates$().subscribe(filterManagerChangeTriggered); + + filter = getFilter(FilterStateStore.GLOBAL_STATE, true, true, 'key1', 'value1'); + }); + + // applies filter state changes, changes only internal $state.store value + function runChanges() { + filter = { ...filter, $state: { store: FilterStateStore.GLOBAL_STATE } }; + + state.set({ + filters: [filter], + }); + + filter = { ...filter, $state: { store: FilterStateStore.APP_STATE } }; + + state.set({ + filters: [filter], + }); + + filter = { ...filter }; + delete filter.$state; + + state.set({ + filters: [filter], + }); + } + + test('when syncing all filters, changes to filter.state$ should be taken into account', () => { + const stop = connectToQueryState(queryServiceStart, state, { + filters: true, + }); + + runChanges(); + + expect(filterManagerChangeTriggered).toBeCalledTimes(3); + + stop(); + }); + + test('when syncing app state filters, changes to filter.state$ should be ignored', () => { + const stop = connectToQueryState(queryServiceStart, state, { + filters: FilterStateStore.APP_STATE, + }); + + runChanges(); + + expect(filterManagerChangeTriggered).toBeCalledTimes(1); + + stop(); + }); + + test('when syncing global state filters, changes to filter.state$ should be ignored', () => { + const stop = connectToQueryState(queryServiceStart, state, { + filters: FilterStateStore.GLOBAL_STATE, + }); + + runChanges(); + + expect(filterManagerChangeTriggered).toBeCalledTimes(1); + + stop(); + }); + + afterEach(() => { + stateSub.unsubscribe(); + filterManagerChangeSub.unsubscribe(); + }); +}); diff --git a/src/plugins/data/public/query/state_sync/connect_to_query_state.ts b/src/plugins/data/public/query/state_sync/connect_to_query_state.ts index 331d8969f2483..3256c1cbd65a1 100644 --- a/src/plugins/data/public/query/state_sync/connect_to_query_state.ts +++ b/src/plugins/data/public/query/state_sync/connect_to_query_state.ts @@ -91,7 +91,10 @@ export const connectToQueryState = ( } else if (syncConfig.filters === FilterStateStore.GLOBAL_STATE) { if ( !initialState.filters || - !compareFilters(initialState.filters, filterManager.getGlobalFilters(), COMPARE_ALL_OPTIONS) + !compareFilters(initialState.filters, filterManager.getGlobalFilters(), { + ...COMPARE_ALL_OPTIONS, + state: false, + }) ) { initialState.filters = filterManager.getGlobalFilters(); initialDirty = true; @@ -99,7 +102,10 @@ export const connectToQueryState = ( } else if (syncConfig.filters === FilterStateStore.APP_STATE) { if ( !initialState.filters || - !compareFilters(initialState.filters, filterManager.getAppFilters(), COMPARE_ALL_OPTIONS) + !compareFilters(initialState.filters, filterManager.getAppFilters(), { + ...COMPARE_ALL_OPTIONS, + state: false, + }) ) { initialState.filters = filterManager.getAppFilters(); initialDirty = true; @@ -173,11 +179,21 @@ export const connectToQueryState = ( filterManager.setFilters(_.cloneDeep(filters)); } } else if (syncConfig.filters === FilterStateStore.APP_STATE) { - if (!compareFilters(filters, filterManager.getAppFilters(), COMPARE_ALL_OPTIONS)) { + if ( + !compareFilters(filters, filterManager.getAppFilters(), { + ...COMPARE_ALL_OPTIONS, + state: false, + }) + ) { filterManager.setAppFilters(_.cloneDeep(filters)); } } else if (syncConfig.filters === FilterStateStore.GLOBAL_STATE) { - if (!compareFilters(filters, filterManager.getGlobalFilters(), COMPARE_ALL_OPTIONS)) { + if ( + !compareFilters(filters, filterManager.getGlobalFilters(), { + ...COMPARE_ALL_OPTIONS, + state: false, + }) + ) { filterManager.setGlobalFilters(_.cloneDeep(filters)); } }