在 Jest 测试之前无法加载 Google Maps API
Posted
技术标签:
【中文标题】在 Jest 测试之前无法加载 Google Maps API【英文标题】：Can't load Google Maps API before Jest tests 【发布时间】：2022-01-21 03:36:46 【问题描述】：如何在 jest 运行任何测试之前全局加载 Google Maps API？
迁移到 NX，我已将我的库 @bespunky/angular-google-maps 从 karma + jasmine 迁移到 jest，但我的测试失败了。
许多测试使用本机对象（例如 google.maps.Map 或 google.maps.Marker）。谷歌地图有现有的模拟库，但它们甚至没有覆盖所有谷歌地图 API 的 30%。
我打算在某个时候在我的 Angular 库中实现至少 80% 的原生 API，这就是为什么模拟库和为我使用的每个原生项目实现模拟都不是可行的选择，因为模拟很快就会变得无法维护。
出于这个原因，我选择手动下载 API 文件并将其植入我的代码库中，然后在测试环境初始化时简单地运行它。我每次都在真实对象上模拟相关函数，而不是模拟整个库。这在业力上正常工作，但在开玩笑时失败了。
我尝试在jest.config.js 中添加setupFiles、setupFilesAfterEnv、globalSetup 下的文件。所有替代方案都执行该文件，但执行时会抛出以下错误：
TypeError: Cannot read property 'maps' of undefined
这就像 google 命名空间没有被加载。我猜这与 jest 不在浏览器上运行而 karma 运行的事实有关。
我什至试图告诉 jest 使用 DOM 模拟，在我的 jest.config.js 中添加以下内容：
module.exports =
...
testEnvironment: 'jsdom',
testEnvironmentOptions: html: `<html><head></head><body></body></html>`
;
同样的结果...
伙计们，我迷路了……任何建议都会有所帮助。
干杯????
【问题讨论】：
【参考方案1】：我写了@googlemaps/jest-mocks，这是一个用于 Google Maps JS 的部分模拟 API。
这个库对拉取请求开放并且易于修补。
import initialize from "@googlemaps/jest-mocks";
beforeEach(() =>
initialize();
);
【讨论】：
感谢贾斯汀的建议，在发布我的问题之前，我已经考虑过你的图书馆几次。不幸的是，它不足以满足我的需求，因为它只涵盖了 Google Maps API 的一小部分。这意味着我要么必须等待您开发更多功能，要么帮助维护库——这两种方法对我来说都不可行。 在这种情况下，我可能会将所有内容都转移到基于硒的测试中。它会很慢而且很脆弱，但它会按预期使用 API。我现在有一些库在 GitHub 操作中执行此操作。 github.com/googlemaps/js-api-loader/blob/main/e2e/…github.com/googlemaps/js-api-loader/blob/main/.github/workflows/…以上是关于在 Jest 测试之前无法加载 Google Maps API的主要内容，如果未能解决你的问题，请参考以下文章
JEST @vue/composition-api + Jest 测试套件无法运行 [vue-composition-api] 在使用任何函数之前必须调用 Vue.use(VueComposition
Angular + Jest：错误：未捕获（承诺）：无法加载 C:footer.component.html