时间戳

首页 > 解决方案 > 如何在 Jasmine 中为 localStorage 值编写单元测试用例

angular - 如何在 Jasmine 中为 localStorage 值编写单元测试用例

问题描述

登录组件.ts

  ngOnInit() {
    this.createForm();

    //  loginStatus = 1 - redirect to search
    //  else - redirect to login
    let loginStatus = localStorage.getItem('smtLogin');
    if (loginStatus == '1') {
      this.router.navigate(['/search']);
    } else {
      localStorage.setItem('smtLogin', '0');
    }
  }

login.component.spec.ts

  it('it should navigate to search after user signs in', () => {
    expect(localStorage.setItem('smtLogin', '1')).toBe('1'); // set the localstorage smtLogin to '1'
    expect(localStorage.getItem('smtLogin')).toBe('1'); //get the loaclstotorage smtLogin value as'1'
    expect(routerStub.navigate).toHaveBeenCalledWith(['/search']);
  });

错误：

  1. '"1"' 类型的参数不能分配给 'Expected' 类型的参数。

  2. 在声明之前使用的块范围变量“expect”。

  3. 预期的间谍导航已使用 [ [ '/search' ] ] 调用，但从未调用过。

你能帮我为这个语句写一个测试用例this.router.navigate(['/search']); 在 ngOnInit() 的 if() 块内

标签： angularunit-testinglocal-storagekarma-jasmine

解决方案

  1. '"1"' 类型的参数不能分配给 'Expected' 类型的参数：
  • 这是因为expect(localStorage.setItem('smtLogin', '1')).toBe('1');没有按照你的想法去做。localStorage.setItem()return void，不能分配给 type Expected-> string。无需期待任何事情，只需做localStorage.setItem('smtLogin', '1')

在声明之前使用的块范围变量“expect”。

  • 这看起来像是导入问题，请确保正确导入茉莉花类型。

预期的间谍导航已使用 [ [ '/search' ] ] 调用，但从未调用过。

  • 看起来你没有引用实际的路由器，而只是一个存根类。获取对组件中使用的实际路由器的引用，并检查是否调用了该路由器。请阅读https://angular.io/guide/testing#routing-component以获取有关如何执行此操作的说明。

在旁注中，总是===在比较值时使用：

使用loginStatus === '1'代替loginStatus == '1'

推荐阅读