Skip to content
Permalink
Browse files
fix(router): Ensure ActivatedRouteSnapshot#title has correct value (#…
…47481)

ActivatedRouteSnapshot data gets mutated in the resolve phase of the Router. The title is assigned as part of this.
As a result, the title must be a getter in order to pick up the value that was note available during the class creation.

fixes #47459

BREAKING CHANGE: The title property is now required on ActivatedRouteSnapshot

PR Close #47481
  • Loading branch information
atscott authored and alxhub committed Sep 27, 2022
1 parent 002ee32 commit 6a88bad0192516f26a5a008c0634b73456b9447c
Show file tree
Hide file tree
Showing 3 changed files with 19 additions and 3 deletions.
@@ -74,7 +74,7 @@ export class ActivatedRouteSnapshot {
queryParams: Params;
get root(): ActivatedRouteSnapshot;
readonly routeConfig: Route | null;
readonly title?: string;
get title(): string | undefined;
// (undocumented)
toString(): string;
url: UrlSegment[];
@@ -308,7 +308,11 @@ export class ActivatedRouteSnapshot {
_queryParamMap!: ParamMap;

/** The resolved route title */
readonly title?: string = this.data?.[RouteTitleKey];
get title(): string|undefined {
// Note: This _must_ be a getter because the data is mutated in the resolvers. Title will not be
// available at the time of class instantiation.
return this.data?.[RouteTitleKey];
}

/** @internal */
constructor(
@@ -9,7 +9,7 @@
import {DOCUMENT} from '@angular/common';
import {Component, Inject, Injectable, NgModule} from '@angular/core';
import {fakeAsync, TestBed, tick} from '@angular/core/testing';
import {Router, RouterModule, RouterStateSnapshot, TitleStrategy} from '@angular/router';
import {NavigationEnd, Router, RouterModule, RouterStateSnapshot, TitleStrategy} from '@angular/router';

import {provideRouterForTesting} from '../testing/src/provide_router_for_testing';

@@ -99,6 +99,18 @@ describe('title strategy', () => {
tick();
expect(document.title).toBe('resolved title');
}));

it('can get the title from the ActivatedRouteSnapshot', async () => {
router.resetConfig([
{
path: 'home',
title: 'My Application',
component: BlankCmp,
},
]);
await router.navigateByUrl('home');
expect(router.routerState.snapshot.root.firstChild!.title).toEqual('My Application');
});
});

describe('custom strategies', () => {

0 comments on commit 6a88bad

Please sign in to comment.