From f2461b9b6fb7cd04418a44c07c63d2f7dd083906 Mon Sep 17 00:00:00 2001 From: Tim Sullivan Date: Tue, 29 Apr 2025 17:14:28 -0700 Subject: [PATCH] [Core Rendering Service] Mark KibanaRenderContextProvider as deprecated (#219313) ## Summary Set `KibanaRenderContextProvider` as deprecated and comment that consumers should use `core.rendering.addContext` instead. ### Checklist Check the PR satisfies following conditions. Reviewers should verify this PR satisfies this list as well. - [x] [Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html) was added for features that require explanation or tutorials --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: Christiane (Tina) Heiligers --- .../writing_stable_functional_tests.mdx | 2 +- .../__snapshots__/error_toast.test.tsx.snap | 44 ++++++++++--------- .../toasts_service.test.tsx.snap | 42 ++++++++++-------- ...ice.mock.ts => rendering_service.mock.tsx} | 9 +++- .../rendering/browser-mocks/tsconfig.json | 3 +- .../kibana_context/render/render_provider.tsx | 2 + .../datasources/common/field_item.test.tsx | 17 +++---- 7 files changed, 66 insertions(+), 53 deletions(-) rename src/core/packages/rendering/browser-mocks/src/{rendering_service.mock.ts => rendering_service.mock.tsx} (81%) diff --git a/dev_docs/operations/writing_stable_functional_tests.mdx b/dev_docs/operations/writing_stable_functional_tests.mdx index 42aadf702ba9..27587a9f98f7 100644 --- a/dev_docs/operations/writing_stable_functional_tests.mdx +++ b/dev_docs/operations/writing_stable_functional_tests.mdx @@ -77,7 +77,7 @@ Even if you are very careful, the more UI automation you do the more likely you ## Incorrect usage of EUI components in React code will cause a functional test failure -For EUI to support theming and internationalization, EUI components in your React application must be wrapped in `EuiProvider` (more preferably, use the `KibanaRenderContextProvider` wrapper). The functional test runner treats EUI as a first-class citizen and will throw an error when incorrect usage of EUI is detected. However, experiencing this type of failure in a test run is unlikely: in dev mode, a toast message alerts developers of incorrect EUI usage in real-time. +For EUI to support theming and internationalization, EUI components in your React application must be wrapped in `EuiProvider` (more preferably, use the ) wrapper. The functional test runner treats EUI as a first-class citizen and will throw an error when incorrect usage of EUI is detected. However, experiencing this type of failure in a test run is unlikely: in dev mode, a toast message alerts developers of incorrect EUI usage in real-time. ## Do you really need a functional test for this? diff --git a/src/core/packages/notifications/browser-internal/src/toasts/__snapshots__/error_toast.test.tsx.snap b/src/core/packages/notifications/browser-internal/src/toasts/__snapshots__/error_toast.test.tsx.snap index 6c91293f6830..2c90434d83e5 100644 --- a/src/core/packages/notifications/browser-internal/src/toasts/__snapshots__/error_toast.test.tsx.snap +++ b/src/core/packages/notifications/browser-internal/src/toasts/__snapshots__/error_toast.test.tsx.snap @@ -1,26 +1,28 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`renders matching snapshot 1`] = ` - -

- This is the toast message -

-
- + +

- - -

- + This is the toast message +

+
+ + + +
+ + `; diff --git a/src/core/packages/notifications/browser-internal/src/toasts/__snapshots__/toasts_service.test.tsx.snap b/src/core/packages/notifications/browser-internal/src/toasts/__snapshots__/toasts_service.test.tsx.snap index 6187810ecdd4..143cc4887f8c 100644 --- a/src/core/packages/notifications/browser-internal/src/toasts/__snapshots__/toasts_service.test.tsx.snap +++ b/src/core/packages/notifications/browser-internal/src/toasts/__snapshots__/toasts_service.test.tsx.snap @@ -3,31 +3,35 @@ exports[`#start() renders the GlobalToastList into the targetDomElement param 1`] = ` Array [ Array [ - + + , + } + } + /> + + ,
, diff --git a/src/core/packages/rendering/browser-mocks/src/rendering_service.mock.ts b/src/core/packages/rendering/browser-mocks/src/rendering_service.mock.tsx similarity index 81% rename from src/core/packages/rendering/browser-mocks/src/rendering_service.mock.ts rename to src/core/packages/rendering/browser-mocks/src/rendering_service.mock.tsx index cf9a2c8c605d..561363276621 100644 --- a/src/core/packages/rendering/browser-mocks/src/rendering_service.mock.ts +++ b/src/core/packages/rendering/browser-mocks/src/rendering_service.mock.tsx @@ -7,7 +7,10 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ +import React from 'react'; import type { RenderingService } from '@kbn/core-rendering-browser'; +import { EuiProvider } from '@elastic/eui'; +import { I18nProvider } from '@kbn/i18n-react'; /** * This is declared internally to avoid a circular dependency issue @@ -27,7 +30,11 @@ const createMockInternal = () => { const createMock = () => { const mocked: jest.Mocked = { - addContext: jest.fn().mockImplementation((element) => element), + addContext: jest.fn().mockImplementation((element) => ( + + {element} + + )), }; return mocked; }; diff --git a/src/core/packages/rendering/browser-mocks/tsconfig.json b/src/core/packages/rendering/browser-mocks/tsconfig.json index 09761afb8329..9473334a2e78 100644 --- a/src/core/packages/rendering/browser-mocks/tsconfig.json +++ b/src/core/packages/rendering/browser-mocks/tsconfig.json @@ -12,7 +12,8 @@ "**/*.tsx" ], "kbn_references": [ - "@kbn/core-rendering-browser" + "@kbn/core-rendering-browser", + "@kbn/i18n-react" ], "exclude": [ "target/**/*" diff --git a/src/platform/packages/shared/react/kibana_context/render/render_provider.tsx b/src/platform/packages/shared/react/kibana_context/render/render_provider.tsx index f9762d08d7a5..9e907d14b5dc 100644 --- a/src/platform/packages/shared/react/kibana_context/render/render_provider.tsx +++ b/src/platform/packages/shared/react/kibana_context/render/render_provider.tsx @@ -21,7 +21,9 @@ export type KibanaRenderContextProviderProps = Omit diff --git a/x-pack/platform/plugins/shared/lens/public/datasources/common/field_item.test.tsx b/x-pack/platform/plugins/shared/lens/public/datasources/common/field_item.test.tsx index 7260672b6435..3935aca56cd4 100644 --- a/x-pack/platform/plugins/shared/lens/public/datasources/common/field_item.test.tsx +++ b/x-pack/platform/plugins/shared/lens/public/datasources/common/field_item.test.tsx @@ -21,7 +21,6 @@ import { fieldFormatsServiceMock } from '@kbn/field-formats-plugin/public/mocks' import { IndexPattern } from '../../types'; import { chartPluginMock } from '@kbn/charts-plugin/public/mocks'; import { documentField } from '../form_based/document_field'; -import { KibanaRenderContextProvider } from '@kbn/react-kibana-context-render'; jest.mock('@kbn/unified-field-list/src/services/field_stats', () => ({ loadFieldStats: jest.fn().mockResolvedValue({}), @@ -156,13 +155,11 @@ describe('Lens Field Item', () => { const Wrapper: React.FC<{ children: React.ReactNode; }> = ({ children }) => { - return ( - - - - {children} - - + return mockedServices.core.rendering.addContext( + + + {children} + ); }; @@ -396,11 +393,11 @@ describe('Lens Field Item', () => { }; render( - + mockedServices.core.rendering.addContext( - + ) ); await waitFor(() => { expect(screen.getByTestId('field-bytes-showDetails')).toBeInTheDocument();