Jasmine/Karma: TypeError: this.role.toLowerCase is not a function

Question

我正在为我们团队正在开发的应用程序中的其中一个页面编写测试用例。但是我在一个测试用例中遇到了运行错误，我没有找到克服的方法。我的规范文件是

import { UserApiService } from 'src/app/services/api/user-apiservice';
import { MatDialog } from '@angular/material/dialog';
import { AuthenticationService } from '../../services/shared/authentication.service';

import { MainViewComponent } from './mainview.component';
import { of } from 'rxjs';

describe('MainViewComponent', () => {
  let component: MainViewComponent;
  let fixture: ComponentFixture<MainViewComponent>;
  let mockTlsApiService, mockMatDialog, mockAuthenticationService;

  beforeEach(async(() => {
    mockAuthenticationService = jasmine.createSpyObj(['getUserData','getDateData']);
    mockAuthenticationService.getUserRole = jasmine.createSpy().and.returnValue(of(['admin']));
    mockAuthenticationService.getUserRole.toLowerCase = jasmine.createSpy().and.returnValue(of(['admin']));
    mockAuthenticationService.getUserFullName = jasmine.createSpy().and.returnValue(of([]));

    TestBed.configureTestingModule({
      declarations: [ MainViewComponent ],
      providers: [
        {provide: UserApiService, useValue: mockTlsApiService},
        {provide: MatDialog, useValue: mockMatDialog},
        {provide: AuthenticationService, useValue: mockAuthenticationService},
      ],
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(MainViewComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

当我得到错误时它正在测试的代码是这个

  constructor(    
    private repoService: UserApiService,
    public dialog: MatDialog,
    private authenticationService: AuthenticationService,
  ) {
   
  }
  ngAfterViewInit(): void {
  this.dataSource.sortingDataAccessor = (item, property) => {
    switch (property) {
       case 'origDate': return new Date(item.origDate);
       default: return item[property];
    }
  };
  }
  ngOnInit(): void {
    this.getQueues();

    this.getData();

    this.toolOrderNoFilterFunc(); this.toolNoFilterFunc(); this.eclFilterFunc(); this.abbrFilterFunc(); this.seriesFilterFunc(); this.nameFilterFunc(); this.toolTypeFilterFunc();
    this.toolChangeFilterFunc(); this.ccnDesFilterFunc(); this.ccnFabFilterFunc(); this.revFilterFunc();
  }
. . .
  getQueues(){
    this.role=this.authenticationService.getUserRole();
    this.allQueues = ['ME1', 'ME2', 'Est', 'Safe', 'TFab', 'Fin', 'Acct', 'Shop Stat','Rel']
    this.userFullName = this.authenticationService.getUserFullName();
    //is it Tfab or Tool???
    if(this.role.toLowerCase().search("admin") != -1 ){
        this.arrayQueues = ['ME1', 'ME2', 'Est', 'Safe', 'TFab', 'Fin', 'Acct', 'Shop Stat','Rel']
        //this.arrayQueues = ['TFab', 'Fin', 'ME1']
    } else {
      if(this.role.toLowerCase().search("me or designer") != -1 ){
          this.arrayQueues.push('ME1')
          this.arrayQueues.push('ME2')
      }
      if(this.role.toLowerCase().search("estimating") != -1 ){
        this.arrayQueues.push('Est')
      }
      if(this.role.toLowerCase().search("saftey") != -1 ){
        this.arrayQueues.push('Safe')  //is it SAF or Safe???
      }
      if(this.role.toLowerCase().search("tool fab") != -1 ){
        //is it Tfab or Tool???
        this.arrayQueues.push('TFab') 
      }
      if(this.role.toLowerCase().search("finance") != -1 ){
        this.arrayQueues.push('Fin')
      }
      if(this.role.toLowerCase().search("accountability") != -1 ){
        this.arrayQueues.push('Acct')
      }
      if(this.role.toLowerCase().search("read only") != -1 ){
        this.arrayQueues = this.allQueues
      }
    }

    this.isempty = false;
    // console.log(this.arrayQueues)
  }

当测试到达第一个 this.role.toLowerCase() 时，我得到的错误是此 post 的标题。

我曾尝试为 role 创建一个 mock 并为 toLowerCase 创建一个 mock，但最终会出现更多错误。我也尝试过使用 spyOn。

如何修复此错误消息？

Answer 1

所以我改变了我从

模拟身份验证服务的方式

mockAuthenticationService = jasmine.createSpyObj(['getUserData','getDateData']);
mockAuthenticationService.getUserRole = jasmine.createSpy().and.returnValue(of(['admin']));
mockAuthenticationService.getUserRole.toLowerCase = jasmine.createSpy().and.returnValue(of(['admin']));
mockAuthenticationService.getUserFullName = jasmine.createSpy().and.returnValue(of([]));

至此

export class mockAuthentication{
  getUserRole(){
    return "admin";
  };
  getUserFullName(){
    return "Test User";
  }
};

并从

更新提供声明

{provide: AuthenticationService, useValue: mockAuthenticationService},

至此

{provide: AuthenticationService, useClass: mockAuthentication},

我的测试现在通过了。通过我的循环是，第一种模拟服务的方法已经在同一应用程序的多个其他组件中工作。

Jasmine/Karma: TypeError: this.role.toLowerCase is not a function

Jasmine/Karma: TypeError: this.role.toLowerCase is not a function

javascript

jasmine

typescript

karma-jasmine

angular