什么是 nghtml2js-jest？
nghtml2js-jest 是一个 NPM 包，它将 .html 文件转换成可以供 Jest 测试使用的模板字符串。在 Angular 应用程序中，模板通常包含 HTML 和 Angular 命令。Jest 执行 JavaScript 代码，并没有办法识别这些模板字符串。nghtml2js-jest 将这些模板字符串转化为可被 Jest 测试的 JavaScript 代码。
安装
你可以使用以下命令安装 nghtml2js-jest：
npm install nghtml2js-jest --save-dev
使用
- 在
jest.config.js中配置transform：
transform: {
"^.+\\.(ts|js|html)$": "nghtml2js-jest"
}- 准备好你的测试代码。在测试代码中，你可以使用
require导入转换后的模板：
const template = require('./test.component.html.js');- 现在我们可以编写测试用例了：
-- -------------------- ---- -------
------------------------- -- -- -
--- -------- --------------------------------
--- ---------- --------------
------------------- -- -
--------------------------------
------------- - ------------- --
-------- - ---------------- -
--
---------------------
----
------------- -- -
------- - ---------------------------------------
--------- - --------------------------
------------------------
---
---------- -------- -- -- -
-------------------------------
---
---------- ------- --- ------- -- -- -
-----------------------------------------------------------------------------------------
---
---------- ------- --- ------- -- -- -
--------------- - --------- -------- ---------
------------------------
--------------------------------------------------------------------------------------------
---
-- ---- --------
---示例代码
test.component.html
<h1>{{ title }}</h1>
<ul>
<li *ngFor="let item of items">{{ item }}</li>
</ul>test.component.spec.ts
-- -------------------- ---- -------
------ - ------ ----------------- ------- - ---- ------------------------
------ - ---------------- - ---- -----------------------
------ - ------------- - ---- -------------------
------------------------- -- -- -
--- -------- --------------------------------
--- ---------- --------------
------------------- -- -
--------------------------------
------------- - ------------- --
-------- - ---------------- -
--
---------------------
----
------------- -- -
------- - ---------------------------------------
--------- - --------------------------
------------------------
---
---------- -------- -- -- -
-------------------------------
---
---------- ------- --- ------- -- -- -
----- -------- - ------------------------------------
-----------------------------------------------------------------------------------------
---
---------- ------- --- ------- -- -- -
----- -------- - ------------------------------------
--------------- - --------- -------- ---------
------------------------
--------------------------------------------------------------------------------------------
---
-- ---- --------
---结论
在进行 Angular 应用程序的单元测试时，nghtml2js-jest 可以帮助我们更好地测试由 HTML 和 Angular 命令组成的模板。希望这个教程对你有帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600562ee81e8991b448e0a3d