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

NgRx测试- NullInjectorError:没有服务提供商

NgRx是一个用于构建响应式应用程序的状态管理库,它基于Redux模式。它提供了一种集中管理应用程序状态的方式,使得状态的变化和管理变得更加可预测和可维护。

在NgRx中进行测试时,可能会遇到"NullInjectorError:没有服务提供商"的错误。这个错误通常是由于测试环境中缺少必要的依赖注入配置导致的。

要解决这个错误,可以采取以下几个步骤:

  1. 确保在测试文件的顶部导入所需的依赖项。例如,如果你在测试中使用了NgRx的Store,你需要导入StoreModule.forRoot()
  2. 在测试之前,使用TestBed.configureTestingModule()方法配置测试模块。这个方法允许你配置测试环境中所需的依赖项和提供商。确保在配置中包含所有需要的依赖项。
  3. 如果你在测试中使用了自定义的服务,确保在测试模块的提供商配置中包含这些服务。例如,如果你有一个名为MyService的服务,你可以在测试模块的提供商配置中添加{ provide: MyService, useClass: MyService }
  4. 如果你在测试中使用了NgRx的特定功能模块(如Effects、Selectors等),确保在测试模块的导入配置中包含这些模块。例如,如果你在测试中使用了Effects,你可以在测试模块的导入配置中添加EffectsModule.forRoot([MyEffects])
  5. 如果你在测试中使用了NgRx的Store,确保在测试之前使用TestBed.overrideProvider()方法覆盖默认的Store提供商。例如,你可以使用TestBed.overrideProvider(Store, { useValue: mockStore })来使用一个模拟的Store实例。

总结起来,解决"NullInjectorError:没有服务提供商"的错误需要确保在测试环境中正确配置了所有需要的依赖项和提供商。通过使用TestBed.configureTestingModule()方法配置测试模块,并在其中包含所有需要的依赖项和提供商,可以解决这个错误。

腾讯云相关产品和产品介绍链接地址:

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

相关·内容

参加 Spartacus 开源项目开发时需要注意的一些编程规范

我们使用 NgRx 存储来管理 Spartacus 功能中的全局应用程序状态。 使用 NgRx 在性能、更好的可测试性和易于故障排除、方面具有明显的优势。...如果要从 UI 组件调用使用 NgRx 逻辑的功能,则应实现外观服务功能以公开功能并将 NgRx 代码封装在核心库中。 NgRx 的复杂性被封装在核心库中。 门面服务可从核心库中获得。...外观服务公开了核心库功能,但它们在其实现中隐藏了 NgRx 逻辑。 内置 Spartacus UI 组件不应包含 NgRx 逻辑。 相反,UI 组件应该调用外观服务函数。...单元测试必须覆盖所有代码。 关于端到端测试,基本的 UI 端到端测试以及可访问性端到端测试必须始终涵盖面向 UI 的新功能。 测试的文件名应以 e2e-spec.ts 结尾。...如果开发人员有多个用户流测试,请将它们分成单独的文件,以便它们可以并行运行。 我们还建议将测试分组到具有相关名称的子目录中。

68140

SAP Spartacus Ngrx 使用的一些准则

官网链接 我们使用 NGRX store 来管理我们功能中的全局应用程序状态。使用 NGRX 在性能、更好的可测试性和易于故障排除(时间旅行等)方面具有明显的优势。...除非有令人信服的理由,否则将 Ngrx store 用于某个 feature 。 我们希望在整个应用程序中保持一致。 为整个应用程序使用一个 common store。...如果要从 UI 组件调用使用 NGRX 逻辑的功能,则应实现外观服务功能以公开功能并将 NGRX 代码封装在核心库中。 NGRX 的复杂性被封装在核心库中。 Facade 服务可从核心库中获得。...外观服务公开了核心库功能,但它们在其实现中隐藏了 NGRX 逻辑。 内置 Spartacus UI 组件不应包含 NGRX 逻辑。 相反,UI 组件应该调用外观服务功能。

35320

Angular 接入 NGRX 状态管理

来更新状态的 Reducer: 选项介绍: 选项 作用 --reducers 执行reducers存放路径,约定路径为上一级的 index.ts,也是 store 创建的文件 --skip-tests 跳过生成测试文件...提供目标模块的路径 --skip-tests 跳过生成测试文件 示例命令: ng generate effect store/effects/user --root --module=app.module.ts...EffectsModule.forRoot([UserEffects]), ], }) export class AppModule {} 编写 Test User Api: 执行 ng 命令生成 User 服务...设置副作用所关联的 Action ofType(UserActions.updateUser), // 处理副作用 exhaustMap(() => { // 调用服务...AppState 创建实体: 选项介绍: 选项 作用 --reducers 执行reducers存放路径,约定路径为上一级的 index.ts,也是 store 创建的文件 --skip-tests 跳过生成测试文件

14110

使用 Ngrx ActionSubject 监听 Dispatched NgRx Actions

NgRx 是一个用于 Angular 应用开发的响应式 State 管理工具库。 受到 Redux 的影响,Ngrx 底层使用 Rxjs 来允许用户管理整个应用的全局状态。...使用NgRx需要理解一些关键概念,Actions 就是其中之一。 在NgRx上下文中,动作描述的是可以从任何地方(例如组件和服务)分派的唯一事件实例。 下面的代码展示了一个简单操作的样子。...对于上图所示的源代码,可以编写单元测试代码,检查提交了 login form 之后,是否调度了对应的 action. 如果应用程序变大,应用程序状态也会变大。...来避免记录NgRx自己调度的第一个操作。...幸运的是,NgRx让我们很容易做到这一点。不需要另一个包或浏览器扩展。

1.7K30

SAP Spartacus 单元测试开发规范

官网 所有代码都必须被单元测试覆盖。 每次测试测试一件事(在一个 it 里实现)。 单元测试将被测试的代码与其依赖项隔离:模拟所有的依赖项。...虽然模拟服务之类的依赖关系更为明显,但很容易忘记模拟从测试组件的模板中调用的子组件。 要模拟子组件,您可以在规范文件中创建它的假副本。...declarations: [MockSomeComponent], providers: [ ... ], }).compileComponents(); NGRX...and Tests That Use the Store 事实证明,模拟 NGRX 商店是一项相当大的挑战。...NGRX 存储是我们单元测试中模拟依赖项规则的例外。 要对从 store 读取的一段代码执行单元测试,请通过使用数据显式调用相关成功操作来填充 store 以设置测试

1.7K30

为什么在大型 Angular 应用里我们需要使用 ngrx

参考 ngrx 官网:https://ngrx.io/guide/effects#registering-root-effects Comparison with component-based side...effects 在基于服务的应用程序中,您的组件通过许多不同的服务与数据交互,这些服务通过属性和方法公开数据。...这些服务可能依赖于管理其他数据集的其他服务。 您的组件使用这些服务来执行任务,从而赋予您的组件许多职责——违反了设计的单一职责原理。 想象一下,您的应用程序管理电影。...在更大的应用程序中,这变得更加重要,因为您有多个数据源,需要多个服务来获取这些数据,而服务可能依赖于其他服务。...您的组件变得更容易测试并且对它需要的数据负责。

1.2K30

2018-08-05 没有测试用例的代码,根本不应该跑在服务器上

在实际测试中,一个单元可以小到一个方法,也可以大到包含多个类。从定义上讲,单元测试和集成测试是有严格的区分的,但是在实际开发中它们可能并没有那么严格的界限。...契约测试 契约测试会给每个服务生成一个 Stub,可以用于调用方的单元/集成测试。例如,我们需要测试预约服务的预约操作,而预约操作会调用用户服务,去验证用户的一些基本信息,比如医生是否认证等。...Stub,当然在测试的时候,我们需要把服务调用接口的 baseUrl 设置为http://localhost:6565。...注意上面提到很重要一点是,单元测试必须是有效的,如果我们发现单元测试很难维护,那往往是因为我们没有写出有效的单元测试。...被测代码应该是抽象良好的 如果我们发现一段代码很难编写单元测试,常常是因为这段代码没有符合良好的抽象规范,比如没有使用 DI、不符合单一职责原则、或者依赖了全局的公共变量和方法等等。

1.3K50

关于 SAP 电商云 Spartacus UI SSR 的 state transfer 问题

通过 Chrome 开发工具我知道主页的源代码是由 SSR 服务器成功生成了。 然而,即使在 SSR 模式下,我发现 /cms/pages OCC API 仍然是从客户端触发的。...在 SSR 服务器的 log 里,我没有发现 CSR fallback: 但是,在客户端,我仍然发现了这些 OCC API call: 即使我使用了如下代码: ConfigModule.withConfig...ssrTransfer: { keys: { products: true, cms: true } } } }); 只能确保客户端没有发送...对于 cms - 我想无论我们是否在 ngrx 商店中,我们都会进行调用。...我们正在讨论的东西可能会在未来改进 默认情况下,Spartacus 在每次路由更改时重新加载 CMS 页面数据,无论它是否已经维护在 ngrx state 之中。

87750

SAP Spartacus 的会话管理 Session Management

为了支持这些额外的流程,Spartacus 3.0 不再将其自定义代码用于资源所有者密码流程,而是依赖于为此目的构建的第三方 angular-oauth2-oidc 库,该库也经过了良好的测试和认证。...以前,这些代币保存在 NgRx Store 中,但在 Spartacus 3.0 中,有专门的服务来保存数据。...该库需要一个带有类似于 localStorage 或 sessionStorage 的 API 的存储机制,这是从 NgRx 切换到带有流的服务来保存数据的主要原因。...在 Spartacus 3.0 之前,用户 ID 与 NgRx 中的令牌保存在同一位置,并且由于之前的关联,用户 ID 仍保留在 UserAuthModule 中。...如果请求没有 Authorization 标头,并且匹配 API 路径,则拦截器将标头添加到请求中。

2.9K30

【技术种草】介绍一款开源电商网站的购物车添加功能的实现

即使没有多少 Angular 开发经验的前端程序员,阅读本文之后,也能对 Spartacus 电商网站添加商品到购物车的功能实现,有一个最基础的了解。...代码仓库的代码克隆到本地并运行后,通过 https://localhost:4299 可以访问电商页面的 UI: [1240] 可以看到此时右上角红色的购物车图标显示的数字为0,意思是当前用户 Jerry Wang,还没有添加任意的商品到购物车里...Component 对应的模板文件头部查看,发现了 submit 事件的处理函数为 addToCart: [1240] 在 addToCart 内部,添加商品到购物车的执行逻辑,投递到了该 Component 注入的服务类...[1240] 最终,我们使用 NgRx 状态管理框架,将添加购物车这个动作,抽象成一个名为 CartActions.CartAddEntry 的 Action 类,并通过 NgRx Store 的 dispatch...[1240] 根据 NgRx 的架构图,这些投递出的 Action,最终会被 Effects 接收,后者会调用 Restful API 同后台服务器通信。

3.2K41

【技术种草】介绍一款开源电商网站的购物车添加功能的实现

即使没有多少 Angular 开发经验的前端程序员,阅读本文之后,也能对 Spartacus 电商网站添加商品到购物车的功能实现,有一个最基础的了解。...代码仓库的代码克隆到本地并运行后,通过 https://localhost:4299 可以访问电商页面的 UI: 可以看到此时右上角红色的购物车图标显示的数字为0,意思是当前用户 Jerry Wang,还没有添加任意的商品到购物车里...最终,我们使用 NgRx 状态管理框架,将添加购物车这个动作,抽象成一个名为 CartActions.CartAddEntry 的 Action 类,并通过 NgRx Store 的 dispatch...根据 NgRx 的架构图,这些投递出的 Action,最终会被 Effects 接收,后者会调用 Restful API 同后台服务器通信。...Spartacus 与后台服务器的交互设计如下图所示: Connector 会把添加购物车的请求转发给 Adapter(即下图第18行的 this.adapter),由后者调用 HTTP Restful

1.4K20

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

这取决于有些开发人员会告诉你最好使用React并在没有额外代码的情况下构建自己的组件。但这也可能是一个问题。...问题是我们的新组件没有做任何事情。...使用后端 由于我们没有在这里构建服务器端,因此我们将使用Firebase作为我们的API。如果您确实拥有自己的API后端,那么让我们在开发服务器中配置我们的后端。...从目前我们所知道的,我们正在从服务器上下载一张卡片列表,我们需要将它们合并到我们的服务器中State。...从我们的日志中可以看出,我们正在明确调度Action,但没有服务器请求在这里为我们提供。怎么了?我们忘了将我们的效果加载到我们的AppModule中。

42.3K10

SAP Spartacus 如何连接到其他系统

Facade 层:Facade 层隐藏了内存数据存储(NgRx)的复杂性。 该层旨在简化您的开发,让您专注于自定义视图逻辑。 内存存储:Spartacus 使用 NgRx 存储进行状态管理。...NgRx 被认为是复杂的,建议您使用 Facade 层。 后端连接器:后端连接器由 NgRx effect 调用,并在所需的 UI 模型中返回来自后端的响应。...话虽如此,当您绑定到替代数据源时,没有什么能阻止您进一步简化设置。 Connector 连接器协调与源系统的连接。...转换器是可选的:当没有找到给定域的转换器时,将返回源数据。此外,每当后端模型等于 UI 模型时,或者在简单转换的情况下,适配器都可以轻松处理。...如果需要,该服务会查找配置并将参数应用于端点。 注意:端点是类型安全的。 因此,在添加配置时,可用端点列表是可见的。

1.9K40
领券