反应玩笑和MSAL获取BrowserAuthError

Question

我正在尝试测试一些使用MSAL进行身份验证的组件。

到目前为止，我有一个简单的测试，测试我的组件是否可以呈现，如下所示：

let container;
beforeEach(() => {
    container = render(<NavBar/>)
});
test('Component renders', () => {
    expect(container).not.toBeNull()
})

当我运行测试时，我会得到以下错误：

BrowserAuthError: crypto_nonexistent: The crypto object or function is not available. Detail:Browser crypto or msCrypto object not available.
  
  at BrowserAuthError.AuthError [as constructor] (node_modules/@azure/msal-browser/dist/index.cjs.js:545:24)
  at new BrowserAuthError (node_modules/@azure/msal-browser/dist/index.cjs.js:7096:28)
  at Function.Object.<anonymous>.BrowserAuthError.createCryptoNotAvailableError (node_modules/@azure/msal-browser/dist/index.cjs.js:7113:16)
  at new BrowserCrypto (node_modules/@azure/msal-browser/dist/index.cjs.js:7413:36)
  at new CryptoOps (node_modules/@azure/msal-browser/dist/index.cjs.js:7782:30)
  at PublicClientApplication.ClientApplication (node_modules/@azure/msal-browser/dist/index.cjs.js:10027:58)
  at new PublicClientApplication (node_modules/@azure/msal-browser/dist/index.cjs.js:11307:23)

我不知道上面的意思是什么，但据我所能理解，这个错误正在发生，因为会话没有经过身份验证。

因此，我的问题可分为以下几点：

• 这个错误意味着什么？
• 如何解决这个错误？(为了测试目的，我们能绕过MSAL吗？)

Answer 1

因此，基本上，我发现我的<NavBar/>组件依赖于两个MS Graph调用，即getAccountData()和setAccountData()，这显然需要一个令牌才能运行，并导致了上面的严重错误。

因此，我决定绕过这两个函数，简单地模拟它们，如下所示：

jest.mock('../msGraph', () => ({ setAccountData: jest.fn() }))
jest.mock('../msGraph', () => ({ getAccountData: jest.fn() }))

我不依赖于从Graph获取数据来执行我的测试，因此这两个模拟函数不返回任何数据。(不过，我本可以将其添加到jest.fn()的方括号中才能做到这一点)