Skip to content

Commit

Permalink
[7.x] [Lens] remove react warnings (#59574) (#59940)
Browse files Browse the repository at this point in the history 
Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
  • Loading branch information
@mbondyra @elasticmachine
mbondyra and elasticmachine authored Mar 12, 2020
1 parent faa3f41 commit c6b7964
Show file tree
Hide file tree
Showing 7 changed files with 746 additions and 780 deletions.
135 changes: 67 additions & 68 deletions x-pack/legacy/plugins/lens/public/app_plugin/app.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,11 +38,6 @@ jest

const { TopNavMenu } = npStart.plugins.navigation.ui;

const waitForPromises = async () =>
act(async () => {
await new Promise(resolve => setTimeout(resolve));
});

function createMockFrame(): jest.Mocked<EditorFrameInstance> {
return {
mount: jest.fn((el, props) => {}),
Expand Down Expand Up @@ -86,6 +81,7 @@ function createMockFilterManager() {
describe('Lens App', () => {
let frame: jest.Mocked<EditorFrameInstance>;
let core: ReturnType<typeof coreMock['createStart']>;
let instance: ReactWrapper;

function makeDefaultArgs(): jest.Mocked<{
editorFrame: EditorFrameInstance;
Expand Down Expand Up @@ -205,7 +201,7 @@ describe('Lens App', () => {

it('sets breadcrumbs when the document title changes', async () => {
const defaultArgs = makeDefaultArgs();
const instance = mount(<App {...defaultArgs} />);
instance = mount(<App {...defaultArgs} />);

expect(core.chrome.setBreadcrumbs).toHaveBeenCalledWith([
{ text: 'Visualize', href: '/testbasepath/app/kibana#/visualize' },
Expand All @@ -221,10 +217,9 @@ describe('Lens App', () => {
datasourceMetaData: { filterableIndexPatterns: [{ id: '1', title: 'saved' }] },
},
});

instance.setProps({ docId: '1234' });

await waitForPromises();
await act(async () => {
instance.setProps({ docId: '1234' });
});

expect(defaultArgs.core.chrome.setBreadcrumbs).toHaveBeenCalledWith([
{ text: 'Visualize', href: '/testbasepath/app/kibana#/visualize' },
Expand Down Expand Up @@ -254,10 +249,11 @@ describe('Lens App', () => {
},
});

const instance = mount(<App {...args} />);
instance = mount(<App {...args} />);

instance.setProps({ docId: '1234' });
await waitForPromises();
await act(async () => {
instance.setProps({ docId: '1234' });
});

expect(args.docStorage.load).toHaveBeenCalledWith('1234');
expect(args.data.indexPatterns.get).toHaveBeenCalledWith('1');
Expand Down Expand Up @@ -292,17 +288,20 @@ describe('Lens App', () => {
args.editorFrame = frame;
(args.docStorage.load as jest.Mock).mockResolvedValue({ id: '1234' });

const instance = mount(<App {...args} />);
instance = mount(<App {...args} />);
await act(async () => {
instance.setProps({ docId: '1234' });
});

instance.setProps({ docId: '1234' });
await waitForPromises();
instance.setProps({ docId: '1234' });
await waitForPromises();
await act(async () => {
instance.setProps({ docId: '1234' });
});

expect(args.docStorage.load).toHaveBeenCalledTimes(1);

instance.setProps({ docId: '9876' });
await waitForPromises();
await act(async () => {
instance.setProps({ docId: '9876' });
});

expect(args.docStorage.load).toHaveBeenCalledTimes(2);
});
Expand All @@ -312,10 +311,11 @@ describe('Lens App', () => {
args.editorFrame = frame;
(args.docStorage.load as jest.Mock).mockRejectedValue('failed to load');

const instance = mount(<App {...args} />);
instance = mount(<App {...args} />);

instance.setProps({ docId: '1234' });
await waitForPromises();
await act(async () => {
instance.setProps({ docId: '1234' });
});

expect(args.docStorage.load).toHaveBeenCalledWith('1234');
expect(args.core.notifications.toasts.addDanger).toHaveBeenCalled();
Expand Down Expand Up @@ -353,22 +353,20 @@ describe('Lens App', () => {
} as jest.ResolvedValue<Document>);
});

function getButton(instance: ReactWrapper): TopNavMenuData {
return (instance
function getButton(inst: ReactWrapper): TopNavMenuData {
return (inst
.find('[data-test-subj="lnsApp_topNav"]')
.prop('config') as TopNavMenuData[]).find(
button => button.testId === 'lnsApp_saveButton'
)!;
}

function testSave(instance: ReactWrapper, saveProps: SaveProps) {
act(() => {
getButton(instance).run(instance.getDOMNode());
});
async function testSave(inst: ReactWrapper, saveProps: SaveProps) {
await getButton(inst).run(inst.getDOMNode());

instance.update();
inst.update();

const handler = instance.findWhere(el => el.prop('onSave')).prop('onSave') as (
const handler = inst.findWhere(el => el.prop('onSave')).prop('onSave') as (
p: unknown
) => void;
handler(saveProps);
Expand Down Expand Up @@ -406,9 +404,9 @@ describe('Lens App', () => {
expression: 'kibana 2',
}));

const instance = mount(<App {...args} />);

await waitForPromises();
await act(async () => {
instance = mount(<App {...args} />);
});

if (initialDocId) {
expect(args.docStorage.load).toHaveBeenCalledTimes(1);
Expand All @@ -427,9 +425,10 @@ describe('Lens App', () => {
instance.update();

expect(getButton(instance).disableButton).toEqual(false);
testSave(instance, saveProps);

await waitForPromises();
await act(async () => {
testSave(instance, saveProps);
});

return { args, instance };
}
Expand All @@ -445,7 +444,7 @@ describe('Lens App', () => {
};
args.editorFrame = frame;

const instance = mount(<App {...args} />);
instance = mount(<App {...args} />);

expect(getButton(instance).disableButton).toEqual(true);

Expand All @@ -469,7 +468,7 @@ describe('Lens App', () => {
} as jest.ResolvedValue<Document>);
args.editorFrame = frame;

const instance = mount(<App {...args} />);
instance = mount(<App {...args} />);
expect(getButton(instance).disableButton).toEqual(true);

const onChange = frame.mount.mock.calls[0][1].onChange;
Expand All @@ -488,7 +487,7 @@ describe('Lens App', () => {
const args = defaultArgs;
args.editorFrame = frame;

const instance = mount(<App {...args} />);
instance = mount(<App {...args} />);

expect(getButton(instance).disableButton).toEqual(true);

Expand All @@ -505,7 +504,7 @@ describe('Lens App', () => {
});

it('saves new docs', async () => {
const { args, instance } = await save({
const { args, instance: inst } = await save({
initialDocId: undefined,
newCopyOnSave: false,
newTitle: 'hello there',
Expand All @@ -519,13 +518,13 @@ describe('Lens App', () => {

expect(args.redirectTo).toHaveBeenCalledWith('aaa');

instance.setProps({ docId: 'aaa' });
inst.setProps({ docId: 'aaa' });

expect(args.docStorage.load).not.toHaveBeenCalled();
});

it('saves the latest doc as a copy', async () => {
const { args, instance } = await save({
const { args, instance: inst } = await save({
initialDocId: '1234',
newCopyOnSave: true,
newTitle: 'hello there',
Expand All @@ -539,13 +538,13 @@ describe('Lens App', () => {

expect(args.redirectTo).toHaveBeenCalledWith('aaa');

instance.setProps({ docId: 'aaa' });
inst.setProps({ docId: 'aaa' });

expect(args.docStorage.load).toHaveBeenCalledTimes(1);
});

it('saves existing docs', async () => {
const { args, instance } = await save({
const { args, instance: inst } = await save({
initialDocId: '1234',
newCopyOnSave: false,
newTitle: 'hello there',
Expand All @@ -559,7 +558,7 @@ describe('Lens App', () => {

expect(args.redirectTo).not.toHaveBeenCalled();

instance.setProps({ docId: '1234' });
inst.setProps({ docId: '1234' });

expect(args.docStorage.load).toHaveBeenCalledTimes(1);
});
Expand All @@ -569,7 +568,7 @@ describe('Lens App', () => {
args.editorFrame = frame;
(args.docStorage.save as jest.Mock).mockRejectedValue({ message: 'failed' });

const instance = mount(<App {...args} />);
instance = mount(<App {...args} />);

const onChange = frame.mount.mock.calls[0][1].onChange;
act(() =>
Expand All @@ -581,13 +580,12 @@ describe('Lens App', () => {

instance.update();

testSave(instance, { newCopyOnSave: false, newTitle: 'hello there' });

await waitForPromises();
await act(async () => {
testSave(instance, { newCopyOnSave: false, newTitle: 'hello there' });
});

expect(args.core.notifications.toasts.addDanger).toHaveBeenCalled();
expect(args.redirectTo).not.toHaveBeenCalled();
await waitForPromises();

expect(getButton(instance).disableButton).toEqual(false);
});
Expand Down Expand Up @@ -616,8 +614,10 @@ describe('Lens App', () => {

const unpinned = esFilters.buildExistsFilter(field, indexPattern);
const pinned = esFilters.buildExistsFilter(pinnedField, indexPattern);
FilterManager.setFiltersStore([pinned], esFilters.FilterStateStore.GLOBAL_STATE);
await waitForPromises();

await act(async () => {
FilterManager.setFiltersStore([pinned], esFilters.FilterStateStore.GLOBAL_STATE);
});

const { args } = await save({
initialDocId: '1234',
Expand Down Expand Up @@ -695,7 +695,7 @@ describe('Lens App', () => {
const args = defaultArgs;
args.editorFrame = frame;

const instance = mount(<App {...args} />);
instance = mount(<App {...args} />);

expect(TopNavMenu).toHaveBeenCalledWith(
expect.objectContaining({
Expand All @@ -705,14 +705,14 @@ describe('Lens App', () => {
);

const onChange = frame.mount.mock.calls[0][1].onChange;
act(() =>

await act(async () => {
onChange({
filterableIndexPatterns: [{ id: '1', title: 'newIndex' }],
doc: ({ id: undefined, expression: 'valid expression' } as unknown) as Document,
})
);
});
});

await waitForPromises();
instance.update();

expect(TopNavMenu).toHaveBeenCalledWith(
Expand All @@ -723,14 +723,13 @@ describe('Lens App', () => {
);

// Do it again to verify that the dirty checking is done right
act(() =>

await act(async () => {
onChange({
filterableIndexPatterns: [{ id: '2', title: 'second index' }],
doc: ({ id: undefined, expression: 'valid expression' } as unknown) as Document,
})
);

await waitForPromises();
});
});

instance.update();

Expand All @@ -745,7 +744,7 @@ describe('Lens App', () => {
const args = defaultArgs;
args.editorFrame = frame;

const instance = mount(<App {...args} />);
instance = mount(<App {...args} />);

act(() =>
instance.find(TopNavMenu).prop('onQuerySubmit')!({
Expand Down Expand Up @@ -777,7 +776,7 @@ describe('Lens App', () => {
const args = defaultArgs;
args.editorFrame = frame;

const instance = mount(<App {...args} />);
instance = mount(<App {...args} />);
const indexPattern = ({ id: 'index1' } as unknown) as IIndexPattern;
const field = ({ name: 'myfield' } as unknown) as IFieldType;

Expand Down Expand Up @@ -819,7 +818,7 @@ describe('Lens App', () => {
const args = makeDefaultArgs();
args.editorFrame = frame;

const instance = mount(<App {...args} />);
instance = mount(<App {...args} />);

expect(TopNavMenu).toHaveBeenCalledWith(
expect.objectContaining({
Expand Down Expand Up @@ -862,7 +861,7 @@ describe('Lens App', () => {
const args = makeDefaultArgs();
args.editorFrame = frame;

const instance = mount(<App {...args} />);
instance = mount(<App {...args} />);

act(() => {
instance.find(TopNavMenu).prop('onSaved')!({
Expand Down Expand Up @@ -905,7 +904,7 @@ describe('Lens App', () => {
const args = makeDefaultArgs();
args.editorFrame = frame;

const instance = mount(<App {...args} />);
instance = mount(<App {...args} />);

act(() =>
instance.find(TopNavMenu).prop('onQuerySubmit')!({
Expand Down Expand Up @@ -941,7 +940,7 @@ describe('Lens App', () => {
const args = makeDefaultArgs();
args.editorFrame = frame;

const instance = mount(<App {...args} />);
instance = mount(<App {...args} />);

const onError = frame.mount.mock.calls[0][1].onError;
onError({ message: 'error' });
Expand Down
5 changes: 4 additions & 1 deletion x-pack/legacy/plugins/lens/public/debounced_component/debounced_component.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
import React from 'react';
import { mountWithIntl as mount } from 'test_utils/enzyme_helpers';
import { debouncedComponent } from './debounced_component';
import { act } from 'react-dom/test-utils';

describe('debouncedComponent', () => {
test('immediately renders', () => {
Expand All @@ -23,7 +24,9 @@ describe('debouncedComponent', () => {
const component = mount(<TestComponent title="there" />);
component.setProps({ title: 'yall' });
expect(component.text()).toEqual('there');
await new Promise(r => setTimeout(r, 1));
await act(async () => {
await new Promise(r => setTimeout(r, 1));
});
expect(component.text()).toEqual('yall');
});
});
Loading

0 comments on commit c6b7964

Please sign in to comment.