diff --git a/.changeset/forty-insects-drop.md b/.changeset/forty-insects-drop.md
new file mode 100644
index 0000000000..e2a94662ed
--- /dev/null
+++ b/.changeset/forty-insects-drop.md
@@ -0,0 +1,5 @@
+---
+'@backstage/frontend-test-utils': patch
+---
+
+Updates for compatibility with the new extension IDs.
diff --git a/packages/frontend-test-utils/src/app/createExtensionTester.test.tsx b/packages/frontend-test-utils/src/app/createExtensionTester.test.tsx
index 398acf4c74..e738bee7d1 100644
--- a/packages/frontend-test-utils/src/app/createExtensionTester.test.tsx
+++ b/packages/frontend-test-utils/src/app/createExtensionTester.test.tsx
@@ -26,7 +26,7 @@ describe('createExtensionTester', () => {
it('should render a simple extension', async () => {
createExtensionTester(
createExtension({
- id: 'test',
+ namespace: 'test',
attachTo: { id: 'ignored', input: 'ignored' },
output: { element: coreExtensionData.reactElement },
factory: () => ({ element:
test
}),
@@ -39,7 +39,7 @@ describe('createExtensionTester', () => {
it('should render an extension even if disabled by default', async () => {
createExtensionTester(
createExtension({
- id: 'test',
+ namespace: 'test',
attachTo: { id: 'ignored', input: 'ignored' },
disabled: true,
output: { element: coreExtensionData.reactElement },
@@ -54,7 +54,7 @@ describe('createExtensionTester', () => {
expect(() =>
createExtensionTester(
createExtension({
- id: 'test',
+ namespace: 'test',
attachTo: { id: 'ignored', input: 'ignored' },
disabled: true,
output: { path: coreExtensionData.routePath },
@@ -62,7 +62,7 @@ describe('createExtensionTester', () => {
}),
).render(),
).toThrow(
- "Failed to instantiate extension 'core.router', input 'children' did not receive required extension data 'core.reactElement' from extension 'test'",
+ "Failed to instantiate extension 'core/router', input 'children' did not receive required extension data 'core.reactElement' from extension 'test'",
);
});
});
diff --git a/packages/frontend-test-utils/src/app/createExtensionTester.ts b/packages/frontend-test-utils/src/app/createExtensionTester.ts
index c95ece342d..b6d6542818 100644
--- a/packages/frontend-test-utils/src/app/createExtensionTester.ts
+++ b/packages/frontend-test-utils/src/app/createExtensionTester.ts
@@ -15,7 +15,12 @@
*/
import { createSpecializedApp } from '@backstage/frontend-app-api';
-import { Extension, createPlugin } from '@backstage/frontend-plugin-api';
+import {
+ ExtensionDefinition,
+ createExtensionOverrides,
+} from '@backstage/frontend-plugin-api';
+// eslint-disable-next-line @backstage/no-relative-monorepo-imports
+import { resolveExtensionDefinition } from '../../../frontend-plugin-api/src/wiring/resolveExtensionDefinition';
import { MockConfigApi } from '@backstage/test-utils';
import { JsonArray, JsonObject, JsonValue } from '@backstage/types';
import { RenderResult, render } from '@testing-library/react';
@@ -24,7 +29,7 @@ import { RenderResult, render } from '@testing-library/react';
export class ExtensionTester {
/** @internal */
static forSubject(
- subject: Extension,
+ subject: ExtensionDefinition,
options?: { config?: TConfig },
): ExtensionTester {
const tester = new ExtensionTester();
@@ -33,16 +38,22 @@ export class ExtensionTester {
}
readonly #extensions = new Array<{
- extension: Extension;
+ id: string;
+ extension: ExtensionDefinition;
config?: JsonValue;
}>();
add(
- extension: Extension,
+ extension: ExtensionDefinition,
options?: { config?: TConfig },
): ExtensionTester {
+ const withNamespace = {
+ ...extension,
+ namespace: extension.namespace ?? 'test',
+ };
this.#extensions.push({
- extension,
+ id: resolveExtensionDefinition(withNamespace).id,
+ extension: withNamespace,
config: options?.config as JsonValue,
});
@@ -61,25 +72,25 @@ export class ExtensionTester {
const extensionsConfig: JsonArray = [
...rest.map(entry => ({
- [entry.extension.id]: {
+ [entry.id]: {
config: entry.config,
},
})),
{
- [subject.extension.id]: {
- attachTo: { id: 'core.router', input: 'children' },
+ [subject.id]: {
+ attachTo: { id: 'core/router', input: 'children' },
config: subject.config,
disabled: false,
},
},
{
- 'core.layout': false,
+ 'core/layout': false,
},
{
- 'core.nav': false,
+ 'core/nav': false,
},
{
- 'core.routes': false,
+ 'core/routes': false,
},
];
@@ -93,8 +104,7 @@ export class ExtensionTester {
const app = createSpecializedApp({
features: [
- createPlugin({
- id: 'test',
+ createExtensionOverrides({
extensions: this.#extensions.map(entry => entry.extension),
}),
],
@@ -107,7 +117,7 @@ export class ExtensionTester {
/** @public */
export function createExtensionTester(
- subject: Extension,
+ subject: ExtensionDefinition,
options?: { config?: TConfig },
): ExtensionTester {
return ExtensionTester.forSubject(subject, options);
diff --git a/plugins/search-react/src/alpha.test.tsx b/plugins/search-react/src/alpha.test.tsx
index 11e0b3fdb0..6950dec664 100644
--- a/plugins/search-react/src/alpha.test.tsx
+++ b/plugins/search-react/src/alpha.test.tsx
@@ -44,7 +44,7 @@ describe('createSearchResultListItemExtension', () => {
const TechDocsSearchResultItemExtension =
createSearchResultListItemExtension({
- attachTo: { id: 'plugin.search.page', input: 'items' },
+ namespace: 'techdocs',
configSchema: createSchemaFromZod(z =>
z
.object({
@@ -66,12 +66,13 @@ describe('createSearchResultListItemExtension', () => {
const ExploreSearchResultItemExtension =
createSearchResultListItemExtension({
- attachTo: { id: 'plugin.search.page', input: 'items' },
+ namespace: 'explore',
predicate: result => result.type === 'explore',
component: async () => ExploreSearchResultItemComponent,
});
const SearchPageExtension = createPageExtension({
+ namespace: 'search',
defaultPath: '/',
inputs: {
items: createExtensionInput({
diff --git a/plugins/tech-radar/package.json b/plugins/tech-radar/package.json
index bcfcc7c583..2fba4121c7 100644
--- a/plugins/tech-radar/package.json
+++ b/plugins/tech-radar/package.json
@@ -68,6 +68,7 @@
"@backstage/cli": "workspace:^",
"@backstage/core-app-api": "workspace:^",
"@backstage/dev-utils": "workspace:^",
+ "@backstage/frontend-test-utils": "workspace:^",
"@backstage/test-utils": "workspace:^",
"@testing-library/dom": "^9.0.0",
"@testing-library/jest-dom": "^6.0.0",
diff --git a/plugins/tech-radar/src/alpha.test.tsx b/plugins/tech-radar/src/alpha.test.tsx
new file mode 100644
index 0000000000..37d39c412b
--- /dev/null
+++ b/plugins/tech-radar/src/alpha.test.tsx
@@ -0,0 +1,34 @@
+/*
+ * Copyright 2023 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { createExtensionTester } from '@backstage/frontend-test-utils';
+import { screen } from '@testing-library/react';
+import { TechRadarPage, sampleTechRadarApi } from './alpha';
+
+describe('TechRadarPage', () => {
+ beforeAll(() => {
+ Object.defineProperty(window.SVGElement.prototype, 'getBBox', {
+ value: () => ({ width: 100, height: 100 }),
+ configurable: true,
+ });
+ });
+
+ it('renders without exploding', async () => {
+ createExtensionTester(TechRadarPage).add(sampleTechRadarApi).render();
+
+ await expect(screen.findByText('Tech Radar')).resolves.toBeInTheDocument();
+ });
+});
diff --git a/plugins/tech-radar/src/alpha.tsx b/plugins/tech-radar/src/alpha.tsx
index 5d650bd245..295d084a9a 100644
--- a/plugins/tech-radar/src/alpha.tsx
+++ b/plugins/tech-radar/src/alpha.tsx
@@ -47,7 +47,7 @@ export const TechRadarPage = createPageExtension({
import('./components').then(m => ),
});
-const sampleTechRadarApi = createApiExtension({
+export const sampleTechRadarApi = createApiExtension({
factory() {
return createApiFactory(techRadarApiRef, new SampleTechRadarApi());
},
diff --git a/yarn.lock b/yarn.lock
index 45e22286fa..aac0b29773 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -9587,6 +9587,7 @@ __metadata:
"@backstage/core-plugin-api": "workspace:^"
"@backstage/dev-utils": "workspace:^"
"@backstage/frontend-plugin-api": "workspace:^"
+ "@backstage/frontend-test-utils": "workspace:^"
"@backstage/test-utils": "workspace:^"
"@backstage/theme": "workspace:^"
"@material-ui/core": ^4.12.2