Skip to content

Commit 5ceedcb

Browse files
cexbrayatangular-robot[bot]
authored andcommitted
feat(@schematics/angular): remove deprecated CanLoad option for guards
Angular v15.1 deprecated the `CanLoad` guard in favor of `CanMatch`. This commit removes the support for `CanLoad` when generating a guard with the CLI, to encourage developers to use `CanMatch` instead. BREAKING CHANGE: The CLI no longer allows to generate `CanLoad` guards. Use `CanMatch` instead.
1 parent 6d9b157 commit 5ceedcb

File tree

8 files changed

+27
-47
lines changed

8 files changed

+27
-47
lines changed

packages/schematics/angular/guard/implements-files/__name@dasherize__.guard.ts.template

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -27,9 +27,5 @@ export class <%= classify(name) %>Guard implements <%= implementations %> {
2727
route: Route,
2828
segments: UrlSegment[]): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
2929
return true;
30-
}<% } %><% if (implements.includes('CanLoad')) { %>canLoad(
31-
route: Route,
32-
segments: UrlSegment[]): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
33-
return true;
3430
}<% } %>
3531
}

packages/schematics/angular/guard/index.ts

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -33,10 +33,7 @@ export default function (options: GuardOptions): Rule {
3333
const commonRouterNameImports = ['ActivatedRouteSnapshot', 'RouterStateSnapshot'];
3434
const routerNamedImports: string[] = [...options.implements, 'UrlTree'];
3535

36-
if (
37-
options.implements.includes(GuardInterface.CanLoad) ||
38-
options.implements.includes(GuardInterface.CanMatch)
39-
) {
36+
if (options.implements.includes(GuardInterface.CanMatch)) {
4037
routerNamedImports.push('Route', 'UrlSegment');
4138

4239
if (options.implements.length > 1) {

packages/schematics/angular/guard/index_spec.ts

Lines changed: 7 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -85,8 +85,8 @@ describe('Guard Schematic', () => {
8585
expect(fileString).toContain('canActivate');
8686
expect(fileString).not.toContain('CanActivateChild');
8787
expect(fileString).not.toContain('canActivateChild');
88-
expect(fileString).not.toContain('CanLoad');
89-
expect(fileString).not.toContain('canLoad');
88+
expect(fileString).not.toContain('CanMatch');
89+
expect(fileString).not.toContain('canMatch');
9090
});
9191

9292
it('should respect the functional guard value', async () => {
@@ -96,8 +96,8 @@ describe('Guard Schematic', () => {
9696
expect(fileString).toContain('export const fooGuard: CanActivateFn = (route, state) => {');
9797
expect(fileString).not.toContain('CanActivateChild');
9898
expect(fileString).not.toContain('canActivateChild');
99-
expect(fileString).not.toContain('CanLoad');
100-
expect(fileString).not.toContain('canLoad');
99+
expect(fileString).not.toContain('CanMatch');
100+
expect(fileString).not.toContain('canMatch');
101101
});
102102

103103
it('should generate a helper function to execute the guard in a test', async () => {
@@ -121,7 +121,7 @@ describe('Guard Schematic', () => {
121121
});
122122

123123
it('should respect the implements values', async () => {
124-
const implementationOptions = ['CanActivate', 'CanLoad', 'CanActivateChild'];
124+
const implementationOptions = ['CanActivate', 'CanDeactivate', 'CanActivateChild'];
125125
const options = { ...defaultOptions, implements: implementationOptions };
126126
const tree = await schematicRunner.runSchematic('guard', options, appTree);
127127
const fileString = tree.readContent('/projects/bar/src/app/foo.guard.ts');
@@ -134,16 +134,6 @@ describe('Guard Schematic', () => {
134134
});
135135
});
136136

137-
it('should add correct imports based on CanLoad implementation', async () => {
138-
const implementationOptions = ['CanLoad'];
139-
const options = { ...defaultOptions, implements: implementationOptions };
140-
const tree = await schematicRunner.runSchematic('guard', options, appTree);
141-
const fileString = tree.readContent('/projects/bar/src/app/foo.guard.ts');
142-
const expectedImports = `import { CanLoad, Route, UrlSegment, UrlTree } from '@angular/router';`;
143-
144-
expect(fileString).toContain(expectedImports);
145-
});
146-
147137
it('should add correct imports based on CanMatch implementation', async () => {
148138
const implementationOptions = ['CanMatch'];
149139
const options = { ...defaultOptions, implements: implementationOptions };
@@ -154,15 +144,6 @@ describe('Guard Schematic', () => {
154144
expect(fileString).toContain(expectedImports);
155145
});
156146

157-
it('should add correct imports based on canLoad functional guard', async () => {
158-
const options = { ...defaultOptions, implements: ['CanLoad'], functional: true };
159-
const tree = await schematicRunner.runSchematic('guard', options, appTree);
160-
const fileString = tree.readContent('/projects/bar/src/app/foo.guard.ts');
161-
const expectedImports = `import { CanLoadFn } from '@angular/router';`;
162-
163-
expect(fileString).toContain(expectedImports);
164-
});
165-
166147
it('should add correct imports based on CanActivate implementation', async () => {
167148
const implementationOptions = ['CanActivate'];
168149
const options = { ...defaultOptions, implements: implementationOptions };
@@ -183,13 +164,13 @@ describe('Guard Schematic', () => {
183164
});
184165

185166
it('should add correct imports if multiple implementations was selected', async () => {
186-
const implementationOptions = ['CanActivate', 'CanLoad', 'CanActivateChild'];
167+
const implementationOptions = ['CanActivate', 'CanMatch', 'CanActivateChild'];
187168
const options = { ...defaultOptions, implements: implementationOptions };
188169
const tree = await schematicRunner.runSchematic('guard', options, appTree);
189170
const fileString = tree.readContent('/projects/bar/src/app/foo.guard.ts');
190171
const expectedImports =
191172
`import ` +
192-
`{ ActivatedRouteSnapshot, CanActivate, CanActivateChild, CanLoad, Route, RouterStateSnapshot, UrlSegment, UrlTree } ` +
173+
`{ ActivatedRouteSnapshot, CanActivate, CanActivateChild, CanMatch, Route, RouterStateSnapshot, UrlSegment, UrlTree } ` +
193174
`from '@angular/router';`;
194175

195176
expect(fileString).toContain(expectedImports);

packages/schematics/angular/guard/schema.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@
5353
"uniqueItems": true,
5454
"minItems": 1,
5555
"items": {
56-
"enum": ["CanActivate", "CanActivateChild", "CanDeactivate", "CanLoad", "CanMatch"],
56+
"enum": ["CanActivate", "CanActivateChild", "CanDeactivate", "CanMatch"],
5757
"type": "string"
5858
},
5959
"default": ["CanActivate"],

packages/schematics/angular/guard/type-files/__name@dasherize__.guard.ts.template

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { <%= guardType %> } from '@angular/router';
22

33
export const <%= camelize(name) %>Guard: <%= guardType %><% if (guardType === 'CanDeactivateFn') { %><unknown><% } %> = <%
4-
if (guardType === 'CanMatchFn' || guardType === 'CanLoadFn') { %>(route, segments)<% }
4+
if (guardType === 'CanMatchFn') { %>(route, segments)<% }
55
%><% if (guardType === 'CanActivateFn') { %>(route, state)<% }
66
%><% if (guardType === 'CanActivateChildFn') { %>(childRoute, state)<% }
77
%><% if (guardType === 'CanDeactivateFn') { %>(component, currentRoute, currentState, nextState)<% } %> => {

packages/schematics/angular/utility/ast-utils_spec.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -502,7 +502,7 @@ describe('ast utils', () => {
502502
import { AppComponent } from './app.component';
503503
504504
const routes = [
505-
{ path: 'foo', component: FooComponent, canLoad: [Guard] }
505+
{ path: 'foo', component: FooComponent, canMatch: [Guard] }
506506
];
507507
508508
@NgModule({
@@ -527,7 +527,7 @@ describe('ast utils', () => {
527527
const output = applyChanges(modulePath, moduleContent, [changes]);
528528
/* eslint-disable max-len */
529529
expect(output).toMatch(
530-
/const routes = \[\r?\n?\s*{ path: 'foo', component: FooComponent, canLoad: \[Guard\] },\r?\n?\s*{ path: 'bar', component: BarComponent }\r?\n?\s*\]/,
530+
/const routes = \[\r?\n?\s*{ path: 'foo', component: FooComponent, canMatch: \[Guard\] },\r?\n?\s*{ path: 'bar', component: BarComponent }\r?\n?\s*\]/,
531531
);
532532
/* eslint-enable max-len */
533533
});

tests/legacy-cli/e2e/tests/generate/guard/guard-implements.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,10 @@ export default async function () {
66
// Does not create a sub directory.
77
const guardDir = join('src', 'app');
88

9-
await ng('generate', 'guard', 'load', '--implements=CanLoad');
9+
await ng('generate', 'guard', 'match', '--implements=CanMatch');
1010
await expectFileToExist(guardDir);
11-
await expectFileToExist(join(guardDir, 'load.guard.ts'));
12-
await expectFileToMatch(join(guardDir, 'load.guard.ts'), /implements CanLoad/);
13-
await expectFileToExist(join(guardDir, 'load.guard.spec.ts'));
11+
await expectFileToExist(join(guardDir, 'match.guard.ts'));
12+
await expectFileToMatch(join(guardDir, 'match.guard.ts'), /implements CanMatch/);
13+
await expectFileToExist(join(guardDir, 'match.guard.spec.ts'));
1414
await ng('test', '--watch=false');
1515
}

tests/legacy-cli/e2e/tests/generate/guard/guard-multiple-implements.ts

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,19 @@ export default async function () {
66
// Does not create a sub directory.
77
const guardDir = join('src', 'app');
88

9-
await ng('generate', 'guard', 'load', '--implements=CanLoad', '--implements=CanDeactivate');
9+
await ng(
10+
'generate',
11+
'guard',
12+
'multiple',
13+
'--implements=CanActivate',
14+
'--implements=CanDeactivate',
15+
);
1016
await expectFileToExist(guardDir);
11-
await expectFileToExist(join(guardDir, 'load.guard.ts'));
17+
await expectFileToExist(join(guardDir, 'multiple.guard.ts'));
1218
await expectFileToMatch(
13-
join(guardDir, 'load.guard.ts'),
14-
/implements CanLoad, CanDeactivate<unknown>/,
19+
join(guardDir, 'multiple.guard.ts'),
20+
/implements CanActivate, CanDeactivate<unknown>/,
1521
);
16-
await expectFileToExist(join(guardDir, 'load.guard.spec.ts'));
22+
await expectFileToExist(join(guardDir, 'multiple.guard.spec.ts'));
1723
await ng('test', '--watch=false');
1824
}

0 commit comments

Comments
 (0)