[Lens] Prepare Lens for jest-environment-jsdom migration (#95327)

* 🐛 Fix activeElement issue with Jest

* 🏷️ Fix type issue

* 👌 Removed expect-errors directives

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
Marco Liberati 2021-03-26 15:59:12 +01:00 committed by GitHub
parent dbd4b2bac8
commit 3f58b185d5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 50 additions and 12 deletions

View file

@ -85,6 +85,7 @@ export function mountWithIntl<T>(
childContextTypes,
...props
}: {
attachTo?: HTMLElement;
context?: any;
childContextTypes?: ValidationMap<any>;
} = {}

View file

@ -22,6 +22,22 @@ import { generateId } from '../../../id_generator';
jest.mock('../../../id_generator');
let container: HTMLDivElement | undefined;
beforeEach(() => {
container = document.createElement('div');
container.id = 'lensContainer';
document.body.appendChild(container);
});
afterEach(() => {
if (container && container.parentNode) {
container.parentNode.removeChild(container);
}
container = undefined;
});
describe('ConfigPanel', () => {
let mockVisualization: jest.Mocked<Visualization>;
let mockVisualization2: jest.Mocked<Visualization>;
@ -105,7 +121,9 @@ describe('ConfigPanel', () => {
describe('focus behavior when adding or removing layers', () => {
it('should focus the only layer when resetting the layer', () => {
const component = mountWithIntl(<LayerPanels {...getDefaultProps()} />);
const component = mountWithIntl(<LayerPanels {...getDefaultProps()} />, {
attachTo: container,
});
const firstLayerFocusable = component
.find(LayerPanel)
.first()
@ -126,7 +144,7 @@ describe('ConfigPanel', () => {
first: mockDatasource.publicAPIMock,
second: mockDatasource.publicAPIMock,
};
const component = mountWithIntl(<LayerPanels {...defaultProps} />);
const component = mountWithIntl(<LayerPanels {...defaultProps} />, { attachTo: container });
const secondLayerFocusable = component
.find(LayerPanel)
.at(1)
@ -147,7 +165,7 @@ describe('ConfigPanel', () => {
first: mockDatasource.publicAPIMock,
second: mockDatasource.publicAPIMock,
};
const component = mountWithIntl(<LayerPanels {...defaultProps} />);
const component = mountWithIntl(<LayerPanels {...defaultProps} />, { attachTo: container });
const firstLayerFocusable = component
.find(LayerPanel)
.first()
@ -169,7 +187,9 @@ describe('ConfigPanel', () => {
}
});
const component = mountWithIntl(<LayerPanels {...getDefaultProps()} dispatch={dispatch} />);
const component = mountWithIntl(<LayerPanels {...getDefaultProps()} dispatch={dispatch} />, {
attachTo: container,
});
act(() => {
component.find('[data-test-subj="lnsLayerAddButton"]').first().simulate('click');
});

View file

@ -7,22 +7,38 @@
import React from 'react';
import { act } from 'react-dom/test-utils';
import { EuiFormRow } from '@elastic/eui';
import { mountWithIntl } from '@kbn/test/jest';
import { Visualization } from '../../../types';
import { LayerPanel } from './layer_panel';
import { ChildDragDropProvider, DragDrop } from '../../../drag_drop';
import { coreMock } from '../../../../../../../src/core/public/mocks';
import { generateId } from '../../../id_generator';
import {
createMockVisualization,
createMockFramePublicAPI,
createMockDatasource,
DatasourceMock,
} from '../../mocks';
import { ChildDragDropProvider, DragDrop } from '../../../drag_drop';
import { EuiFormRow } from '@elastic/eui';
import { mountWithIntl } from '@kbn/test/jest';
import { Visualization } from '../../../types';
import { LayerPanel } from './layer_panel';
import { coreMock } from 'src/core/public/mocks';
import { generateId } from '../../../id_generator';
jest.mock('../../../id_generator');
let container: HTMLDivElement | undefined;
beforeEach(() => {
container = document.createElement('div');
container.id = 'lensContainer';
document.body.appendChild(container);
});
afterEach(() => {
if (container && container.parentNode) {
container.parentNode.removeChild(container);
}
container = undefined;
});
const defaultContext = {
dragging: undefined,
setDragging: jest.fn(),
@ -642,7 +658,8 @@ describe('LayerPanel', () => {
const component = mountWithIntl(
<ChildDragDropProvider {...defaultContext} dragging={draggingOperation}>
<LayerPanel {...getDefaultProps()} />
</ChildDragDropProvider>
</ChildDragDropProvider>,
{ attachTo: container }
);
act(() => {
component.find(DragDrop).at(1).prop('onDrop')!(draggingOperation, 'reorder');