首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何在API失败时对ngrx效果进行单元测试?

在API失败时对ngrx效果进行单元测试的方法如下:

  1. 首先,确保你已经安装了所需的测试框架和库,例如Jasmine或Karma。
  2. 创建一个测试用例,用于测试API失败时ngrx效果的行为。在测试用例中,你可以使用模拟的ngrx Store和Effects来模拟API调用和失败的情况。
  3. 在测试用例中,首先创建一个模拟的ngrx Store,并使用provideMockStore函数来提供初始状态和选择器。
  4. 创建一个模拟的Effects实例,并使用provideMockActions函数来提供模拟的Action流。
  5. 在测试用例中,使用cold函数创建一个冷的Observable,模拟API调用的响应。你可以使用throwError操作符来模拟API调用的失败。
  6. 使用it函数定义一个测试断言,来验证在API调用失败时ngrx效果的行为。在这个测试断言中,你可以使用expect函数来断言ngrx效果的行为是否符合预期。
  7. 运行测试用例,确保测试通过并且API失败时ngrx效果的行为符合预期。

下面是一个示例代码,演示了如何在API失败时对ngrx效果进行单元测试:

代码语言:txt
复制
import { TestBed } from '@angular/core/testing';
import { provideMockStore, MockStore } from '@ngrx/store/testing';
import { provideMockActions } from '@ngrx/effects/testing';
import { Observable, throwError } from 'rxjs';
import { cold, hot } from 'jasmine-marbles';

import { MyEffects } from './my-effects';
import { MyService } from './my-service';
import { MyActionTypes, MyAction } from './my-actions';

describe('MyEffects', () => {
  let effects: MyEffects;
  let actions$: Observable<any>;
  let store: MockStore;
  let myService: jasmine.SpyObj<MyService>;

  beforeEach(() => {
    const spy = jasmine.createSpyObj('MyService', ['apiCall']);
    TestBed.configureTestingModule({
      providers: [
        MyEffects,
        provideMockActions(() => actions$),
        provideMockStore(),
        { provide: MyService, useValue: spy }
      ]
    });

    effects = TestBed.inject(MyEffects);
    actions$ = TestBed.inject(Actions);
    store = TestBed.inject(MockStore);
    myService = TestBed.inject(MyService) as jasmine.SpyObj<MyService>;
  });

  it('should dispatch MyFailureAction when API call fails', () => {
    const error = new Error('API call failed');
    myService.apiCall.and.returnValue(throwError(error));

    const action = new MyAction();
    actions$ = hot('-a', { a: action });
    const expected = cold('-b', { b: new MyFailureAction(error) });

    expect(effects.myEffect$).toBeObservable(expected);
  });
});

在这个示例中,我们创建了一个名为MyEffects的Effects类,并在其中定义了一个名为myEffect$的Effect。在myEffect$中,我们调用了一个名为apiCall的服务方法,该方法返回一个Observable。在测试用例中,我们模拟了apiCall方法的失败情况,并验证了在API调用失败时是否正确地触发了MyFailureAction

请注意,这只是一个简单的示例,实际情况中可能涉及更多的测试场景和操作。你可以根据具体的需求和代码结构进行适当的调整和扩展。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Angular 接入 NGRX 状态管理

NGRX 状态管理生命周期图中包含了以下元素: Store:集中的状态存储; Action:根据用户所触的不同事件执行不同的 Action ; Reducer:根据不同的 Action Store...:调试的工具,需要配合github.com/reduxjs/red… 使用; @ngrx/schematics:提供使用 NGRX 的 CLI 命令,需要与 Angular 进行整合使用; 安装命令:...安装 effects 核心模块: npm install @ngrx/effects --save 创建 User 的副作用: 选项介绍 : 选项 作用 --root 目标模块为根模块设置 --module...EffectsModule.forRoot([UserEffects]), ], }) export class AppModule {} 编写 Test User Api: 执行 ng 命令生成...UserActions.updateUser()); }, 5000); } } PS:以上案例完整代码可访问 github.com/OSpoon/angu… 接入实体 实体的引入对应单个用户状态的管理来说起到的效果并不明显

24810

写在 2021: 值得关注学习的前端框架和工具库

虽然这样也造成我目前没有特别深入的方向,比如21届的大佬们在工程化、微前端、AST、NodeJS等等方向都已经开始深耕,我还在追着各种新框架学当弟弟,但不得不说,在学习新事物的过程中,你会逐渐这些框架进行分类...(比如我下面进行的归类),提取他们的共同点,这样在开始学习一个新东西,你通常已经拥有了可复用的经验(比如在之前我感兴趣的研究了一些装饰器相关,使得后面入门Nest/Angular等都特别快),所以你的学习能力通常会是越来越强的...进行缓存控制)。...GraphiQL[45],可视化的GraphQL API调试工具,直观的查看你的Schema、发起请求、查看问题,有一个增强版本是支持通过点击单选框生成查询语句,一没找到。...一体化框架 一体化框架指的是, 你的前后端项目放在同一个repo里(后端是Node),同时前端直接调用在后端定义的方法,由框架在编译去自动的把前端后端的方法调用转换成HTTP请求。

4.2K10
  • angular4实战(4)ngrx

    case load.HIDE_LOADING: { return false; } default: { return state; } } } loading...ChangeDetectionStrategy 组建变化的检查策略,以上述代码为例,当为ChangeDetectionStrategy设置OnPush,组件就不会一直进行脏检查了,而是当输入属性变化时...,才会启动检查策略,这里值的注意的是,这个输入的对象需要变化成一个新对象,组件才会进行检查,而不是仅仅是改变属性的值,或者增减对象的元素。...Object.assign({}, {name:j_bleach}, {name:bleach}); 或者[…[1,2,3],4]这样返回一个新的对象。...高中英语水平翻译一下:async这个管道,会返回订阅的Observe ,promise对象的最新的值,当观察者发现值有改变,就会触发组件的检查策略,并且在组件销毁也会自动的去取消订阅避免内存泄漏。

    1.1K30

    一个Angular 5教程:一步一步指导实现你的第一个Angular 5应用程序

    因此,“结果的评估不会导致任何语义上可观察到的副作用或输出,例如可变对象的突变或输出到I / O设备”......我们能做什么?答案在这个定义中是正确的。Ngrx救援的副作用。...当我们从订阅中获取数据,您只需要实现该Remove效果。但我会把它留给你。 路由和模块 我们来谈谈我们的应用程序组合。...[logger] : []; 在根级别上,我们目前没有任何状态,但我们仍然需要定义空状态,以便在延迟加载的过程中进行扩展。...Angular不会在运行时处理它,而是在编译进行处理。让我们为我们的应用程序进行配置。为此,我们将i18n属性添加到我们的AboutComponent。...我们用它来开发丰富的接口客户端应用程序,单页应用程序和移动应用程序。Angular的主要优势在于获得一个完全集成的Web框架,该框架为构建组件,路由和使用远程API提供了自己的框内解决方案。

    42.6K10

    写在2021: 值得关注学习的前端框架和工具库

    虽然这样也造成我目前没有特别深入的方向,比如21届的大佬们在工程化、微前端、AST、NodeJS等等方向都已经开始深耕,我还在追着各种新框架学当弟弟,但不得不说,在学习新事物的过程中,你会逐渐这些框架进行分类...(比如我下面进行的归类),提取他们的共同点,这样在开始学习一个新东西,你通常已经拥有了可复用的经验(比如在之前我感兴趣的研究了一些装饰器相关,使得后面入门Nest/Angular等都特别快),所以你的学习能力通常会是越来越强的...进行缓存控制)。...GraphiQL,可视化的GraphQL API调试工具,直观的查看你的Schema、发起请求、查看问题,有一个增强版本是支持通过点击单选框生成查询语句,一没找到。...一体化框架 一体化框架指的是, 你的前后端项目放在同一个repo里(后端是Node),同时前端直接调用在后端定义的方法,由框架在编译去自动的把前端后端的方法调用转换成HTTP请求。

    2.9K10

    前端框架选择指南:React vs Vue vs Angular

    选择前端框架,React、Vue 和 Angular 都是流行的选择,各有优缺点。我们可以从各个维度进行比较和选择:React核心理念: 组件化开发,专注于视图层。...状态管理: 提供NgRx等库进行状态管理。适合: 大型企业级项目,需要严格结构和规范的团队。...Vue: Vue组件也可以与其他库配合使用,Nuxt.js、Quasar Framework等。Vue 3引入了Composition API,增强了可移植性。...测试React: 使用Jest、Enzyme等工具进行单元测试和集成测试。Vue: 提供vue-test-utils,可以与Jest、Mocha等测试框架配合使用。...Angular: 提供Angular CLI的测试工具,Karma、Jasmine,以及Protractor进行端到端测试。选择哪个框架取决于项目需求、团队技能集、项目规模和长期维护考虑。

    15400

    Android 平台实现 CI

    在CI的Compilation阶段,若出现编译失败频率较高,一是因为代码未按照原子提交的原则进行,二是本地开发环境不干净,存在与CI环境不一致的地方,导致每次提交不能提交所有文件,总是需要手动挑选提交文件...CI的Inspection阶段会对代码做多方面的考察,Checkstyle,单元测试覆盖率,代码静态bug分析等,这些都是代码质量的检测,通过这些改善检测结果,代码质量也就会随之得到提高。...三是持续执行前两步,只有在每一次出现任何代码变动立即执行前两步才能保证随时都可以提供可运行的安装包。 持续构建实现起来比较容易,但是它所达成的效果还是很不错的。...由于RobolectricSDK进行了stub,在写单元测试完全可以对组件状态进行验证,甚至可以对组件进行操作。下面这个测试就是button点击事件的测试,并且验证了Activity的状态。...若是后台数据导致不可重复,可以将数据抽象成为数据集,在每次运行前进行重置。 * 书写测试每一个assert只做一种判断,这样可以明确每次测试的目的,并且可以快速定位测试失败愿意。

    1.8K90

    聊一聊契约测试 | 洞见

    为了保证API的正确性,我们会对外部系统的API进行测试(除非你100%相信外部系统永远正确和保持不变),这很可能就会导致一个问题,当外部系统并不那么稳定或者请求时间过长,就会导致我们的测试效率很低,...比如当外部API挂掉导致测试失败,你并不能完全确信是API功能被更而改导致的失败还是运行环境不稳定导致的请求失败。 ?...构建模拟环境我们可以使用几种不同的测试手段,Dummy,Fake,Stubs,Spies,Mocks等。...第二,直接依赖于真实API的测试效果受限于API的稳定性和反映速度。 ?...契约测试:服务之间的功能进行的测试,运行速度基本与单元测试相同。 E2E 测试:系统前后端或者不同系统之间的集成测试,大多通过模拟UI操作的方式实现,运行速度三者之中最慢。 ?

    97150

    微服务API测试的十大最佳技巧(API测试技巧)

    何在微服务中更好的做好系统及API的测试,很多公司与开发都做出了自己的尝试。 测试API和微服务有很多好处。...单元测试很容易构建,但是您需要编写很多单元测试才能很好地覆盖系统行为。一些UI测试可以快速覆盖大型系统,但是构建它们非常耗时。 精确问题-通常在出现软件问题,最难的部分是了解问题的根源。...依赖于现有数据的测试可能会因环境变化/数据丢失而失败,并产生错误警报。 6)测试成功和失败方案 在构建测试,请考虑API应该失败/阻止请求的极端情况和场景。...良好的API测试平台可让您定义SMS,电子邮件以及其他在测试失败发出警报的渠道。 10)将测试集成到您的开发周期中 开发测试不应只是一次执行的离散任务,而应是代码库每项改进的一部分。...每当您扩展API,添加其他功能或支持新的用户流程,请确保在开发过程中进行测试,并知道自己的API被完全覆盖并不断得到验证,因此请放心。

    76810

    Junit5 新特性你用过多少?

    无论是自己的编码能力的提高,还是项目质量的提升,都是大有好处,本文将介绍 Java 单元测试框架 JUnit 5 的基础认识和使用来编写单元测试,希望同样你有所帮助。...自从有了类似 JUnit 之类的测试框架,Java 单元测试领域逐渐成熟,开发人员单元测试框架也有了更高的要求:更多的测试方式,更少的其他库的依赖。...Java 8 的支持, Lambda 表达式,Sream API等。...这是基本的用法,我们还可以对重复运行的测试方法名称进行修改,利用 @RepeatedTest 提供的内置变量,以占位符方式在其 name 属性上使用,下面先看下使用方式和效果: @DisplayName...新的断言 在断言 API 设计上,JUnit 5 进行显著地改进,并且充分利用 Java 8 的新特性,特别是 Lambda 表达式,最终提供了新的断言类: org.junit.jupiter.api.Assertions

    2.8K20

    Java单元测试之JUnit 5快速上手

    无论是自己的编码能力的提高,还是项目质量的提升,都是大有好处,本文将介绍 Java 单元测试框架 JUnit 5 的基础认识和使用来编写单元测试,希望同样你有所帮助。...自从有了类似 JUnit 之类的测试框架,Java 单元测试领域逐渐成熟,开发人员单元测试框架也有了更高的要求:更多的测试方式,更少的其他库的依赖。...Java 8 的支持, Lambda 表达式,Sream API等。...这是基本的用法,我们还可以对重复运行的测试方法名称进行修改,利用 @RepeatedTest 提供的内置变量,以占位符方式在其 name 属性上使用,下面先看下使用方式和效果: @DisplayName...新的断言 在断言 API 设计上,JUnit 5 进行显著地改进,并且充分利用 Java 8 的新特性,特别是 Lambda 表达式,最终提供了新的断言类: org.junit.jupiter.api.Assertions

    1.2K40

    调试 RxJS 第2部分: 日志篇

    rxjs-spy 使用 tag 操作符标记过的 observables 起作用,tag 操作符使用字符串标签名来注释 observable,仅此而已。...它显示了所发生的一切: 订阅组合 observable 会并行订阅每个用户 API 请求的 observable 请求完成的顺序是不固定的 observables 全部完成 全部完成后,组合 observable...当调试,我发现知道实际的 subscribe 调用地点比知道位于组合 observable 中间的 subscribe 调用地点更有用。 现在我们来看一个现实问题。...当编写 redux-observable 的 epics 或 ngrx 的 effects ,我见过一些开发者的代码大概是这样的: ? 乍看上去没什么问题,而且大多数情况下也能正常运行。...这种 bug 还是在单元测试里发现不了的。 问题就是有时候 epic 就会停止运行。再具体一点就是当 dispatch 了报错的 action 后它会停止运行。 日志显示了具体发生了什么: ?

    1.2K40

    PICK一下,iOS自动化测试新方案出道

    通过以上几种方式便能够测试一些平常的手工测试或者UI测试难以做到的,比如:1.需要构造大量的操作,点10000个赞等2.手工难以反复触发的操作,首次进入等3.平常难以复现的场景,点赞或者评论失败4...平常难以复现的场景,点赞或者评论失败     4.测试底层方法的功能是否正常,如下载组件的方法     5.快速测试复杂场景,反复测试视频的合成是否成功     6.等等…… 4.3 hook函数...UI自动化的稳定性差,是由于经常会出现空间查找失败或者UI变更导致用例失败。 OCMock单元测试都是基于底层接口的测试,稳定性高。...** OCMock单元测试**做不到验证UI效果的能力,一般都是作为接口测试。...UI自动化根据不同的方案源码的依赖是不同的,如果用的是APPIUM,就不依赖源码,如果用的是KIF,那就需要集成到源码中了。 OCMock单元测试需要集成到源码。

    2.3K61

    FunTester原创文章(基础篇)

    利用alertover发送获取响应失败的通知消息 使用httpclient中EntityUtils类解析entity遇到socket closed错误的原因 httpclient接口测试中重试控制器设置...试试Groovy进行单元测试 模糊断言 使用WireMock进行更好的集成测试 如何测试这个方法--功能篇 如何测试这个方法--性能篇 单元测试用例 关于测试覆盖率 JUnit 5和Selenium基础...工具类单元测试 性能测试 Linux性能监控软件netdata中文汉化版 性能测试框架 性能测试框架第二版 性能测试框架第三版 一个时间计数器timewatch辅助性能测试 如何在Linux命令行界面愉快进行性能测试...Mac+httpclient高并发配置实例 单点登录性能测试方案 如何对消息队列做性能测试 如何修改密码接口进行压测 如何单行多次update接口进行压测 如何多行单次update接口进行压测...如何获取JVM堆转储文件 性能测试中标记每个请求 如何N个接口按比例压测 如何性能测试中进行业务验证 性能测试中记录每一个耗时请求 线程安全类在性能测试中应用 利用微基准测试修正压测结果 性能测试如何减少本机误差

    2.5K10

    .NET单元测试的艺术-1.入门

    一、单元测试基础 1.1 什么是单元测试   一个单元测试是一段自动化的代码,这段代码调用被测试的工作单元,之后这个单元的单个最终结果的某些假设进行检验。   单元测试几乎都是用单元测试框架编写的。...集成测试是一个工作单元进行的测试,这个测试被测试的工作单元没有完全的控制,并使用该单元的一个或多个真实依赖物,例如时间、网络、数据库、线程或随机数产生器等。   ...日志文件的格式是你们公司自己制定的,无法用现有的第三方软件进行解析。你的任务是:实现一个产品,这些日志文件进行分析,在其中搜索特定的情况和事件,这个产品就是LogAn。...3.5 继续添加测试方法   (1)通常在进行单元测试我们会考虑到代码覆盖率,点击"测试"->"分析代码覆盖率"->"所有测试",你可以看到以下结果:80% ?   ...五、小结   这一篇作为入门,带领大家领略了一下单元测试的概念,如何编写单元测试,如何在VS中应用NUnit进行单元测试。相信大家以前都用过MSTest,而我们这里却使用了NUnit。

    2.1K20

    Java单元测试之JUnit 5快速上手

    无论是自己的编码能力的提高,还是项目质量的提升,都是大有好处,本文将介绍 Java 单元测试框架 JUnit 5 的基础认识和使用来编写单元测试,希望同样你有所帮助。...自从有了类似 JUnit 之类的测试框架,Java 单元测试领域逐渐成熟,开发人员单元测试框架也有了更高的要求:更多的测试方式,更少的其他库的依赖。...Java 8 的支持, Lambda 表达式,Sream API等。...为了解决测试类数量爆炸的问题,JUnit 5提供了@Nested 注解,能够以静态内部成员类的形式测试用例类进行逻辑分组。...新的断言 在断言 API 设计上,JUnit 5 进行显著地改进,并且充分利用 Java 8 的新特性,特别是 Lambda 表达式,最终提供了新的断言类: org.junit.jupiter.api.Assertions

    1.1K20

    Angular vs React 最全面深入对比

    RxJS允许您将任何东西视为连续的流,并进行各种操作,例如映射,过滤,拆分或合并。 该类库已被Angular采用其HTTP模块以及一些内部使用。...当您使用连续数据流(Web套接字)工作很多的情况下,RxJS非常有用,但是对于其他任何东西来说似乎过于复杂。 无论如何,当你使用Angular,您至少应该了解RxJS的基本知识。...@ngrx/store @ngrx/store是由Redux启发的Angular的状态管理库,基于由pure reducer进行突变的状态。...Jest(来自Facebook的一个单元测试工具)也同时集成在Create-react-app内部,更方便的让我们进行单元测试。...如果结果感到满意,可以继续全面构建。如果没有,会给你充分的时间重新选择。

    3.8K70

    Newbe.Claptrap框架入门,第一步——创建项目,实现简易购物车

    /Cart/{id} 从指定 id 的购物车中移除特定的商品 您可以通过界面上的 Try It Out 按钮来尝试 API 进行几次调用。...如何在 VS 中同时启动多个项目 如何在 Rider 中同时启动多个项目 使用华为云加速 nuget 还原速度 第一次添加商品,没有效果? 是的,您说的没错。项目模板中的业务实现是存在 BUG 的。...我们按照业务需求,判断状态中的字典是否包含 SkuId,并其数量进行更新。 继续调试,代码将会运行到这段代码的结尾。...这是一个考虑单元测试框架 在项目模板中存在一个项目HelloClaptrap.Actors.Tests,该项目包含了主要业务代码的单元测试。...当然,上面还有另外一个关于删除场景的单元测试也是失败的。开发者可以按照上文中所述的“断点”、“单元测试”的思路,来修复这个问题。

    18920

    同样做前端,为何差距越来越大?

    庆幸的是除了 React 社区,Vue 社区有类似的 Vuex,Angular 社区有 NgRx 也提供了几乎同样的能力,甚至 NgRx 还可以无缝使用 redux-devtools 来调试状态变化。...Pont 解析 API 元信息生成 TS 的取数函数,这些取数函数类型完美,并挂载到 API 模块下。最终代码中取数效果是这样的: ?...Pont 实现的效果有: 根据方法名自动匹配 url、method,并且对应到 prams、response 类型完美,并能自动提示; 后端 API 接口变更后,前端相关联的请求会自动报错,再也不担心后端悄悄改接口前端不知晓...全局污染:约定每个样式文件只能有一个顶级类, .home-page{ .top-nav {//}, .main-content{ // } }。...五、严格彻底的 Code Review 过去的一年,我们一共进行了 1200+ 多次 Code Review(CR),很多同事从刚开始不好意思提 MR(GitLab Merge Request,Code

    1.2K20

    JUnit VS TestNG

    单元测试总是在集成测试之前进行。它有助于在应用程序开发生命周期的早期阶段发现缺陷。开发人员使用不同的单元测试框架来创建单元测试的自动化测试用例。...市场上有不同的工具可用于执行单元测试 JUnit、NUnit、PHPUnit、JMockit等。 JUnit 于 1997 年作为一个开源的基于 Java 的单元测试框架推出。...TestNG 生成报告,帮助开发人员了解所有测试用例的通过、失败和跳过状态。 了解 TestNG 和 JUnit 测试框架之间的区别,有助于选择最适合单元测试框架。...让我们看一下显示测试套件如何在两个框架中运行的代码片段。...FunTester() { int i = 10/0; } 超时测试 这个功能指测试执行中的超时功能,该功能设置时间限制,当超过该时间限制,测试会自动失败

    1.4K30
    领券