如何在订阅Angular7单元测试用例中对代码进行单元测试

     2023-03-16     196

关键词:

【中文标题】如何在订阅Angular7单元测试用例中对代码进行单元测试【英文标题】:How to unit test code inside subscribe for Angular7 unit test case 【发布时间】:2019-09-14 11:10:24 【问题描述】:

我想对所有代码进行单元测试并获得覆盖率,但我无法获得订阅内存在的代码的覆盖率我能够监视服务和功能,但在订阅内我无法进行单元测试并获得代码覆盖率。以下是 Angular 7 代码。

LoadListData(type) 
    this.itemListEnvName = [];
    if (type === 'EnvirnmentList') 
      this.environmentBookingService.getBookedEnv()
        .subscribe(
          (environmentBookingsData: EbEnvironmentBooking[]) => 
            if (environmentBookingsData.length > 0) 
              this.itemListEnvNameList = environmentBookingsData;
              this.itemListEnvName = [];
              this.itemListEnvNameList.forEach(element => 
                const obj = ;
                obj['id'] = element['environmentId'];
                obj['itemName'] = element['environmentName'];
                this.itemListEnvName.push(obj);
                this.generateCheckDisable = false;
              );
             else 
              this.generateCheckDisable = true;
            
          ,
          (error) => 
            this.showMessage('No Response From Delivery DB API');
          
        );
     else 

      this.showMessage('No Response From Delivery DB API');
    


  

单元测试用例中的代码就像

 it('should call getBookedEnv service ', function () 
    const service = TestBed.get(EnvironmentBookingService); // get your service
    spyOn(service, 'getBookedEnv').and.callThrough(); // create spy
    component.LoadListData('EnvirnmentList');
    expect(service.getBookedEnv).toHaveBeenCalledWith();

  );

如何在订阅中对代码进行单元测试,即

if (environmentBookingsData.length > 0) 
              this.itemListEnvNameList = environmentBookingsData;
              this.itemListEnvName = [];
              this.itemListEnvNameList.forEach(element => 
                const obj = ;
                obj['id'] = element['environmentId'];
                obj['itemName'] = element['environmentName'];
                this.itemListEnvName.push(obj);
                this.generateCheckDisable = false;
              );
             else 
              this.generateCheckDisable = true;
            

【问题讨论】:

好吧,确保服务确实返回了一个非空数组。您通常通过实际模拟服务并使其返回您想要的内容而不是使用服务的实际实现来做到这一点。 以数组形式获取响应。你能给我一些代码示例吗?? spyOn(service, 'getBookedEnv').and.returnValue(of(theArrayForWhichYouWouldLikeToTestYourSuscribeCallback)); 【参考方案1】:

您需要模拟该服务并让它返回一个 Observable。我在StackBlitz 中汇总了一个简单的示例,以展示一种使用您的代码处理此问题的方法。

StackBlitz 中的注意事项:

我用 spyObject 模拟了服务,所以以后不需要监视服务。 在这个 spyObject 中,我将内部函数 getBookedEnv() 的返回值设置为 Observable - 这允许执行订阅中的代码。 对于任何实际测试,您应该将当前由 getBookedEnv() 返回的空对象替换为一些合理模拟的数据。 注意提供者数组以及我用间谍对象替换服务的位置。

这是 StackBlitz 的描述:

describe('BannerComponent', () => 
  let component: MyComponent;
  let fixture: ComponentFixture<MyComponent>;
  const envBookingServiceSpy = jasmine.createSpyObj('EnvironmentBookingService', 
    getBookedEnv: of(/* mock environmentBookingsData here */)
  );


  beforeEach(async(() => 
    TestBed.configureTestingModule(
      declarations: [ MyComponent ],
      providers: [
         provide: EnvironmentBookingService, useValue: envBookingServiceSpy ,
      ]
    )
    .compileComponents();
  ));

  beforeEach(async(() => 
    fixture = TestBed.createComponent(MyComponent);
    component = fixture.componentInstance;
  ));

  it('should call getBookedEnv service ', function () 
    const service = TestBed.get(EnvironmentBookingService); // get your service
    // spyOn(service, 'getBookedEnv').and.callThrough(); // create spy
    component.LoadListData('EnvirnmentList');
    expect(service.getBookedEnv).toHaveBeenCalledWith();
  );
);

我希望这可以帮助您了解如何在您的方法的订阅中开始测试。

【讨论】:

谢谢 dmcgrandle,但是考虑到 this.environmentBookingService.getBookedEnv('data') 中传递了一些参数,上面的答案会如何变化? @Darshantheerth - 不确定我是否完全理解您的问题,因为 OP 的原始示例显然没有将参数传递给该方法。但理论上,如果getBookedEnv() 传递了一个参数,我会假设它仍然会返回一个 Observable,所以我给出的示例不会改变。如果您要求测试传递给服务方法的参数,那可能应该在服务测试中完成,而不是在组件测试中(尽管您可以在这里完成)。如果您仍然感到困惑,我建议您提出一个包含所有详细信息的新问题并以这种方式获得帮助。 :) 感谢您的意见。上面的代码运行良好。【参考方案2】:

如果您想测试subscribe 中的代码,您必须模拟您的服务调用,然后测试您在subscribe 中修改的组件变量,例如this.itemListEnvNamethis.generateCheckDisable

这可能看起来像这样:

 it('should call getBookedEnv service ', function () 
    const service = TestBed.get(EnvironmentBookingService); // get your service
    spyOn(service, 'getBookedEnv').and.callFake(() => 
      return of([]); // or return a list of bookings in case you want to test the first part of the if statement 
    );
    component.LoadListData('EnvironmentList');
    expect(service.getBookedEnv).toHaveBeenCalledWith();

    // additional tests that verify the inside of the subscribe (change below in case the mocked service returned something)
    expect(component.itemListEnvName).equalTo([]);
    expect(component.generateCheckDisable).equalTo(false);
  );

【讨论】:

如何在 ios XCTestCase 中对两个对象不相等进行单元测试

】如何在iosXCTestCase中对两个对象不相等进行单元测试【英文标题】:howtounittesttwoobjectsarenotequaliniosXCTestCase【发布时间】:2014-01-0815:45:25【问题描述】:我对单元测试相当陌生,尤其是在iOS中我有一个测试用例,如果我看到两个... 查看详情

如何在 java 中对 jdbc 代码进行单元测试? [关闭]

】如何在java中对jdbc代码进行单元测试?[关闭]【英文标题】:HowdoIunittestjdbccodeinjava?[closed]【发布时间】:2010-09-2022:48:15【问题描述】:我想为一些连接到数据库的代码编写一些单元测试,运行一个或多个查询,然后处理结果。... 查看详情

如何在打字稿中对模型接口进行单元测试?

】如何在打字稿中对模型接口进行单元测试?【英文标题】:Howtounittestmodelinterfacesintypescript?【发布时间】:2018-09-2903:04:46【问题描述】:exportinterfaceUsername:string;如何对上述接口进行单元测试,以便Karma可以在代码覆盖率报告中... 查看详情

如何在验证方法 nuxtjs vuejs jest 中对代码进行单元测试

】如何在验证方法nuxtjsvuejsjest中对代码进行单元测试【英文标题】:Howtounittestcodeinsidevalidatemethodnuxtjsvuejsjest【发布时间】:2022-01-1407:17:17【问题描述】:我在validatemethod中有代码,如果条件为真,则返回真,否则返回假。我想测... 查看详情

如何在 Flutter 中对依赖于 3rd-Party-Package 的代码进行单元测试?

】如何在Flutter中对依赖于3rd-Party-Package的代码进行单元测试?【英文标题】:HowtoUnitTestcodethatisdependenton3rd-Party-PackageinFlutter?【发布时间】:2020-08-0215:47:30【问题描述】:如何在Flutter中测试依赖于path_provider插件的代码?对依赖于... 查看详情

如何在typescript中对私有方法进行单元测试(代码片段)

当我尝试对类中的私有方法进行单元测试时获取错误,因为私有方法只能在类中访问。在这里,我为我的班级和摩卡测试添加了示例片段。请为我提供实施私有方法单元测试的解决方案。班级名称:Notification.tsclassNotificationconstru... 查看详情

如何在 java 中对这个方法进行单元测试?

】如何在java中对这个方法进行单元测试?【英文标题】:HowcanIunittestthismethodinjava?【发布时间】:2012-05-3008:34:10【问题描述】:我正在使用Struts2框架并希望对下面的execute方法进行单元测试:publicStringexecute()setDao((MyDAO)ApplicationIni... 查看详情

如何在 AngularJS 中对隔离范围指令进行单元测试

】如何在AngularJS中对隔离范围指令进行单元测试【英文标题】:HowtoUnitTestIsolatedScopeDirectiveinAngularJS【发布时间】:2013-06-2615:32:51【问题描述】:在AngularJS中对隔离范围进行单元测试的好方法是什么JSFiddleshowingunittest指令sn-pscope:na... 查看详情

如何在 Angular 2 中对指令进行单元测试?

】如何在Angular2中对指令进行单元测试?【英文标题】:HowtoUnitTestaDirectiveInAngular2?【发布时间】:2016-07-2518:01:24【问题描述】:问题:我希望能够在Angular2中对指令进行单元测试,以确保它能够正确编译。在Angular1中,可以使用$c... 查看详情

如何在 Typescript 中对私有方法进行单元测试

】如何在Typescript中对私有方法进行单元测试【英文标题】:HowtounittestprivatemethodsinTypescript【发布时间】:2018-08-0101:37:56【问题描述】:当我尝试对类中的私有方法进行单元测试时,由于私有方法只能在类中访问而出错。在这里... 查看详情

如何在 CoAP 一致性测试套件中对测试用例进行分组

】如何在CoAP一致性测试套件中对测试用例进行分组【英文标题】:howtogrouptestcasesinCoAPconformancetestsuite【发布时间】:2012-05-2116:01:49【问题描述】:我正在为ConstrainedApplicationProtocol(CoAP)基于TTCN-3编写一致性测试套件。现在我已经... 查看详情

如何在 Gatsby 中对 GraphQL 查询进行单元测试

】如何在Gatsby中对GraphQL查询进行单元测试【英文标题】:HowtounittestGraphQLqueriesinGatsby【发布时间】:2019-01-1505:22:23【问题描述】:我正在使用Gatsby和Jest进行测试。默认情况下,Gatsby处理GraphQL数据获取,据我发现,它没有提供任... 查看详情

是否可以在 IOS 的 XCTest 单元测试用例中模拟方法(带参数)调用

】是否可以在IOS的XCTest单元测试用例中模拟方法(带参数)调用【英文标题】:Isitpossibletomockamethod(withparameters)callinXCTestunittestcaseinIOS【发布时间】:2015-08-2821:47:34【问题描述】:我在我的应用程序中使用第三方框架作为外部附... 查看详情

你如何在 Dart 中对异常进行单元测试?

】你如何在Dart中对异常进行单元测试?【英文标题】:HowdoyouunittestexceptionsinDart?【发布时间】:2012-10-2905:39:10【问题描述】:考虑一个根据传递的参数进行一些异常处理的函数:Listrange(start,stop)if(start>=stop)thrownewArgumentError("sta... 查看详情

如何在 VueJS 中对 Vuex 动作进行单元测试

】如何在VueJS中对Vuex动作进行单元测试【英文标题】:HowtounittestifVuexactionhasbeendispatchedinVueJS【发布时间】:2017-10-0413:05:10【问题描述】:我只想测试当我的App.vue组件是created()时是否调度了myAwesome操作。这是你要测试的东西吗?... 查看详情

如何在 Objective-C 中对 init 方法进行单元测试?

】如何在Objective-C中对init方法进行单元测试?【英文标题】:HowcanIunit-testinitmethodsinObjective-C?【发布时间】:2013-10-3000:17:33【问题描述】:我正在使用新的XCTest框架在Xcode5中对Mac应用程序进行单元测试。具体来说,我正在尝试测... 查看详情

在 Grails 中对服务进行单元测试时如何模拟请求

】在Grails中对服务进行单元测试时如何模拟请求【英文标题】:Howtomockarequestwhenunittestingaserviceingrails【发布时间】:2013-02-2122:47:54【问题描述】:我正在尝试对具有需要请求对象的方法的服务进行单元测试。importorg.springframework.w... 查看详情

如何在android中对Log.e进行单元测试?

】如何在android中对Log.e进行单元测试?【英文标题】:HowtounittestLog.einandroid?【发布时间】:2016-12-1606:39:24【问题描述】:我需要执行一个单元测试,我需要检查当我的应用中发生某种情况时是否记录了错误消息。try//dosomethingcatc... 查看详情