使用 Karma / Jasmine 进行 Angular 8 测试 -> 角度路由中的 loadChildren 未覆盖 100% 代码覆盖率

2024-03-28

从 Angular 7 升级到 Angular 8 后,应用程序路由的 loadChildren 发生了重大变化。当这些问题得到修复并且所有测试都在运行时,我不再获得 100% 的代码覆盖率,因为 loadChildren 不再是“字符串”,而是 LoadChildrenCallBack。

我如何测试代码的这个特定部分

setup:

import { NgModule } from '@angular/core';
import { RouterModule, RouterStateSnapshot, Routes } from '@angular/router';
import {
    RouterStateSerializer,
    StoreRouterConnectingModule,
} from '@ngrx/router-store';

import { LanguageGuard } from '@routes/guards/language-guard.service';
import { RouterStateUrl } from 'interfaces';
import { ErrorPageComponent } from 'pages';

/**
 * Class to implements the RouterStateSerializer with a custom serializer
 */
export class CustomSerializer implements RouterStateSerializer<RouterStateUrl> {
    /**
     * Serialize the RouterState with the CustomSerialzer
     * @param {RouterStateSnapshot} routerState
     * @returns RouterStateUrl
     */
    serialize(routerState: RouterStateSnapshot): RouterStateUrl {
        let route = routerState.root;
        while (route.firstChild) {
            route = route.firstChild;
        }
        const {
            url,
            root: { queryParams },
        } = routerState;
        const { params } = route;
        return { url, params, queryParams };
    }
}

const appRoutes: Routes = [
    {
        children: [
            {
                path: '',
                pathMatch: 'prefix',
                redirectTo: 'en',
            },
            {
                component: ErrorPageComponent,
                path: '404',
            },
            {
                canActivate: [LanguageGuard],
                children: [
                    {
                        loadChildren: () =>
                            import('../modules/home.module').then(
                                m => m.HomeModule,
                            ),
                        path: '',
                        pathMatch: 'full',
                    },
                ],
                path: ':language',
            },
        ],
        path: '',
        runGuardsAndResolvers: 'always',
    },
];

/**
 * Marks an class as an NgModule so it could be configured
 */
@NgModule({
    exports: [RouterModule],
    imports: [
        RouterModule.forRoot(appRoutes, {
            enableTracing: false,
            onSameUrlNavigation: 'reload',
        }),
        StoreRouterConnectingModule.forRoot({
            serializer: CustomSerializer,
        }),
    ],
    providers: [{ provide: RouterStateSerializer, useClass: CustomSerializer }],
})

/**
 * Exports the AppRoutingModule from the NgModule
 */
export class AppRoutingModule {}

在您的spec.ts 文件中

let router: Router;

beforeEach(async(() => {
   TestBed.configureTestingModule({
       // You need to config your TestBed and load any dependencies that are required by your Module.
       imports: [<more-here>, RouterTestingModule, <more-here>]
   });
   
   router = TestBed.get(Router);

}));

describe('Route XXXXX', () => {
   it('should load specific module', async () => {
       // locate the route config you are after
       // could be in the main config or in children or children of children
       const { YourModule } = await import('/path/to/module');
       const route = router.config[0].children.find(rc => rc.path === '<DESIRED_PATH>');
       expect(await route.loadChildren()).toEqual(YourModule)

   });
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 Karma / Jasmine 进行 Angular 8 测试 -> 角度路由中的 loadChildren 未覆盖 100% 代码覆盖率 的相关文章

随机推荐

  • 在python中导入外部“.txt”文件

    我正在尝试导入包含大约 10 个单词的列表的文本 import words txt 那不行 无论如何 我可以在不显示此内容的情况下导入文件吗 Traceback most recent call last File D python p1
  • 在 prestashop 管理的编辑产品页面添加一个字段

    我在 prestashop 数据库的产品表中添加了一个字段 mystock 现在我想在编辑产品页面中显示 编辑此字段 产品更新时也会更新 这个适用于我的 prestashop 1 5 4 将文件 Product php 添加到 overri
  • 通过 R 中的因子向量化 cumsum

    我正在尝试在一个非常大的数据帧 约 220 万行 中创建一个列 用于计算每个因子级别的 1 的累积和 并在达到新的因子级别时重置 下面是一些与我自己的类似的基本数据 itemcode lt c a1 a1 a1 a1 a1 a2 a2 a3
  • 查找 boost multi index 标签到索引和索引数量

    我有一个模板类 CrMultiIndex 它接收 boost 多索引 GlobalHash 的定义作为模板参数 I need 根据使用的索引向我的模板类添加统计信息 所以我需要一种方法在初始化时使用现有索引的数量调整向量 m StatsBy
  • iOS10 SDK什么时候设置视图帧大小?

    多年来 我一直在 Swift 和 ObjC 中使用这种技术来制作圆形视图 view layer cornerRadius view frame size width 2 view clipsToBounds true 当 Storyboar
  • 串行版本 UID 有何用途? [复制]

    这个问题在这里已经有答案了 我正在创建一个 Java 应用程序 当创建一个与 ADT 一起使用的接口时 它发现需要将一个随机数初始化为 ID 号 public class StackFullException extends Runtime
  • DomIcon 的集群

    我正在尝试制作集群H map DomMarker 正在使用H map DomIcon与 HTML 代码 但原生的 Here Map 聚类不起作用 仅当我使用简单的H map Icon 但由于这被渲染为canvas图层 我无法使用自己的标记
  • MFC:如何捕获Web浏览器控件中的链接单击事件?

    我有一个带有 Web 控件的 MFC 应用程序 单击可单击链接时 它将使用 IE 打开 而不是默认浏览器 问题 有没有办法强制使用默认浏览器打开它 如果没有 我如何捕获链接单击事件 以便稍后可以操纵单击事件 谢谢 不 据我所知还没有 查看有
  • 在 Mathematica 中导入 Google Sketchup 模型

    Google 的 Sketchup 是一个漂亮 简单的 3D 对象建模器 此外 谷歌还拥有巨大的3D 对象仓库 http sketchup google com 3dwarehouse 因此 如果您在这方面不是特别有天赋 实际上您不必自己做
  • R 包“partykit”在 ctree_control 中未使用参数

    我想使用 partykit 包通过 ctree 和 cforest 构建分类树和森林 由于我的数据集包含 50000 行和 30 列 因此我想将 minsplit 设置为 150 将 minbucket 设置为 50 不幸的是 当我输入我的
  • 与 xgboost 并行线程?

    根据其文档 xgboost 有一个 n jobs 参数 但是 当我尝试设置 n jobs 时 出现此错误 TypeError init got an unexpected keyword argument n jobs 其他一些参数 如 r
  • OpenSSL 错误 - 无法获取本地颁发者证书

    我有一个简单的链设置 在这种情况下可以成功验证 openssl version OpenSSL 1 0 2m 2 Nov 2017 openssl verify CAfile chain pem cert pem cert pem OK 但
  • ember 数据验证的标准模式是什么? (无效状态,变成无效……)

    我已经为此苦苦挣扎了一段时间 让我们看看是否有人可以帮助我 尽管自述文件中没有明确说明 但 ember data 提供了一定程度的验证支持 您可以在代码和文档的某些部分看到 https github com emberjs data blo
  • 查找堆中元素的位置

    考虑以下元素列表 h 38 203 1 45 39 10 34 90 10 2 100 1 如果将其放入基于数组的堆中 它将按以下方式查找 import heapq heapq heapify h now we have a heap th
  • 如何使用 Javascript 在离开页面之前调用函数

    我想在离开页面之前执行一个函数 而不显示确认弹出窗口JavaScript仅有的 我已尝试使用下面的代码 但它不起作用或与onbeforeunload但它总是显示弹出窗口 var result test if window onbeforeu
  • 混合 C++11 std::thread 和 C 系统线程(即 pthreads)

    我正在编写一个多线程 C 程序 并希望使用多线程 C 库 该库希望我使用本机系统方法为其创建一些工作线程 并使用如下代码将控制权传递给其 run 函数 void system specific thread init ifdef WIN32
  • cpprestsdk:架构 x86_64 的未定义符号

    我已经访问了所有其他问题 但据我所知 没有一个问题是我的问题 在 MacBook Pro 16GB 内存 Intel Core I7 上运行 OS X El Capitan 10 11 6 我也运行过brew doctor 但没有发现任何会
  • ui-bootstrap 分页在初始化时重置当前页面

    我正在使用 ui bootstrap angular bootstrap 库中的分页指令 我在初始化时遇到问题 当我通过 url 导航到特定页面时 会出现问题 发生的情况是 我的控制器使用 stateParams 中的正确页面进行初始化 然
  • 如何在跨度内的 CSS 中创建所有浏览器兼容的悬挂缩进样式

    我唯一发现的是 hang text indent 3em margin left 3em 实现此目的的唯一方法是将文本放入段落中 这会导致那些非常难看的额外行 我宁愿把它们放在一个 span class hang span 类型的事物 我还
  • 使用 Karma / Jasmine 进行 Angular 8 测试 -> 角度路由中的 loadChildren 未覆盖 100% 代码覆盖率

    从 Angular 7 升级到 Angular 8 后 应用程序路由的 loadChildren 发生了重大变化 当这些问题得到修复并且所有测试都在运行时 我不再获得 100 的代码覆盖率 因为 loadChildren 不再是 字符串 而