小编Cru*_*ink的帖子

当数据在缓存中时 Apollo 客户端 client.readQuery 返回 null

这肯定是用户错误,但我有一个带有简单currentUser查询的应用程序,该查询在 JWT 中查找 id,查找它并返回相应的用户。

我可以查看 devtools 并看到它在缓存中__ref:User:19

export const CURRENT_USER_QUERY = gql`
  query{
    currentUser {
      id
      fullName
      email
    }
  }
`
Run Code Online (Sandbox Code Playgroud)

但在我的组件中,当我const { currentUser } = client.readQuery({ query: CURRENT_USER_QUERY });这样做时(间歇性地)会爆炸,因为:

Cannot destructure property 'currentUser' of 'client.readQuery(...)' as it is null.
Run Code Online (Sandbox Code Playgroud)

用户:19 存在并且是我需要的所有内容。我点击重新加载,同一页面就可以工作了。

我在客户端中将默认错误策略设置为“全部”。

这是客户端的版本3.3.11。Chrome v88.04,物有所值。反应 17.01。

我在这里错过了什么吗?如果该项目在缓存中,是否应该不同步(并且可靠地)返回值?

有没有更好的方法来处理这种情况?我正在尝试让这个应用程序不再将内容存储在 redux 或某些上下文提供程序中,因为它已经由 Apollo 处理。让一堆不同的东西来处理这个责任似乎是多余的。

apollo reactjs react-apollo apollo-client

13
推荐指数
2
解决办法
9264
查看次数

使用react-testing-library在Jest中模拟React上下文提供者

我有一个相当复杂的上下文,我将其包装在我的应用程序中来处理身份验证并提供从身份验证服务检索到的关联数据。我想绕过提供程序的所有功能并仅模拟返回值。当上下文呈现时,它会执行一堆我在测试时不希望发生的初始化函数。

我在我的包装函数中尝试了类似的方法:

const mockValue = {
  error: null,
  isAuthenticated: true,
  currentUser: 'phony',
  login: jest.fn(),
  logout: jest.fn(),
  getAccessToken: jest.fn(),
}

const MockAuthContext = () => ( React.createContext(mockValue) )

jest.mock("../contexts/AuthContext", () => ({
  __esModule: true,
  namedExport: jest.fn(),
  default: jest.fn(),
}));

beforeAll(() => {
  AuthContext.mockImplementation(MockAuthContext);
});

const customRender = (ui, { ...renderOpts } = {}) => {
  const ProviderWrapper = ({ children }) => (
      <AuthContext.Provider>
         {children}
      </AuthContext.Provider>
  );
  return render(ui, { wrapper: ProviderWrapper, ...renderOpts });
};

// re-export everything
export * from …
Run Code Online (Sandbox Code Playgroud)

mocking reactjs jestjs react-context react-testing-library

10
推荐指数
1
解决办法
4万
查看次数