diff --git a/package.json b/package.json index 3826a6383613e..504fc2eb2a30e 100644 --- a/package.json +++ b/package.json @@ -131,7 +131,6 @@ "@hapi/inert": "^6.0.4", "@hapi/wreck": "^17.1.0", "@hello-pangea/dnd": "16.2.0", - "@juggle/resize-observer": "^3.4.0", "@kbn/aad-fixtures-plugin": "link:x-pack/test/alerting_api_integration/common/plugins/aad", "@kbn/ace": "link:packages/kbn-ace", "@kbn/actions-plugin": "link:x-pack/plugins/actions", @@ -1089,6 +1088,7 @@ "remark-stringify": "^8.0.3", "require-in-the-middle": "^7.2.0", "reselect": "^4.1.8", + "resize-observer-polyfill": "1.5.1", "rison-node": "1.0.2", "rxjs": "^7.5.5", "safe-squel": "^5.12.5", diff --git a/packages/kbn-test/src/jest/setup/polyfills.jsdom.js b/packages/kbn-test/src/jest/setup/polyfills.jsdom.js index 77aa4a6e389d1..8016e0bd2b910 100644 --- a/packages/kbn-test/src/jest/setup/polyfills.jsdom.js +++ b/packages/kbn-test/src/jest/setup/polyfills.jsdom.js @@ -28,3 +28,7 @@ if (!global.hasOwnProperty('TextEncoder')) { // // https://github.com/jsdom/jsdom/issues/2555 global.Blob = require('blob-polyfill').Blob; + +if (!global.hasOwnProperty('ResizeObserver')) { + global.ResizeObserver = require('resize-observer-polyfill'); +} diff --git a/packages/shared-ux/code_editor/impl/code_editor.test.tsx b/packages/shared-ux/code_editor/impl/code_editor.test.tsx index 155dab1a1fd84..90bce3fdda24c 100644 --- a/packages/shared-ux/code_editor/impl/code_editor.test.tsx +++ b/packages/shared-ux/code_editor/impl/code_editor.test.tsx @@ -68,11 +68,6 @@ describe('', () => { dispatchEvent: jest.fn(), })), }); - window.ResizeObserver = class ResizeObserver { - observe() {} - unobserve() {} - disconnect() {} - }; monaco.languages.register({ id: 'loglang' }); monaco.languages.setMonarchTokensProvider('loglang', simpleLogLang); diff --git a/packages/shared-ux/code_editor/impl/languages/grok/language.test.ts b/packages/shared-ux/code_editor/impl/languages/grok/language.test.ts index 7c8b23e672762..2beabc63c69c0 100644 --- a/packages/shared-ux/code_editor/impl/languages/grok/language.test.ts +++ b/packages/shared-ux/code_editor/impl/languages/grok/language.test.ts @@ -23,12 +23,6 @@ beforeAll(() => { dispatchEvent: jest.fn(), })), }); - window.ResizeObserver = class ResizeObserver { - observe() {} - unobserve() {} - disconnect() {} - }; - registerLanguage(Lang); // trigger tokenizer creation by instantiating a model, diff --git a/src/plugins/kibana_utils/public/resize_checker/resize_checker.test.ts b/src/plugins/kibana_utils/public/resize_checker/resize_checker.test.ts index 3e744c8ee19a1..1e11ab50800ad 100644 --- a/src/plugins/kibana_utils/public/resize_checker/resize_checker.test.ts +++ b/src/plugins/kibana_utils/public/resize_checker/resize_checker.test.ts @@ -11,8 +11,8 @@ import { EventEmitter } from 'events'; // If you want to know why these mocks are created, // please check: https://github.com/elastic/kibana/pull/44750 -jest.mock('@juggle/resize-observer'); -import { ResizeObserver } from '@juggle/resize-observer'; +jest.mock('resize-observer-polyfill'); +import ResizeObserver from 'resize-observer-polyfill'; class MockElement { public clientWidth: number; diff --git a/src/plugins/kibana_utils/public/resize_checker/resize_checker.ts b/src/plugins/kibana_utils/public/resize_checker/resize_checker.ts index 7ef8c073552c0..1e92e8c0fdfd8 100644 --- a/src/plugins/kibana_utils/public/resize_checker/resize_checker.ts +++ b/src/plugins/kibana_utils/public/resize_checker/resize_checker.ts @@ -8,7 +8,7 @@ import { EventEmitter } from 'events'; import { isEqual } from 'lodash'; -import { ResizeObserver } from '@juggle/resize-observer'; +import ResizeObserver from 'resize-observer-polyfill'; function getSize(el: HTMLElement): [number, number] { return [el.clientWidth, el.clientHeight]; diff --git a/x-pack/plugins/cloud_defend/public/test/__mocks__/resizeobserver.js b/x-pack/plugins/cloud_defend/public/test/__mocks__/resizeobserver.js deleted file mode 100644 index 489a06a024c71..0000000000000 --- a/x-pack/plugins/cloud_defend/public/test/__mocks__/resizeobserver.js +++ /dev/null @@ -1,21 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License - * 2.0; you may not use this file except in compliance with the Elastic License - * 2.0. - */ - -class ResizeObserver { - observe() { - // do nothing - } - unobserve() { - // do nothing - } - disconnect() { - // do nothing - } -} - -window.ResizeObserver = ResizeObserver; -export default ResizeObserver; diff --git a/x-pack/plugins/cloud_defend/public/test/test_provider.tsx b/x-pack/plugins/cloud_defend/public/test/test_provider.tsx index 560ca60f28243..e599e4063ac7c 100755 --- a/x-pack/plugins/cloud_defend/public/test/test_provider.tsx +++ b/x-pack/plugins/cloud_defend/public/test/test_provider.tsx @@ -16,7 +16,6 @@ import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public'; import { fleetMock } from '@kbn/fleet-plugin/public/mocks'; import type { CloudDefendPluginStartDeps } from '../types'; import './__mocks__/worker'; -import './__mocks__/resizeobserver'; import '@kbn/code-editor-mock/jest_helper'; // @ts-ignore-next diff --git a/x-pack/plugins/security_solution/public/resolver/types.ts b/x-pack/plugins/security_solution/public/resolver/types.ts index 57eb9c27429f7..cbf1e797e7467 100644 --- a/x-pack/plugins/security_solution/public/resolver/types.ts +++ b/x-pack/plugins/security_solution/public/resolver/types.ts @@ -5,7 +5,6 @@ * 2.0. */ -import type { ResizeObserver } from '@juggle/resize-observer'; import type React from 'react'; import type { Store, Middleware, Dispatch, AnyAction } from 'redux'; import type { BBox } from 'rbush'; diff --git a/x-pack/plugins/security_solution/public/resolver/view/side_effect_context.ts b/x-pack/plugins/security_solution/public/resolver/view/side_effect_context.ts index 6cb4d1ddf5e0a..a02af5eb20dd5 100644 --- a/x-pack/plugins/security_solution/public/resolver/view/side_effect_context.ts +++ b/x-pack/plugins/security_solution/public/resolver/view/side_effect_context.ts @@ -7,7 +7,6 @@ import type { Context } from 'react'; import { createContext } from 'react'; -import { ResizeObserver } from '@juggle/resize-observer'; import type { SideEffectors } from '../types'; /** diff --git a/x-pack/plugins/session_view/public/components/session_view/index.test.tsx b/x-pack/plugins/session_view/public/components/session_view/index.test.tsx index d2654fb973ea4..dcc8dd53c7986 100644 --- a/x-pack/plugins/session_view/public/components/session_view/index.test.tsx +++ b/x-pack/plugins/session_view/public/components/session_view/index.test.tsx @@ -18,7 +18,6 @@ import { SessionView } from '.'; import userEvent from '@testing-library/user-event'; import { useDateFormat } from '../../hooks'; import { GET_TOTAL_IO_BYTES_ROUTE, PROCESS_EVENTS_ROUTE } from '../../../common/constants'; -import { ResizeObserver } from '@juggle/resize-observer'; jest.mock('../../hooks/use_date_format'); const mockUseDateFormat = useDateFormat as jest.Mock; @@ -45,8 +44,6 @@ describe('SessionView component', () => { dispatchEvent: jest.fn(), })), }); - - global.ResizeObserver = ResizeObserver; }); beforeEach(() => { diff --git a/x-pack/plugins/session_view/public/components/tty_player/index.test.tsx b/x-pack/plugins/session_view/public/components/tty_player/index.test.tsx index 8cd457e321a31..327d39da48d00 100644 --- a/x-pack/plugins/session_view/public/components/tty_player/index.test.tsx +++ b/x-pack/plugins/session_view/public/components/tty_player/index.test.tsx @@ -15,7 +15,6 @@ import { sessionViewIOEventsMock } from '../../../common/mocks/responses/session import { AppContextTestRender, createAppRootMockRenderer } from '../../test'; import { TTYPlayerDeps, TTYPlayer } from '.'; import userEvent from '@testing-library/user-event'; -import { ResizeObserver } from '@juggle/resize-observer'; describe('TTYPlayer component', () => { beforeAll(() => { @@ -34,8 +33,6 @@ describe('TTYPlayer component', () => { dispatchEvent: jest.fn(), })), }); - - global.ResizeObserver = ResizeObserver; }); let render: () => ReturnType; diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/fields/request_body_field.test.tsx b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/fields/request_body_field.test.tsx index 2a6b340724b4d..2882104dbcb93 100644 --- a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/fields/request_body_field.test.tsx +++ b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/fields/request_body_field.test.tsx @@ -10,13 +10,10 @@ import 'jest-canvas-mock'; import React, { useState, useCallback } from 'react'; import userEvent from '@testing-library/user-event'; import { fireEvent, waitFor } from '@testing-library/react'; -import { mockGlobals } from '../../../utils/testing'; import { render } from '../../../utils/testing/rtl_helpers'; import { RequestBodyField } from './request_body_field'; import { CodeEditorMode } from '../types'; -mockGlobals(); - jest.mock('@elastic/eui/lib/services/accessibility/html_id_generator', () => ({ htmlIdGenerator: () => () => `id-${Math.random()}`, })); diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/fields/source_field.test.tsx b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/fields/source_field.test.tsx index 4b0fff014a26c..a55043e5c9658 100644 --- a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/fields/source_field.test.tsx +++ b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/fields/source_field.test.tsx @@ -7,12 +7,9 @@ import React from 'react'; import userEvent from '@testing-library/user-event'; -import { mockGlobals } from '../../../utils/testing'; import { render } from '../../../utils/testing/rtl_helpers'; import { SourceField } from './source_field'; -mockGlobals(); - jest.mock('@elastic/eui/lib/services/accessibility/html_id_generator', () => ({ ...jest.requireActual('@elastic/eui/lib/services/accessibility/html_id_generator'), htmlIdGenerator: () => () => `id-${Math.random()}`, diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_add_page.test.tsx b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_add_page.test.tsx index 47417ccb40d64..5317a36da9fc6 100644 --- a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_add_page.test.tsx +++ b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_add_page.test.tsx @@ -6,12 +6,9 @@ */ import React from 'react'; -import { mockGlobals } from '../../utils/testing'; import { render } from '../../utils/testing/rtl_helpers'; import { MonitorAddPage } from './monitor_add_page'; -mockGlobals(); - describe('MonitorAddPage', () => { it('renders correctly', async () => { const { getByText } = render(, { diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_edit_page.test.tsx b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_edit_page.test.tsx index b4ac90de35b44..0156876de0db7 100644 --- a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_edit_page.test.tsx +++ b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_edit_page.test.tsx @@ -8,7 +8,6 @@ import React from 'react'; import { fireEvent, waitFor } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; -import { mockGlobals } from '../../utils/testing'; import { render } from '../../utils/testing/rtl_helpers'; import { MonitorEditPage } from './monitor_edit_page'; import { useMonitorName } from '../../hooks/use_monitor_name'; @@ -20,8 +19,6 @@ import { PROFILES_MAP, } from '../../../../../common/constants/monitor_defaults'; -mockGlobals(); - jest.mock('@kbn/observability-shared-plugin/public'); jest.mock('../../hooks/use_monitor_name', () => ({ diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/utils/testing/__mocks__/resize_observer.mock.ts b/x-pack/plugins/synthetics/public/apps/synthetics/utils/testing/__mocks__/resize_observer.mock.ts deleted file mode 100644 index b13767609f76f..0000000000000 --- a/x-pack/plugins/synthetics/public/apps/synthetics/utils/testing/__mocks__/resize_observer.mock.ts +++ /dev/null @@ -1,20 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License - * 2.0; you may not use this file except in compliance with the Elastic License - * 2.0. - */ - -export class MockResizeObserver implements ResizeObserver { - private elements: Set = new Set(); - - observe(target: Element) { - this.elements.add(target); - } - unobserve(target: Element) { - this.elements.delete(target); - } - disconnect() { - this.elements.clear(); - } -} diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/utils/testing/index.ts b/x-pack/plugins/synthetics/public/apps/synthetics/utils/testing/index.ts index 8ba89472a8cf3..cebc9f5030293 100644 --- a/x-pack/plugins/synthetics/public/apps/synthetics/utils/testing/index.ts +++ b/x-pack/plugins/synthetics/public/apps/synthetics/utils/testing/index.ts @@ -5,5 +5,4 @@ * 2.0. */ -export * from './mock_globals'; export * from './rtl_helpers'; diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/utils/testing/mock_globals.ts b/x-pack/plugins/synthetics/public/apps/synthetics/utils/testing/mock_globals.ts deleted file mode 100644 index 7c987d9afb402..0000000000000 --- a/x-pack/plugins/synthetics/public/apps/synthetics/utils/testing/mock_globals.ts +++ /dev/null @@ -1,12 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License - * 2.0; you may not use this file except in compliance with the Elastic License - * 2.0. - */ - -import { MockResizeObserver } from './__mocks__/resize_observer.mock'; - -export function mockGlobals() { - global.ResizeObserver = MockResizeObserver; -} diff --git a/yarn.lock b/yarn.lock index 75d06af17d641..6a01fc486afe4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3060,7 +3060,7 @@ resolved "https://registry.yarnpkg.com/@jsdevtools/ono/-/ono-7.1.3.tgz#9df03bbd7c696a5c58885c34aa06da41c8543796" integrity sha512-4JQNk+3mVzK3xh2rqd6RB4J46qUR19azEHBneZyTZM+c456qOrbbM/5xcR8huNCCcbVt7+UmizG6GuUvPvKUYg== -"@juggle/resize-observer@^3.3.1", "@juggle/resize-observer@^3.4.0": +"@juggle/resize-observer@^3.3.1": version "3.4.0" resolved "https://registry.yarnpkg.com/@juggle/resize-observer/-/resize-observer-3.4.0.tgz#08d6c5e20cf7e4cc02fd181c4b0c225cd31dbb60" integrity sha512-dfLbk+PwWvFzSxwk3n5ySL0hfBog779o8h68wK/7/APo/7cgyWp5jcXockbxdk5kFRkbeXWm4Fbi9FrdN381sA== @@ -26968,7 +26968,7 @@ reselect@^4.0.0, reselect@^4.1.8: resolved "https://registry.npmjs.org/reselect/-/reselect-4.1.8.tgz" integrity sha512-ab9EmR80F/zQTMNeneUr4cv+jSwPJgIlvEmVwLerwrWVbpLlBuls9XHzIeTFy4cegU2NHBp3va0LKOzU5qFEYQ== -resize-observer-polyfill@^1.5.1: +resize-observer-polyfill@1.5.1, resize-observer-polyfill@^1.5.1: version "1.5.1" resolved "https://registry.yarnpkg.com/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz#0e9020dd3d21024458d4ebd27e23e40269810464" integrity sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg==