Jest如何测试Angular的路由守卫

要使用Jest测试Angular的路由守卫，你需要遵循以下步骤：

1. 安装必要的依赖项：确保已经安装了@angular/core, @angular/router, jest, @types/jest, 和 ts-jest。

2. 创建一个路由守卫：首先，你需要创建一个路由守卫。例如，我们将创建一个名为AuthGuard的守卫。在你的Angular项目中，运行以下命令：

ng generate guard auth

3. 实现路由守卫：打开auth.guard.ts文件并实现你的守卫逻辑。例如：

import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, UrlTree, Router } from '@angular/router';
import { Observable } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class AuthGuard implements CanActivate {
  constructor(private router: Router) {}

  canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
    const isLoggedIn = // ... your logic to check if the user is logged in

    if (isLoggedIn) {
      return true;
    } else {
      this.router.navigate(['/login']);
      return false;
    }
  }
}

4. 配置Jest：在项目根目录下创建或修改jest.config.js文件，添加以下内容：

module.exports = {
  preset: 'jest-preset-angular',
  setupFilesAfterEnv: ['<rootDir>/setup-jest.ts'],
  testPathIgnorePatterns: ['<rootDir>/node_modules/'],
  collectCoverage: true,
  coverageReporters: ['html'],
  coverageDirectory: 'coverage'
};

5. 创建Jest设置文件：在项目根目录下创建一个名为setup-jest.ts的文件，并添加以下内容：

import 'jest-preset-angular/setup-jest';

6. 编写测试用例：在auth.guard.spec.ts文件中编写针对AuthGuard的测试用例。例如：

import { TestBed } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';
import { AuthGuard } from './auth.guard';
import { Router } from '@angular/router';

describe('AuthGuard', () => {
  let guard: AuthGuard;
  let router: Router;

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [RouterTestingModule],
      providers: [AuthGuard]
    });

    guard = TestBed.inject(AuthGuard);
    router = TestBed.inject(Router);
  });

  it('should be created', () => {
    expect(guard).toBeTruthy();
  });

  it('should return true if the user is logged in', () => {
    // Arrange
    const isLoggedIn = true;

    // Act
    const result = guard.canActivate(null, null);

    // Assert
    expect(result).toBeTrue();
  });

  it('should redirect to /login if the user is not logged in', () => {
    // Arrange
    const isLoggedIn = false;
    const navigateSpy = jest.spyOn(router, 'navigate');

    // Act
    const result = guard.canActivate(null, null);

    // Assert
    expect(result).toBeFalse();
    expect(navigateSpy).toHaveBeenCalledWith(['/login']);
  });
});

7. 运行测试：在终端中运行以下命令来执行测试：

ng test

或者，如果你只想运行与AuthGuard相关的测试，可以使用以下命令：

ng test --include='**/auth.guard.spec.ts'

这样，你就可以使用Jest测试Angular的路由守卫了。请注意，这里的示例代码可能需要根据你的实际项目进行调整。