使用 TypeScript 在 Jest 中测试原始或静态 HTML

使用 TypeScript 在 Jest 中测试原始或静态 HTML

Photo by 瓦列里·西索耶夫 on 不飞溅

我想写 是 测试一些相当基本的 DOM 读取/操作功能。所以我想我只是创建一个静态 HTML 文件作为固定装置，然后将其读入我的测试中。

最初，我尝试在我的 webpack 配置中使用 raw-loader 和/或资产加载器，但我无法让 Jest 很好地使用它们。即使 让 raw-loader 与我的 TypeScript 配置一起工作 , Jest 似乎试图将 HTML 解析为 Javascript。我也试过 开玩笑的原始装载机 无济于事。

我最终做的只是用标记导出一个变量（ 对模板文字使用方便的反引号表示法 )，然后将该标记添加到我在容器上创建的新 div 的 innerHTML 中。所以：

测试/夹具/nested_html.html

测试/nested_child_walker.test.ts

这让我可以为我的 立即儿童 使用我的夹具中的示例 HTML 标记的方法。

您也可以直接将标记注入 DOM，以便其他方法可以看到它。在里面 之前每个 上面的方法，看起来像：

 document.body.innerHTML = nested_html

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明

本文链接：https://www.qanswer.top/30382/39091209