Skip to content

Commit 63a699b

Browse files
committed
[Lens] remove react warnings (#59574)
1 parent bb452a8 commit 63a699b

7 files changed

Lines changed: 746 additions & 780 deletions

File tree

x-pack/legacy/plugins/lens/public/app_plugin/app.test.tsx

Lines changed: 67 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -38,11 +38,6 @@ jest
3838

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

41-
const waitForPromises = async () =>
42-
act(async () => {
43-
await new Promise(resolve => setTimeout(resolve));
44-
});
45-
4641
function createMockFrame(): jest.Mocked<EditorFrameInstance> {
4742
return {
4843
mount: jest.fn((el, props) => {}),
@@ -86,6 +81,7 @@ function createMockFilterManager() {
8681
describe('Lens App', () => {
8782
let frame: jest.Mocked<EditorFrameInstance>;
8883
let core: ReturnType<typeof coreMock['createStart']>;
84+
let instance: ReactWrapper;
8985

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

206202
it('sets breadcrumbs when the document title changes', async () => {
207203
const defaultArgs = makeDefaultArgs();
208-
const instance = mount(<App {...defaultArgs} />);
204+
instance = mount(<App {...defaultArgs} />);
209205

210206
expect(core.chrome.setBreadcrumbs).toHaveBeenCalledWith([
211207
{ text: 'Visualize', href: '/testbasepath/app/kibana#/visualize' },
@@ -221,10 +217,9 @@ describe('Lens App', () => {
221217
datasourceMetaData: { filterableIndexPatterns: [{ id: '1', title: 'saved' }] },
222218
},
223219
});
224-
225-
instance.setProps({ docId: '1234' });
226-
227-
await waitForPromises();
220+
await act(async () => {
221+
instance.setProps({ docId: '1234' });
222+
});
228223

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

257-
const instance = mount(<App {...args} />);
252+
instance = mount(<App {...args} />);
258253

259-
instance.setProps({ docId: '1234' });
260-
await waitForPromises();
254+
await act(async () => {
255+
instance.setProps({ docId: '1234' });
256+
});
261257

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

295-
const instance = mount(<App {...args} />);
291+
instance = mount(<App {...args} />);
292+
await act(async () => {
293+
instance.setProps({ docId: '1234' });
294+
});
296295

297-
instance.setProps({ docId: '1234' });
298-
await waitForPromises();
299-
instance.setProps({ docId: '1234' });
300-
await waitForPromises();
296+
await act(async () => {
297+
instance.setProps({ docId: '1234' });
298+
});
301299

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

304-
instance.setProps({ docId: '9876' });
305-
await waitForPromises();
302+
await act(async () => {
303+
instance.setProps({ docId: '9876' });
304+
});
306305

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

315-
const instance = mount(<App {...args} />);
314+
instance = mount(<App {...args} />);
316315

317-
instance.setProps({ docId: '1234' });
318-
await waitForPromises();
316+
await act(async () => {
317+
instance.setProps({ docId: '1234' });
318+
});
319319

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

356-
function getButton(instance: ReactWrapper): TopNavMenuData {
357-
return (instance
356+
function getButton(inst: ReactWrapper): TopNavMenuData {
357+
return (inst
358358
.find('[data-test-subj="lnsApp_topNav"]')
359359
.prop('config') as TopNavMenuData[]).find(
360360
button => button.testId === 'lnsApp_saveButton'
361361
)!;
362362
}
363363

364-
function testSave(instance: ReactWrapper, saveProps: SaveProps) {
365-
act(() => {
366-
getButton(instance).run(instance.getDOMNode());
367-
});
364+
async function testSave(inst: ReactWrapper, saveProps: SaveProps) {
365+
await getButton(inst).run(inst.getDOMNode());
368366

369-
instance.update();
367+
inst.update();
370368

371-
const handler = instance.findWhere(el => el.prop('onSave')).prop('onSave') as (
369+
const handler = inst.findWhere(el => el.prop('onSave')).prop('onSave') as (
372370
p: unknown
373371
) => void;
374372
handler(saveProps);
@@ -406,9 +404,9 @@ describe('Lens App', () => {
406404
expression: 'kibana 2',
407405
}));
408406

409-
const instance = mount(<App {...args} />);
410-
411-
await waitForPromises();
407+
await act(async () => {
408+
instance = mount(<App {...args} />);
409+
});
412410

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

429427
expect(getButton(instance).disableButton).toEqual(false);
430-
testSave(instance, saveProps);
431428

432-
await waitForPromises();
429+
await act(async () => {
430+
testSave(instance, saveProps);
431+
});
433432

434433
return { args, instance };
435434
}
@@ -445,7 +444,7 @@ describe('Lens App', () => {
445444
};
446445
args.editorFrame = frame;
447446

448-
const instance = mount(<App {...args} />);
447+
instance = mount(<App {...args} />);
449448

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

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

472-
const instance = mount(<App {...args} />);
471+
instance = mount(<App {...args} />);
473472
expect(getButton(instance).disableButton).toEqual(true);
474473

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

491-
const instance = mount(<App {...args} />);
490+
instance = mount(<App {...args} />);
492491

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

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

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

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

522-
instance.setProps({ docId: 'aaa' });
521+
inst.setProps({ docId: 'aaa' });
523522

524523
expect(args.docStorage.load).not.toHaveBeenCalled();
525524
});
526525

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

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

542-
instance.setProps({ docId: 'aaa' });
541+
inst.setProps({ docId: 'aaa' });
543542

544543
expect(args.docStorage.load).toHaveBeenCalledTimes(1);
545544
});
546545

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

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

562-
instance.setProps({ docId: '1234' });
561+
inst.setProps({ docId: '1234' });
563562

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

572-
const instance = mount(<App {...args} />);
571+
instance = mount(<App {...args} />);
573572

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

582581
instance.update();
583582

584-
testSave(instance, { newCopyOnSave: false, newTitle: 'hello there' });
585-
586-
await waitForPromises();
583+
await act(async () => {
584+
testSave(instance, { newCopyOnSave: false, newTitle: 'hello there' });
585+
});
587586

588587
expect(args.core.notifications.toasts.addDanger).toHaveBeenCalled();
589588
expect(args.redirectTo).not.toHaveBeenCalled();
590-
await waitForPromises();
591589

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

617615
const unpinned = esFilters.buildExistsFilter(field, indexPattern);
618616
const pinned = esFilters.buildExistsFilter(pinnedField, indexPattern);
619-
FilterManager.setFiltersStore([pinned], esFilters.FilterStateStore.GLOBAL_STATE);
620-
await waitForPromises();
617+
618+
await act(async () => {
619+
FilterManager.setFiltersStore([pinned], esFilters.FilterStateStore.GLOBAL_STATE);
620+
});
621621

622622
const { args } = await save({
623623
initialDocId: '1234',
@@ -695,7 +695,7 @@ describe('Lens App', () => {
695695
const args = defaultArgs;
696696
args.editorFrame = frame;
697697

698-
const instance = mount(<App {...args} />);
698+
instance = mount(<App {...args} />);
699699

700700
expect(TopNavMenu).toHaveBeenCalledWith(
701701
expect.objectContaining({
@@ -705,14 +705,14 @@ describe('Lens App', () => {
705705
);
706706

707707
const onChange = frame.mount.mock.calls[0][1].onChange;
708-
act(() =>
708+
709+
await act(async () => {
709710
onChange({
710711
filterableIndexPatterns: [{ id: '1', title: 'newIndex' }],
711712
doc: ({ id: undefined, expression: 'valid expression' } as unknown) as Document,
712-
})
713-
);
713+
});
714+
});
714715

715-
await waitForPromises();
716716
instance.update();
717717

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

725725
// Do it again to verify that the dirty checking is done right
726-
act(() =>
726+
727+
await act(async () => {
727728
onChange({
728729
filterableIndexPatterns: [{ id: '2', title: 'second index' }],
729730
doc: ({ id: undefined, expression: 'valid expression' } as unknown) as Document,
730-
})
731-
);
732-
733-
await waitForPromises();
731+
});
732+
});
734733

735734
instance.update();
736735

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

748-
const instance = mount(<App {...args} />);
747+
instance = mount(<App {...args} />);
749748

750749
act(() =>
751750
instance.find(TopNavMenu).prop('onQuerySubmit')!({
@@ -777,7 +776,7 @@ describe('Lens App', () => {
777776
const args = defaultArgs;
778777
args.editorFrame = frame;
779778

780-
const instance = mount(<App {...args} />);
779+
instance = mount(<App {...args} />);
781780
const indexPattern = ({ id: 'index1' } as unknown) as IIndexPattern;
782781
const field = ({ name: 'myfield' } as unknown) as IFieldType;
783782

@@ -819,7 +818,7 @@ describe('Lens App', () => {
819818
const args = makeDefaultArgs();
820819
args.editorFrame = frame;
821820

822-
const instance = mount(<App {...args} />);
821+
instance = mount(<App {...args} />);
823822

824823
expect(TopNavMenu).toHaveBeenCalledWith(
825824
expect.objectContaining({
@@ -862,7 +861,7 @@ describe('Lens App', () => {
862861
const args = makeDefaultArgs();
863862
args.editorFrame = frame;
864863

865-
const instance = mount(<App {...args} />);
864+
instance = mount(<App {...args} />);
866865

867866
act(() => {
868867
instance.find(TopNavMenu).prop('onSaved')!({
@@ -905,7 +904,7 @@ describe('Lens App', () => {
905904
const args = makeDefaultArgs();
906905
args.editorFrame = frame;
907906

908-
const instance = mount(<App {...args} />);
907+
instance = mount(<App {...args} />);
909908

910909
act(() =>
911910
instance.find(TopNavMenu).prop('onQuerySubmit')!({
@@ -941,7 +940,7 @@ describe('Lens App', () => {
941940
const args = makeDefaultArgs();
942941
args.editorFrame = frame;
943942

944-
const instance = mount(<App {...args} />);
943+
instance = mount(<App {...args} />);
945944

946945
const onError = frame.mount.mock.calls[0][1].onError;
947946
onError({ message: 'error' });

x-pack/legacy/plugins/lens/public/debounced_component/debounced_component.test.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
import React from 'react';
88
import { mountWithIntl as mount } from 'test_utils/enzyme_helpers';
99
import { debouncedComponent } from './debounced_component';
10+
import { act } from 'react-dom/test-utils';
1011

1112
describe('debouncedComponent', () => {
1213
test('immediately renders', () => {
@@ -23,7 +24,9 @@ describe('debouncedComponent', () => {
2324
const component = mount(<TestComponent title="there" />);
2425
component.setProps({ title: 'yall' });
2526
expect(component.text()).toEqual('there');
26-
await new Promise(r => setTimeout(r, 1));
27+
await act(async () => {
28+
await new Promise(r => setTimeout(r, 1));
29+
});
2730
expect(component.text()).toEqual('yall');
2831
});
2932
});

0 commit comments

Comments
 (0)