OAuth2 是一种常见的授权框架，用于在不直接与用户共享凭据的情况下授权第三方应用程序访问受保护的资源。在前端开发中，我们可能会编写一些代码与 OAuth2 相关，如获取访问令牌或刷新令牌。因此，在编写这些代码时，测试十分重要。在本文中，我们将介绍如何使用 Jest 测试 OAuth2 相关的代码。
安装 Jest 和相关依赖项
在开始之前，我们需要安装 Jest 和相关的依赖项。在命令行中运行以下命令：
--- ------- ---------- ---- ---------------
jest是测试框架本身。jest-fetch-mock是模拟fetchAPI 的库，我们将在测试中使用它。
模拟 OAuth2 服务器
在编写我们的测试用例之前，我们需要模拟一个 OAuth2 服务器。我们可以使用 OAuth 2.0 Playground，该网站提供了一个可以进行 OAuth2 授权流程的演示服务器。我们将在测试中使用它来模拟 OAuth2 服务器。
编写测试用例
现在我们可以开始编写我们的测试用例了。考虑以下代码，它将使用 OAuth2 授权码流程获取访问令牌：
----- -------- ------------------------ ------------- ----- -
----- ------ - --- ------------------
--------------------------- ----------------------
-------------------------- ----------
------------------------------ --------------
--------------------- ------
----------------------------- -----------------------------------------
----- -------- - ----- ------------------------------------------- -
------- -------
----- -------
-------- -
--------------- ------------------------------------
--
---
----- ---- - ----- ----------------
------ ------------------
-我们将编写一个测试用例来测试此功能。
------------------ -- -- -
------------- -- -
-------------------
---
---------------------- ----- -- -- -
----------------------------------- ------------- ----------------- ----
----- ----------- - ----- ------------------------------ ------------------- -----------
-------------------------------------------
-----------------------------------------------------------------------------
------------------------------------------------------
------------------------------------------------------------------------------------
-----------------------------------------------------------------------------
-------------------------------------------------------------------------------------
-------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------
-----------------------------------------------
---
---我们首先使用 beforeEach 重置 fetch 的模拟。然后，我们使用 fetch.mockResponse 模拟 fetch API 的响应。
在测试中，我们可以使用 fetch.mock.calls 来获取已进行的所有 fetch 调用。通过测试每个调用的属性，我们可以确保我们正在正确构建请求。然后，我们检查返回的访问令牌是否与我们预期的相同。
运行测试
现在我们已经编写了测试用例，运行测试非常容易。在命令行中运行以下命令：
----
Jest 将自动运行我们的测试用例，并输出包括测试结果和覆盖率的摘要。
结论
在本文中，我们介绍了如何使用 Jest 和模拟服务器测试 OAuth2 相关的代码。我们编写了一个测试用例来测试 OAuth2 授权码流程，并解释了每个测试步骤的意义。使用此文章中的示例代码和指导，您可以更好地测试您的前端 OAuth2 相关的代码，从而提高代码的可靠性和质量。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/671f376a2e7021665efc6991