Skip to content

Commit 6c1357d

Browse files
atscottatscott
committed
feat(router): Add stable cancelation code to NavigationCancel event (#46675)
This commit adds a stable cancelation code to the `NavigationCancel` event. This code is acceptable for use in production whereas parsing the `reason` string is not. This allows developers to determine more specifically _why_ a navigation was canceled and perform different actions in different scenarios. PR Close #46675
1 parent e96ece9 commit 6c1357d

5 files changed

Lines changed: 73 additions & 26 deletions

File tree

‎goldens/public-api/router/index.md‎

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -351,15 +351,24 @@ export class NavigationCancel extends RouterEvent {
351351
constructor(
352352
id: number,
353353
url: string,
354-
reason: string);
355-
// (undocumented)
354+
reason: string,
355+
code?: NavigationCancellationCode | undefined);
356+
readonly code?: NavigationCancellationCode | undefined;
356357
reason: string;
357358
// (undocumented)
358359
toString(): string;
359360
// (undocumented)
360361
readonly type = EventType.NavigationCancel;
361362
}
362363

364+
// @public
365+
export const enum NavigationCancellationCode {
366+
GuardRejected = 3,
367+
NoDataFromResolver = 2,
368+
Redirect = 0,
369+
SupersededByNewNavigation = 1
370+
}
371+
363372
// @public
364373
export class NavigationEnd extends RouterEvent {
365374
constructor(

‎packages/router/src/events.ts‎

Lines changed: 36 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -162,6 +162,31 @@ export class NavigationEnd extends RouterEvent {
162162
}
163163
}
164164

165+
/**
166+
* A code for the `NavigationCancel` event of the `Router` to indicate the
167+
* reason a navigation failed.
168+
*
169+
* @publicApi
170+
*/
171+
export const enum NavigationCancellationCode {
172+
/**
173+
* A navigation failed because a guard returned a `UrlTree` to redirect.
174+
*/
175+
Redirect,
176+
/**
177+
* A navigation failed because a more recent navigation started.
178+
*/
179+
SupersededByNewNavigation,
180+
/**
181+
* A navigation failed because one of the resolvers completed without emiting a value.
182+
*/
183+
NoDataFromResolver,
184+
/**
185+
* A navigation failed because a guard returned `false`.
186+
*/
187+
GuardRejected,
188+
}
189+
165190
/**
166191
* An event triggered when a navigation is canceled, directly or indirectly.
167192
* This can happen for several reasons including when a route guard
@@ -181,8 +206,17 @@ export class NavigationCancel extends RouterEvent {
181206
id: number,
182207
/** @docsNotRequired */
183208
url: string,
184-
/** @docsNotRequired */
185-
public reason: string) {
209+
/**
210+
* A description of why the navigation was cancelled. For debug purposes only. Use `code`
211+
* instead for a stable cancellation reason that can be used in production.
212+
*/
213+
public reason: string,
214+
/**
215+
* A code to indicate why the navigation was canceled. This cancellation code is stable for
216+
* the reason and can be relied on whereas the `reason` string could change and should not be
217+
* used in production.
218+
*/
219+
readonly code?: NavigationCancellationCode) {
186220
super(id, url);
187221
}
188222

‎packages/router/src/index.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ export {createUrlTreeFromSnapshot} from './create_url_tree';
1111
export {RouterLink, RouterLinkWithHref} from './directives/router_link';
1212
export {RouterLinkActive} from './directives/router_link_active';
1313
export {RouterOutlet, RouterOutletContract} from './directives/router_outlet';
14-
export {ActivationEnd, ActivationStart, ChildActivationEnd, ChildActivationStart, Event, EventType, GuardsCheckEnd, GuardsCheckStart, NavigationCancel, NavigationEnd, NavigationError, NavigationStart, ResolveEnd, ResolveStart, RouteConfigLoadEnd, RouteConfigLoadStart, RouterEvent, RoutesRecognized, Scroll} from './events';
14+
export {ActivationEnd, ActivationStart, ChildActivationEnd, ChildActivationStart, Event, EventType, GuardsCheckEnd, GuardsCheckStart, NavigationCancel, NavigationCancellationCode as NavigationCancellationCode, NavigationEnd, NavigationError, NavigationStart, ResolveEnd, ResolveStart, RouteConfigLoadEnd, RouteConfigLoadStart, RouterEvent, RoutesRecognized, Scroll} from './events';
1515
export {CanActivate, CanActivateChild, CanDeactivate, CanLoad, CanMatch, CanMatchFn, Data, LoadChildren, LoadChildrenCallback, QueryParamsHandling, Resolve, ResolveData, Route, Routes, RunGuardsAndResolvers, UrlMatcher, UrlMatchResult} from './models';
1616
export {DefaultTitleStrategy, TitleStrategy} from './page_title_strategy';
1717
export {BaseRouteReuseStrategy, DetachedRouteHandle, RouteReuseStrategy} from './route_reuse_strategy';

‎packages/router/src/router.ts‎

Lines changed: 20 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import {catchError, defaultIfEmpty, filter, finalize, map, switchMap, take, tap}
1414
import {createRouterState} from './create_router_state';
1515
import {createUrlTree} from './create_url_tree';
1616
import {RuntimeErrorCode} from './errors';
17-
import {Event, GuardsCheckEnd, GuardsCheckStart, NavigationCancel, NavigationEnd, NavigationError, NavigationStart, NavigationTrigger, ResolveEnd, ResolveStart, RouteConfigLoadEnd, RouteConfigLoadStart, RoutesRecognized} from './events';
17+
import {Event, GuardsCheckEnd, GuardsCheckStart, NavigationCancel, NavigationCancellationCode, NavigationEnd, NavigationError, NavigationStart, NavigationTrigger, ResolveEnd, ResolveStart, RouteConfigLoadEnd, RouteConfigLoadStart, RoutesRecognized} from './events';
1818
import {QueryParamsHandling, Route, Routes} from './models';
1919
import {activateRoutes} from './operators/activate_routes';
2020
import {applyRedirects} from './operators/apply_redirects';
@@ -411,8 +411,7 @@ export class Router {
411411
private disposed = false;
412412

413413
private locationSubscription?: SubscriptionLike;
414-
/** @internal */
415-
navigationId: number = 0;
414+
private navigationId: number = 0;
416415

417416
/**
418417
* The id of the currently active page in the router.
@@ -779,7 +778,8 @@ export class Router {
779778
filter(t => {
780779
if (!t.guardsResult) {
781780
this.restoreHistory(t);
782-
this.cancelNavigationTransition(t, '');
781+
this.cancelNavigationTransition(
782+
t, '', NavigationCancellationCode.GuardRejected);
783783
return false;
784784
}
785785
return true;
@@ -807,7 +807,10 @@ export class Router {
807807
this.restoreHistory(t);
808808
this.cancelNavigationTransition(
809809
t,
810-
`At least one route resolver didn't emit any value.`);
810+
NG_DEV_MODE ?
811+
`At least one route resolver didn't emit any value.` :
812+
'',
813+
NavigationCancellationCode.NoDataFromResolver);
811814
}
812815
}
813816
}),
@@ -896,9 +899,13 @@ export class Router {
896899
* event is fired when a navigation gets cancelled but not caught by other
897900
* means. */
898901
if (!completed && !errored) {
899-
const cancelationReason = `Navigation ID ${
900-
t.id} is not equal to the current navigation id ${this.navigationId}`;
901-
this.cancelNavigationTransition(t, cancelationReason);
902+
const cancelationReason = NG_DEV_MODE ?
903+
`Navigation ID ${t.id} is not equal to the current navigation id ${
904+
this.navigationId}` :
905+
'';
906+
this.cancelNavigationTransition(
907+
t, cancelationReason,
908+
NavigationCancellationCode.SupersededByNewNavigation);
902909
}
903910
// Only clear current navigation if it is still set to the one that
904911
// finalized.
@@ -933,7 +940,8 @@ export class Router {
933940
this.restoreHistory(t, true);
934941
}
935942
const navCancel = new NavigationCancel(
936-
t.id, this.serializeUrl(t.extractedUrl), e.message);
943+
t.id, this.serializeUrl(t.extractedUrl), e.message,
944+
NavigationCancellationCode.Redirect);
937945
eventsSubject.next(navCancel);
938946

939947
// When redirecting, we need to delay resolving the navigation
@@ -1460,8 +1468,9 @@ export class Router {
14601468
this.generateNgRouterState(this.lastSuccessfulId, this.currentPageId));
14611469
}
14621470

1463-
private cancelNavigationTransition(t: NavigationTransition, reason: string) {
1464-
const navCancel = new NavigationCancel(t.id, this.serializeUrl(t.extractedUrl), reason);
1471+
private cancelNavigationTransition(
1472+
t: NavigationTransition, reason: string, code: NavigationCancellationCode) {
1473+
const navCancel = new NavigationCancel(t.id, this.serializeUrl(t.extractedUrl), reason, code);
14651474
this.triggerEvent(navCancel);
14661475
t.resolve(false);
14671476
}

‎packages/router/src/router_module.ts‎

Lines changed: 5 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import {RouterLink, RouterLinkWithHref} from './directives/router_link';
1616
import {RouterLinkActive} from './directives/router_link_active';
1717
import {RouterOutlet} from './directives/router_outlet';
1818
import {RuntimeErrorCode} from './errors';
19-
import {Event, NavigationCancel, NavigationEnd, NavigationError, stringifyEvent} from './events';
19+
import {Event, NavigationCancel, NavigationCancellationCode, NavigationEnd, NavigationError, stringifyEvent} from './events';
2020
import {Route, Routes} from './models';
2121
import {DefaultTitleStrategy, TitleStrategy} from './page_title_strategy';
2222
import {RouteReuseStrategy} from './route_reuse_strategy';
@@ -26,7 +26,6 @@ import {ChildrenOutletContexts} from './router_outlet_context';
2626
import {PreloadingStrategy, RouterPreloader} from './router_preloader';
2727
import {ROUTER_SCROLLER, RouterScroller} from './router_scroller';
2828
import {ActivatedRoute} from './router_state';
29-
import {REDIRECTING_CANCELLATION_REASON} from './shared';
3029
import {UrlHandlingStrategy} from './url_handling_strategy';
3130
import {DefaultUrlSerializer, UrlSerializer, UrlTree} from './url_tree';
3231
import {flatten} from './utils/collection';
@@ -611,15 +610,11 @@ function provideEnabledBlockingInitialNavigation(): Provider {
611610
// Navigation assumed to succeed if we get `ActivationStart`
612611
return true;
613612
}
614-
const newNavigationStarted = router.navigationId !== e.id;
615-
// TODO(atscott): Do not rely on the string reason to determine if cancelation
616-
// is redirecting
617-
const redirectingWithUrlTree = e instanceof NavigationCancel ?
618-
e.reason.indexOf(REDIRECTING_CANCELLATION_REASON) !== -1 :
613+
const redirecting = e instanceof NavigationCancel ?
614+
(e.code === NavigationCancellationCode.Redirect ||
615+
e.code === NavigationCancellationCode.SupersededByNewNavigation) :
619616
false;
620-
// Navigation failed, but if we already have a new navigation, wait for the
621-
// result of that one instead.
622-
return newNavigationStarted || redirectingWithUrlTree ? null : false;
617+
return redirecting ? null : false;
623618
}),
624619
filter((result): result is boolean => result !== null),
625620
take(1),

0 commit comments

Comments
 (0)