[Lens] Reload on runtime edit (#97161)
This commit is contained in:
parent
0ea0e40331
commit
a021946e85
|
@ -6,7 +6,7 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Observable } from 'rxjs';
|
import { Observable, Subject } from 'rxjs';
|
||||||
import { ReactWrapper } from 'enzyme';
|
import { ReactWrapper } from 'enzyme';
|
||||||
import { act } from 'react-dom/test-utils';
|
import { act } from 'react-dom/test-utils';
|
||||||
import { App } from './app';
|
import { App } from './app';
|
||||||
|
@ -77,6 +77,8 @@ function createMockFrame(): jest.Mocked<EditorFrameInstance> {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const sessionIdSubject = new Subject<string>();
|
||||||
|
|
||||||
function createMockSearchService() {
|
function createMockSearchService() {
|
||||||
let sessionIdCounter = 1;
|
let sessionIdCounter = 1;
|
||||||
return {
|
return {
|
||||||
|
@ -84,6 +86,7 @@ function createMockSearchService() {
|
||||||
start: jest.fn(() => `sessionId-${sessionIdCounter++}`),
|
start: jest.fn(() => `sessionId-${sessionIdCounter++}`),
|
||||||
clear: jest.fn(),
|
clear: jest.fn(),
|
||||||
getSessionId: jest.fn(() => `sessionId-${sessionIdCounter}`),
|
getSessionId: jest.fn(() => `sessionId-${sessionIdCounter}`),
|
||||||
|
getSession$: jest.fn(() => sessionIdSubject.asObservable()),
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
@ -1328,6 +1331,24 @@ describe('Lens App', () => {
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('re-renders the frame if session id changes from the outside', async () => {
|
||||||
|
const services = makeDefaultServices();
|
||||||
|
const { frame } = mountWith({ props: undefined, services });
|
||||||
|
|
||||||
|
act(() => {
|
||||||
|
sessionIdSubject.next('new-session-id');
|
||||||
|
});
|
||||||
|
await act(async () => {
|
||||||
|
await new Promise((r) => setTimeout(r, 0));
|
||||||
|
});
|
||||||
|
expect(frame.mount).toHaveBeenCalledWith(
|
||||||
|
expect.any(Element),
|
||||||
|
expect.objectContaining({
|
||||||
|
searchSessionId: `new-session-id`,
|
||||||
|
})
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
it('updates the searchSessionId when the active saved query is cleared', () => {
|
it('updates the searchSessionId when the active saved query is cleared', () => {
|
||||||
const { component, frame, services } = mountWith({});
|
const { component, frame, services } = mountWith({});
|
||||||
act(() =>
|
act(() =>
|
||||||
|
|
|
@ -14,7 +14,7 @@ import { Toast } from 'kibana/public';
|
||||||
import { VisualizeFieldContext } from 'src/plugins/ui_actions/public';
|
import { VisualizeFieldContext } from 'src/plugins/ui_actions/public';
|
||||||
import { Datatable } from 'src/plugins/expressions/public';
|
import { Datatable } from 'src/plugins/expressions/public';
|
||||||
import { EuiBreadcrumb } from '@elastic/eui';
|
import { EuiBreadcrumb } from '@elastic/eui';
|
||||||
import { finalize, switchMap, tap } from 'rxjs/operators';
|
import { delay, finalize, switchMap, tap } from 'rxjs/operators';
|
||||||
import { downloadMultipleAs } from '../../../../../src/plugins/share/public';
|
import { downloadMultipleAs } from '../../../../../src/plugins/share/public';
|
||||||
import {
|
import {
|
||||||
createKbnUrlStateStorage,
|
createKbnUrlStateStorage,
|
||||||
|
@ -221,11 +221,29 @@ export function App({
|
||||||
kbnUrlStateStorage
|
kbnUrlStateStorage
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const sessionSubscription = data.search.session
|
||||||
|
.getSession$()
|
||||||
|
// wait for a tick to filter/timerange subscribers the chance to update the session id in the state
|
||||||
|
.pipe(delay(0))
|
||||||
|
// then update if it didn't get updated yet
|
||||||
|
.subscribe((newSessionId) => {
|
||||||
|
if (newSessionId) {
|
||||||
|
setState((prevState) => {
|
||||||
|
if (prevState.searchSessionId !== newSessionId) {
|
||||||
|
return { ...prevState, searchSessionId: newSessionId };
|
||||||
|
} else {
|
||||||
|
return prevState;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
return () => {
|
return () => {
|
||||||
stopSyncingQueryServiceStateWithUrl();
|
stopSyncingQueryServiceStateWithUrl();
|
||||||
filterSubscription.unsubscribe();
|
filterSubscription.unsubscribe();
|
||||||
timeSubscription.unsubscribe();
|
timeSubscription.unsubscribe();
|
||||||
autoRefreshSubscription.unsubscribe();
|
autoRefreshSubscription.unsubscribe();
|
||||||
|
sessionSubscription.unsubscribe();
|
||||||
};
|
};
|
||||||
}, [
|
}, [
|
||||||
data.query.filterManager,
|
data.query.filterManager,
|
||||||
|
|
|
@ -503,6 +503,8 @@ export const InnerIndexPatternDataPanel = function InnerIndexPatternDataPanel({
|
||||||
patterns: [currentIndexPattern.id],
|
patterns: [currentIndexPattern.id],
|
||||||
});
|
});
|
||||||
onUpdateIndexPattern(newlyMappedIndexPattern[currentIndexPattern.id]);
|
onUpdateIndexPattern(newlyMappedIndexPattern[currentIndexPattern.id]);
|
||||||
|
// start a new session so all charts are refreshed
|
||||||
|
data.search.session.start();
|
||||||
}, [data, currentIndexPattern, onUpdateIndexPattern]);
|
}, [data, currentIndexPattern, onUpdateIndexPattern]);
|
||||||
|
|
||||||
const editField = useMemo(
|
const editField = useMemo(
|
||||||
|
|
Loading…
Reference in a new issue