Angular单元测试 - 出现错误：`Navigation triggered outside Angular zone, did you forget to call 'ngZone.run()'?`

Question

以下是我的单元测试基本设置：

  describe('ShellViewComponentAttributesComponent', () => {
  let fixture: ComponentFixture<ShellSelectLanguageForEEComponent>;
  let component: ShellSelectLanguageForEEComponent;
  let store: MockStore<any>;
  let location: Location;
  let router: Router;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ShellSelectLanguageForEEComponent],
      imports: [
        [
          RouterTestingModule.withRoutes([
            {
              path: 'SC/subject-curriculum',
              component: ShellSelectLanguageForEEComponent
            }
          ])
        ]
      ],
      providers: [
        provideMockStore({})
      ],

      schemas: [CUSTOM_ELEMENTS_SCHEMA]
    }).compileComponents();

    router = TestBed.get(Router);
    location = TestBed.get(Location);

    fixture = TestBed.createComponent(ShellSelectLanguageForEEComponent);
    router.initialNavigation();
    component = fixture.componentInstance;

    store = TestBed.get(Store);
    spyOn(store, 'dispatch');
  }));

当我运行代码时，出现了多个错误，例如：

console.warn node_modules/@angular/core/bundles/core.umd.js:25782
  Navigation triggered outside Angular zone, did you forget to call 'ngZone.run()'?

我没有触发任何导航。这是必需的吗？因为我已经在模块中添加了它。如何处理这个问题？我查找了搜索结果，但没有解决方案适用于我。

- user2024080

Answer 1

你可以在以下文档中找到答案：https://dev.to/this-is-angular/testing-angular-routing-components-with-the-routertestingmodule-4cj0 对于你的代码，请将触发路由的代码包裹在一个 Zone 中：enter code here

// @ts-ignore
fixture.ngZone.run(() => {
  router.initialNavigation();
});

- Gauthier Peel