diff --git a/modules/router-store/spec/serializer.spec.ts b/modules/router-store/spec/serializer.spec.ts new file mode 100644 index 0000000000..cda454ad13 --- /dev/null +++ b/modules/router-store/spec/serializer.spec.ts @@ -0,0 +1,101 @@ +import { RouterStateSnapshot } from '@angular/router'; +import { DefaultRouterStateSerializer } from '../src'; + +describe('serializer', () => { + it('should serialize all properties', () => { + const serializer = new DefaultRouterStateSerializer(); + const snapshot = createSnapshot(); + const routerState = { + url: 'url', + root: snapshot, + } as RouterStateSnapshot; + + const actual = serializer.serialize(routerState); + const expected = { + url: 'url', + root: createExpectedSnapshot(), + }; + expect(actual).toEqual(expected); + }); + + it('should serialize with an empty routeConfig', () => { + const serializer = new DefaultRouterStateSerializer(); + const snapshot = { ...createSnapshot(), routeConfig: null }; + const routerState = { + url: 'url', + root: snapshot, + } as RouterStateSnapshot; + + const actual = serializer.serialize(routerState); + const expected = { + url: 'url', + root: { + ...createExpectedSnapshot(), + routeConfig: null, + component: undefined, + }, + }; + expect(actual).toEqual(expected); + }); + + it('should serialize children', () => { + const serializer = new DefaultRouterStateSerializer(); + const snapshot = { + ...createSnapshot(), + children: [createSnapshot('child')], + }; + const routerState = { + url: 'url', + root: snapshot, + } as RouterStateSnapshot; + + const actual = serializer.serialize(routerState); + + const expected = { + url: 'url', + root: { + ...createExpectedSnapshot(), + firstChild: createExpectedSnapshot('child'), + children: [createExpectedSnapshot('child')], + }, + }; + + expect(actual).toEqual(expected); + }); + + function createSnapshot(prefix = 'root'): any { + return { + params: `${prefix}-route.params`, + paramMap: `${prefix}-route.paramMap`, + data: `${prefix}-route.data`, + url: `${prefix}-route.url`, + outlet: `${prefix}-route.outlet`, + routeConfig: { + component: `${prefix}-route.routeConfig.component`, + path: `${prefix}-route.routeConfig.path`, + pathMatch: `${prefix}-route.routeConfig.pathMatch`, + redirectTo: `${prefix}-route.routeConfig.redirectTo`, + outlet: `${prefix}-route.routeConfig.outlet`, + }, + queryParams: `${prefix}-route.queryParams`, + queryParamMap: `${prefix}-route.queryParamMap`, + fragment: `${prefix}-route.fragment`, + root: `${prefix}-route.root`, + parent: `${prefix}-route.parent`, + pathFromRoot: `${prefix}-route.params`, + firstChild: null, + children: [], + }; + } + + function createExpectedSnapshot(prefix = 'root') { + return { + ...createSnapshot(prefix), + component: `${prefix}-route.routeConfig.component`, + root: undefined, + parent: undefined, + firstChild: undefined, + pathFromRoot: undefined, + }; + } +}); diff --git a/modules/router-store/src/serializer.ts b/modules/router-store/src/serializer.ts index 74b91c1666..23596ef3c5 100644 --- a/modules/router-store/src/serializer.ts +++ b/modules/router-store/src/serializer.ts @@ -39,9 +39,15 @@ export class DefaultRouterStateSerializer data: route.data, url: route.url, outlet: route.outlet, - routeConfig: { - component: route.routeConfig ? route.routeConfig.component : undefined, - }, + routeConfig: route.routeConfig + ? { + component: route.routeConfig.component, + path: route.routeConfig.path, + pathMatch: route.routeConfig.pathMatch, + redirectTo: route.routeConfig.redirectTo, + outlet: route.routeConfig.outlet, + } + : null, queryParams: route.queryParams, queryParamMap: route.queryParamMap, fragment: route.fragment, diff --git a/projects/ngrx.io/content/guide/migration/v7.md b/projects/ngrx.io/content/guide/migration/v7.md index cf5b61af8d..2f831f3939 100644 --- a/projects/ngrx.io/content/guide/migration/v7.md +++ b/projects/ngrx.io/content/guide/migration/v7.md @@ -94,6 +94,26 @@ AFTER: StoreRouterConnectingModule.forRoot(), ``` +### ActivatedRouteSnapshot.RouteConfig + +The default router serializer now returns a `null` value for `routeConfig` when `routeConfig` doesn't exist on the `ActivatedRouteSnapshot` instead of an empty object. + +BEFORE: + +```json +{ + "routeConfig": {} +} +``` + +AFTER: + +```json +{ + "routeConfig": null +} +``` + ## @ngrx/store-devtools The devtools is using the new `@ngrx/store-devtools/recompute` action to recompute its state instead of the `@ngrx/store/update-reducers` action.