шутка и энзим: как протестировать компонент с помощью useContext () - PullRequest
Новая
       6

шутка и энзим: как протестировать компонент с помощью useContext ()

0 голосов
/ 02 марта 2020

Мне нужно проверить следующий компонент (в основном я хочу проверить наличие компонента App, когда присутствуют имя пользователя и refre sh токен): 

const ParentRouter = () => {
  const { username, refreshToken } = useContext(GlobalContext);
  return (
    <Switch data-test="component-ParentRouter">
      {console.log("test1")}
      <Route path="/login" component={LoginPage} />
      <Route path="/forgotpassword" component={LoginPage} />
      {console.log("test2")}
      <ProtectedRoute
        isAllowed={refreshToken}
        username={username}
        path="/"
        component={App}
      />
    </Switch>
  );
};

Это моя попытка, поэтому далеко: 

const TestProtectedRouteWithCredentials = () => (
  <MemoryRouter initialEntries={["/ProjectsOverview/"]}>
    <GlobalContext.Provider
      value={{
        username: "testUser1",
        refreshToken: "hfsjkadhfjkshdfjkshdafs"
      }}
    >
      <ParentRouter />
    </GlobalContext.Provider>
  </MemoryRouter>
);

test("if userame and props then allow redirect to protected route i.e. app", () => {
  const wrapper = shallow(<TestProtectedRouteWithCredentials />);
  expect(
    wrapper
      .find(ParentRouter)
      .dive()
      .find(App)
  ).toHaveLength(1);
});

Хотя я не могу заставить его работать.

TypeError: Невозможно уничтожить свойство username из 'undefined' или 'null'.

Я искал вокруг, но не нашел то, что искал. Если кто-нибудь сможет показать мне достойный способ тестирования этого компонента с использованием Jest и Enzyme, я был бы очень признателен.

1 Ответ

0 голосов
/ 02 марта 2020

Есть открытый выпуск о useContext(), не работающем с мелким ферментом. Попробуйте вместо этого использовать mount.

Если вы не хотите использовать mount, вы можете попробовать смоделировать ваш GlobalContext в качестве обходного пути. Вот статья , объясняющая, как вы можете это сделать.

...