core-api: add full PrivateAppImpl test for bindRoutes

packages/core-api/src/app/App.test.ts

@@ -1,40 +0,0 @@
-/*
- * Copyright 2020 Spotify AB
- *
- * 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 { createExternalRouteRef, createRouteRef } from '../routing/RouteRef';
-import { generateBoundRoutes } from './App';
-
-describe('generateBoundRoutes', () => {
-  it('runs happy path', () => {
-    const external = { myRoute: createExternalRouteRef() };
-    const ref = createRouteRef({ path: '', title: '' });
-    const result = generateBoundRoutes(({ bind }) => {
-      bind(external, { myRoute: ref });
-    });
-
-    expect(result.get(external.myRoute)).toBe(ref);
-  });
-
-  it('throws on unknown keys', () => {
-    const external = { myRoute: createExternalRouteRef() };
-    const ref = createRouteRef({ path: '', title: '' });
-    expect(() =>
-      generateBoundRoutes(({ bind }) => {
-        bind(external, { someOtherRoute: ref } as any);
-      }),
-    ).toThrow('Key someOtherRoute is not an existing external route');
-  });
-});

packages/core-api/src/app/App.test.tsx

@@ -0,0 +1,128 @@
+/*
+ * Copyright 2020 Spotify AB
+ *
+ * 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 { renderWithEffects } from '@backstage/test-utils';
+import { lightTheme } from '@backstage/theme';
+import { screen } from '@testing-library/react';
+import React from 'react';
+import { BrowserRouter, Routes } from 'react-router-dom';
+import { createRoutableExtension } from '../extensions';
+import { defaultSystemIcons } from '../icons';
+import { createPlugin } from '../plugin';
+import { useRouteRef } from '../routing/hooks';
+import { createExternalRouteRef, createRouteRef } from '../routing/RouteRef';
+import { generateBoundRoutes, PrivateAppImpl } from './App';
+
+describe('generateBoundRoutes', () => {
+  it('runs happy path', () => {
+    const external = { myRoute: createExternalRouteRef() };
+    const ref = createRouteRef({ path: '', title: '' });
+    const result = generateBoundRoutes(({ bind }) => {
+      bind(external, { myRoute: ref });
+    });
+
+    expect(result.get(external.myRoute)).toBe(ref);
+  });
+
+  it('throws on unknown keys', () => {
+    const external = { myRoute: createExternalRouteRef() };
+    const ref = createRouteRef({ path: '', title: '' });
+    expect(() =>
+      generateBoundRoutes(({ bind }) => {
+        bind(external, { someOtherRoute: ref } as any);
+      }),
+    ).toThrow('Key someOtherRoute is not an existing external route');
+  });
+});
+
+describe('Integration Test', () => {
+  const plugin1RouteRef = createRouteRef({ path: '/blah1', title: '' });
+  const plugin2RouteRef = createRouteRef({ path: '/blah2', title: '' });
+  const externalRouteRef = createExternalRouteRef();
+
+  const plugin1 = createPlugin({
+    id: 'blob',
+    externalRoutes: {
+      foo: externalRouteRef,
+    },
+  });
+
+  const plugin2 = createPlugin({
+    id: 'plugin2',
+  });
+
+  const HiddenComponent = plugin2.provide(
+    createRoutableExtension({
+      component: () => null,
+      mountPoint: plugin2RouteRef,
+    }),
+  );
+
+  const ExposedComponent = plugin1.provide(
+    createRoutableExtension({
+      component: () => {
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        const routeRefFunction = useRouteRef(externalRouteRef);
+        return <div>Our Route Is: {routeRefFunction({})}</div>;
+      },
+      mountPoint: plugin1RouteRef,
+    }),
+  );
+
+  it('runs happy path', () => {
+    const components = {
+      NotFoundErrorPage: () => null,
+      BootErrorPage: () => null,
+      Progress: () => null,
+      Router: BrowserRouter,
+    };
+
+    const app = new PrivateAppImpl({
+      apis: [],
+      defaultApis: [],
+      themes: [
+        {
+          id: 'light',
+          title: 'Light Theme',
+          variant: 'light',
+          theme: lightTheme,
+        },
+      ],
+      icons: defaultSystemIcons,
+      plugins: [],
+      components,
+      bindRoutes: ({ bind }) => {
+        bind(plugin1.externalRoutes, { foo: plugin2RouteRef });
+      },
+    });
+
+    const Provider = app.getProvider();
+    const Router = app.getRouter();
+
+    renderWithEffects(
+      <Provider>
+        <Router>
+          <Routes>
+            <ExposedComponent path="/" />
+            <HiddenComponent path="/foo/bar" />
+          </Routes>
+        </Router>
+      </Provider>,
+    );
+
+    expect(screen.getByText('Our Route Is: /foo/bar')).toBeInTheDocument();
+  });
+});

packages/core-api/src/app/App.tsx

@@ -13,6 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+
 import React, {
   ComponentType,
   PropsWithChildren,