diff --git a/.changeset/seven-states-sleep.md b/.changeset/seven-states-sleep.md new file mode 100644 index 0000000000..1e612b3346 --- /dev/null +++ b/.changeset/seven-states-sleep.md @@ -0,0 +1,5 @@ +--- +'@backstage/frontend-test-utils': patch +--- + +Fixed Router deprecation warning and switched to using new `RouterBlueprint` from `@backstage/plugin-app-api`. diff --git a/.patches/pr-32409.txt b/.patches/pr-32409.txt new file mode 100644 index 0000000000..a14d9feb37 --- /dev/null +++ b/.patches/pr-32409.txt @@ -0,0 +1 @@ +Fixes a deprecation warning for Router extension in tests \ No newline at end of file diff --git a/packages/frontend-test-utils/package.json b/packages/frontend-test-utils/package.json index 19fad62844..22a8565cf2 100644 --- a/packages/frontend-test-utils/package.json +++ b/packages/frontend-test-utils/package.json @@ -35,6 +35,7 @@ "@backstage/frontend-app-api": "workspace:^", "@backstage/frontend-plugin-api": "workspace:^", "@backstage/plugin-app": "workspace:^", + "@backstage/plugin-app-react": "workspace:^", "@backstage/test-utils": "workspace:^", "@backstage/types": "workspace:^", "@backstage/version-bridge": "workspace:^", diff --git a/packages/frontend-test-utils/src/app/renderInTestApp.tsx b/packages/frontend-test-utils/src/app/renderInTestApp.tsx index 747229e8d6..f7b1d4b58b 100644 --- a/packages/frontend-test-utils/src/app/renderInTestApp.tsx +++ b/packages/frontend-test-utils/src/app/renderInTestApp.tsx @@ -27,11 +27,12 @@ import { RouteRef, useRouteRef, IconComponent, - RouterBlueprint, NavItemBlueprint, createFrontendPlugin, FrontendFeature, + createFrontendModule, } from '@backstage/frontend-plugin-api'; +import { RouterBlueprint } from '@backstage/plugin-app-react'; import appPlugin from '@backstage/plugin-app'; const DEFAULT_MOCK_CONFIG = { @@ -154,15 +155,6 @@ export function renderInTestApp( return [coreExtensionData.reactElement(element)]; }, }), - RouterBlueprint.make({ - params: { - component: ({ children }) => ( - - {children} - - ), - }, - }), ]; if (options?.mountedRoutes) { @@ -189,6 +181,20 @@ export function renderInTestApp( } const features: FrontendFeature[] = [ + createFrontendModule({ + pluginId: 'app', + extensions: [ + RouterBlueprint.make({ + params: { + component: ({ children }) => ( + + {children} + + ), + }, + }), + ], + }), createFrontendPlugin({ pluginId: 'test', extensions, diff --git a/packages/frontend-test-utils/src/app/renderTestApp.tsx b/packages/frontend-test-utils/src/app/renderTestApp.tsx index e8d90cadd6..879e3fe1ae 100644 --- a/packages/frontend-test-utils/src/app/renderTestApp.tsx +++ b/packages/frontend-test-utils/src/app/renderTestApp.tsx @@ -17,16 +17,17 @@ import { createSpecializedApp } from '@backstage/frontend-app-api'; import { coreExtensionData, + createFrontendModule, createFrontendPlugin, ExtensionDefinition, FrontendFeature, - RouterBlueprint, } from '@backstage/frontend-plugin-api'; import { render } from '@testing-library/react'; import appPlugin from '@backstage/plugin-app'; import { JsonObject } from '@backstage/types'; import { ConfigReader } from '@backstage/config'; import { MemoryRouter } from 'react-router-dom'; +import { RouterBlueprint } from '@backstage/plugin-app-react'; const DEFAULT_MOCK_CONFIG = { app: { baseUrl: 'http://localhost:3000' }, @@ -74,20 +75,23 @@ const appPluginOverride = appPlugin.withOverrides({ * @public */ export function renderTestApp(options: RenderTestAppOptions) { - const extensions = [ - RouterBlueprint.make({ - params: { - component: ({ children }) => ( - - {children} - - ), - }, - }), - ...(options.extensions ?? []), - ]; + const extensions = [...(options.extensions ?? [])]; const features: FrontendFeature[] = [ + createFrontendModule({ + pluginId: 'app', + extensions: [ + RouterBlueprint.make({ + params: { + component: ({ children }) => ( + + {children} + + ), + }, + }), + ], + }), createFrontendPlugin({ pluginId: 'test', extensions, diff --git a/yarn.lock b/yarn.lock index e240d6a443..3e60fe9fe4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3952,6 +3952,7 @@ __metadata: "@backstage/frontend-app-api": "workspace:^" "@backstage/frontend-plugin-api": "workspace:^" "@backstage/plugin-app": "workspace:^" + "@backstage/plugin-app-react": "workspace:^" "@backstage/test-utils": "workspace:^" "@backstage/types": "workspace:^" "@backstage/version-bridge": "workspace:^"