test: cover nested route URL

packages/router-component-store/src/lib/global-router-store/nested-route-url.spec.ts

@@ -0,0 +1,112 @@
+import { RouterConfigOptions, Routes } from '@angular/router';
+import { firstValueFrom } from 'rxjs';
+import { RouterStore } from '../router-store';
+import { GlobalRouterStore } from './global-router-store';
+import { globalRouterStoreSetup } from './test-util/global-router-store-setup';
+import {
+  GlobalRouterStoreTestChildComponent,
+  GlobalRouterStoreTestGrandchildComponent,
+  GlobalRouterStoreTestParentComponent,
+} from './test-util/global-router-store-test-components';
+
+const routes: Routes = [
+  {
+    path: 'parent',
+    component: GlobalRouterStoreTestParentComponent,
+    children: [
+      {
+        path: 'child',
+        component: GlobalRouterStoreTestChildComponent,
+        children: [
+          {
+            path: 'grandchild',
+            component: GlobalRouterStoreTestGrandchildComponent,
+          },
+        ],
+      },
+    ],
+  },
+];
+
+const expectedUrls = {
+  parent: '/parent#fragment?query=param',
+  child: '/parent/child#fragment?query=param',
+  grandchild: '/parent/child/grandchild#fragment?query=param',
+} as const;
+
+describe(`${GlobalRouterStore.name} nested route URL`, () => {
+  describe('Given three layers of routes with components', () => {
+    const paramsInheritanceStrategies: RouterConfigOptions['paramsInheritanceStrategy'][] =
+      ['always', 'emptyOnly'];
+
+    describe.each(paramsInheritanceStrategies)(
+      '  And the "%s" route parameter inheritance strategy is used',
+      (paramsInheritanceStrategy) => {
+        it.each(
+          [
+            GlobalRouterStoreTestParentComponent,
+            GlobalRouterStoreTestChildComponent,
+            GlobalRouterStoreTestGrandchildComponent,
+          ].map((RoutedComponent) => ({ RoutedComponent }))
+        )(
+          `  And ${RouterStore.name} is injected at $RoutedComponent.name
+        When the ${GlobalRouterStoreTestGrandchildComponent.name} route is activated
+        Then the full URL for the ${GlobalRouterStoreTestGrandchildComponent.name} route is emitted`,
+          async ({ RoutedComponent }) => {
+            expect.assertions(1);
+            const { routerStore } = await globalRouterStoreSetup({
+              navigateTo: '/parent/child/grandchild#fragment?query=param',
+              paramsInheritanceStrategy,
+              RoutedComponent,
+              routes,
+            });
+
+            await expect(firstValueFrom(routerStore.url$)).resolves.toEqual(
+              expectedUrls.grandchild
+            );
+          }
+        );
+
+        it.each(
+          [
+            GlobalRouterStoreTestParentComponent,
+            GlobalRouterStoreTestChildComponent,
+          ].map((RoutedComponent) => ({ RoutedComponent }))
+        )(
+          `  And ${RouterStore.name} is injected at $RoutedComponent.name
+        When the ${GlobalRouterStoreTestChildComponent.name} route is activated
+        Then the full URL for the ${GlobalRouterStoreTestChildComponent.name} route is emitted`,
+          async ({ RoutedComponent }) => {
+            expect.assertions(1);
+            const { routerStore } = await globalRouterStoreSetup({
+              navigateTo: '/parent/child#fragment?query=param',
+              paramsInheritanceStrategy,
+              RoutedComponent,
+              routes,
+            });
+
+            await expect(firstValueFrom(routerStore.url$)).resolves.toEqual(
+              expectedUrls.child
+            );
+          }
+        );
+
+        it(`  And ${RouterStore.name} is injected at ${GlobalRouterStoreTestParentComponent}.name
+        When the ${GlobalRouterStoreTestParentComponent.name} route is activated
+        Then full URL for the ${GlobalRouterStoreTestParentComponent.name} route is emitted`, async () => {
+          expect.assertions(1);
+          const { routerStore } = await globalRouterStoreSetup({
+            navigateTo: '/parent#fragment?query=param',
+            paramsInheritanceStrategy,
+            RoutedComponent: GlobalRouterStoreTestParentComponent,
+            routes,
+          });
+
+          await expect(firstValueFrom(routerStore.url$)).resolves.toEqual(
+            expectedUrls.parent
+          );
+        });
+      }
+    );
+  });
+});

packages/router-component-store/src/lib/local-router-store/nested-route-url.spec.ts

@@ -0,0 +1,112 @@
+import { RouterConfigOptions, Routes } from '@angular/router';
+import { firstValueFrom } from 'rxjs';
+import { RouterStore } from '../router-store';
+import { LocalRouterStore } from './local-router-store';
+import { localRouterStoreSetup } from './test-util/local-router-store-setup';
+import {
+  LocalRouterStoreTestChildComponent,
+  LocalRouterStoreTestGrandchildComponent,
+  LocalRouterStoreTestParentComponent,
+} from './test-util/local-router-store-test-components';
+
+const routes: Routes = [
+  {
+    path: 'parent',
+    component: LocalRouterStoreTestParentComponent,
+    children: [
+      {
+        path: 'child',
+        component: LocalRouterStoreTestChildComponent,
+        children: [
+          {
+            path: 'grandchild',
+            component: LocalRouterStoreTestGrandchildComponent,
+          },
+        ],
+      },
+    ],
+  },
+];
+
+const expectedUrls = {
+  parent: '/parent#fragment?query=param',
+  child: '/parent/child#fragment?query=param',
+  grandchild: '/parent/child/grandchild#fragment?query=param',
+} as const;
+
+describe(`${LocalRouterStore.name} nested route URL`, () => {
+  describe('Given three layers of routes with components', () => {
+    const paramsInheritanceStrategies: RouterConfigOptions['paramsInheritanceStrategy'][] =
+      ['always', 'emptyOnly'];
+
+    describe.each(paramsInheritanceStrategies)(
+      '  And the "%s" route parameter inheritance strategy is used',
+      (paramsInheritanceStrategy) => {
+        it.each(
+          [
+            LocalRouterStoreTestParentComponent,
+            LocalRouterStoreTestChildComponent,
+            LocalRouterStoreTestGrandchildComponent,
+          ].map((RoutedComponent) => ({ RoutedComponent }))
+        )(
+          `  And ${RouterStore.name} is injected at $RoutedComponent.name
+        When the ${LocalRouterStoreTestGrandchildComponent.name} route is activated
+        Then the full URL for the ${LocalRouterStoreTestGrandchildComponent.name} route is emitted`,
+          async ({ RoutedComponent }) => {
+            expect.assertions(1);
+            const { routerStore } = await localRouterStoreSetup({
+              navigateTo: '/parent/child/grandchild#fragment?query=param',
+              paramsInheritanceStrategy,
+              RoutedComponent,
+              routes,
+            });
+
+            await expect(firstValueFrom(routerStore.url$)).resolves.toEqual(
+              expectedUrls.grandchild
+            );
+          }
+        );
+
+        it.each(
+          [
+            LocalRouterStoreTestParentComponent,
+            LocalRouterStoreTestChildComponent,
+          ].map((RoutedComponent) => ({ RoutedComponent }))
+        )(
+          `  And ${RouterStore.name} is injected at $RoutedComponent.name
+        When the ${LocalRouterStoreTestChildComponent.name} route is activated
+        Then the full URL for the ${LocalRouterStoreTestChildComponent.name} route is emitted`,
+          async ({ RoutedComponent }) => {
+            expect.assertions(1);
+            const { routerStore } = await localRouterStoreSetup({
+              navigateTo: '/parent/child#fragment?query=param',
+              paramsInheritanceStrategy,
+              RoutedComponent,
+              routes,
+            });
+
+            await expect(firstValueFrom(routerStore.url$)).resolves.toEqual(
+              expectedUrls.child
+            );
+          }
+        );
+
+        it(`  And ${RouterStore.name} is injected at ${LocalRouterStoreTestParentComponent}.name
+        When the ${LocalRouterStoreTestParentComponent.name} route is activated
+        Then full URL for the ${LocalRouterStoreTestParentComponent.name} route is emitted`, async () => {
+          expect.assertions(1);
+          const { routerStore } = await localRouterStoreSetup({
+            navigateTo: '/parent#fragment?query=param',
+            paramsInheritanceStrategy,
+            RoutedComponent: LocalRouterStoreTestParentComponent,
+            routes,
+          });
+
+          await expect(firstValueFrom(routerStore.url$)).resolves.toEqual(
+            expectedUrls.parent
+          );
+        });
+      }
+    );
+  });
+});