Question

我正在使用Create React App。我正在尝试在组件中模拟isLoggedIn的行为以获取所有行的代码覆盖率。为此，请执行以下操作：user必须与data.accessToken一起存在

我尝试在测试中设置localStorage数据，但是它不起作用。与实际上在isLoggedIn函数中使用的方法相同，并产生100％的行覆盖率。

isLoggedIn函数

export const isLoggedIn = () => {
  const userFromLocalStorage = store('user');
  return _get(userFromLocalStorage, 'data.accessToken', false);
};

PrivateRoute.js：

const PrivateRoute = ({ component: Component, ...rest }) => (
  <Route
    {...rest}
    render={props =>
      isLoggedIn() ? (
        <Component {...props} />
      ) : (
        <Redirect to={{ pathname: 'login' }} />
      )
    }
  />
);

PrivateRoute.spec.js

import store from 'store2';
describe('PrivateRoute Logged In', () => {
  store('user', {
    data: {
      accessToken: 'dfg',
    },
  });

  const ShallowPrivateRoute = shallow(
    <PrivateRoute path="/" name="Home" component={TestComponent} />
  );

  it('should cover logged in case', () => {
    expect(ShallowPrivateRoute).toBeDefined();
  });
});

有没有可以模拟isLoggedIn函数以仅针对一次测试返回true的方法？

测试这种行为的最佳方法是什么？

Answer 1

您可以像这样模拟整个文件：

jest.mock("you-module", () =>({...methodsMock}));

或者您可以在props中接收isLoggedIn，这样，在测试中渲染组件时，您只需要传递一个模拟函数即可。

<Component isLoggedIn={jest.fn().mockReturnValue(true)} />

模拟测试中的localStorage数据

1 个答案: