From 7db384cef28fb61a113c7624de6c1c2800eff4d7 Mon Sep 17 00:00:00 2001
From: Vincenzo Scamporlino <vincenzos@spotify.com>
Date: Tue, 7 Oct 2025 20:58:42 +0200
Subject: [PATCH] app: migrate to renderTestApp

Signed-off-by: Vincenzo Scamporlino <vincenzos@spotify.com>
---
 .../DefaultSwappableComponentsApi.test.tsx    | 81 ++++++++++++++++---
 .../app/src/extensions/DialogDisplay.test.tsx |  4 +-
 2 files changed, 70 insertions(+), 15 deletions(-)

diff --git a/plugins/app/src/apis/SwappableComponentsApi/DefaultSwappableComponentsApi.test.tsx b/plugins/app/src/apis/SwappableComponentsApi/DefaultSwappableComponentsApi.test.tsx
index 07ef891926..bdd81f338c 100644
--- a/plugins/app/src/apis/SwappableComponentsApi/DefaultSwappableComponentsApi.test.tsx
+++ b/plugins/app/src/apis/SwappableComponentsApi/DefaultSwappableComponentsApi.test.tsx
@@ -16,6 +16,7 @@
 
 import {
   ApiBlueprint,
+  AppRootElementBlueprint,
   createExtensionInput,
   createFrontendModule,
   createSwappableComponent,
@@ -24,7 +25,7 @@ import {
 } from '@backstage/frontend-plugin-api';
 import { DefaultSwappableComponentsApi } from './DefaultSwappableComponentsApi';
 import { render, screen } from '@testing-library/react';
-import { renderInTestApp } from '@backstage/frontend-test-utils';
+import { renderInTestApp, renderTestApp } from '@backstage/frontend-test-utils';
 
 const { ref: testRefA } = createSwappableComponent({ id: 'test.a' });
 const { ref: testRefB1 } = createSwappableComponent({ id: 'test.b' });
@@ -149,8 +150,17 @@ describe('DefaultSwappableComponentsApi', () => {
           id: 'test.mock',
         });
 
-        renderInTestApp(<MockComponent />, {
-          extensions: [api],
+        renderTestApp({
+          extensions: [
+            AppRootElementBlueprint.make({
+              name: 'derp',
+              params: define =>
+                define({
+                  element: <MockComponent />,
+                }),
+            }),
+            api,
+          ],
         });
 
         await expect(
@@ -164,8 +174,17 @@ describe('DefaultSwappableComponentsApi', () => {
           loader: () => () => <div>test.mock</div>,
         });
 
-        renderInTestApp(<MockComponent />, {
-          extensions: [api],
+        renderTestApp({
+          extensions: [
+            AppRootElementBlueprint.make({
+              name: 'derp',
+              params: define =>
+                define({
+                  element: <MockComponent />,
+                }),
+            }),
+            api,
+          ],
         });
 
         await expect(
@@ -179,8 +198,17 @@ describe('DefaultSwappableComponentsApi', () => {
           loader: async () => () => <div>test.mock</div>,
         });
 
-        renderInTestApp(<MockComponent />, {
-          extensions: [api],
+        renderTestApp({
+          extensions: [
+            AppRootElementBlueprint.make({
+              name: 'derp',
+              params: define =>
+                define({
+                  element: <MockComponent />,
+                }),
+            }),
+            api,
+          ],
         });
 
         await expect(
@@ -202,8 +230,17 @@ describe('DefaultSwappableComponentsApi', () => {
             }),
         });
 
-        renderInTestApp(<MockComponent />, {
-          extensions: [api],
+        renderTestApp({
+          extensions: [
+            AppRootElementBlueprint.make({
+              name: 'derp',
+              params: define =>
+                define({
+                  element: <MockComponent />,
+                }),
+            }),
+            api,
+          ],
           features: [
             createFrontendModule({
               pluginId: 'app',
@@ -231,8 +268,17 @@ describe('DefaultSwappableComponentsApi', () => {
             }),
         });
 
-        renderInTestApp(<MockComponent />, {
-          extensions: [api],
+        renderTestApp({
+          extensions: [
+            AppRootElementBlueprint.make({
+              name: 'derp',
+              params: define =>
+                define({
+                  element: <MockComponent />,
+                }),
+            }),
+            api,
+          ],
           features: [
             createFrontendModule({
               pluginId: 'app',
@@ -264,8 +310,17 @@ describe('DefaultSwappableComponentsApi', () => {
             }),
         });
 
-        renderInTestApp(<MockComponent external="test" />, {
-          extensions: [api],
+        renderTestApp({
+          extensions: [
+            AppRootElementBlueprint.make({
+              name: 'derp',
+              params: define =>
+                define({
+                  element: <MockComponent external="test" />,
+                }),
+            }),
+            api,
+          ],
           features: [
             createFrontendModule({
               pluginId: 'app',
diff --git a/plugins/app/src/extensions/DialogDisplay.test.tsx b/plugins/app/src/extensions/DialogDisplay.test.tsx
index 8f7eb4e857..dbad551fcb 100644
--- a/plugins/app/src/extensions/DialogDisplay.test.tsx
+++ b/plugins/app/src/extensions/DialogDisplay.test.tsx
@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { renderInTestApp } from '@backstage/frontend-test-utils';
+import { renderTestApp } from '@backstage/frontend-test-utils';
 import { act, useEffect } from 'react';
 import {
   AppRootElementBlueprint,
@@ -29,7 +29,7 @@ async function withDialogApi<T>(
   callback: (dialogApi: DialogApi) => Promise<T>,
 ) {
   const deferred = createDeferred<DialogApi>();
-  await renderInTestApp(<div />, {
+  await renderTestApp({
     extensions: [
       AppRootElementBlueprint.makeWithOverrides({
         name: 'derp',