测试调用另一个钩子的自定义反应钩子

Question

我在为我的自定义 React 钩子创建测试时遇到了两难的问题。 （我是测试新手）

基本上，我有这个钩子 useUpdateProfileName，它使用 useSelectProfile 钩子来管理我的配置文件的状态（配置文件是一个对象），它唯一做的就是更新当前选择的配置文件的名称。

import { useSelectProfile } from './use-select-profile';

export const useUpdateProfileName = () => {
  const { selectedProfile, setSelectedProfile } = useSelectProfile();

  const updateName = (name: string) => {
    selectedProfile.name = name;
    setSelectedProfile(selectedProfile);
  };

  return { updateName };
};

如何模拟 useSelectProfile 挂钩，以便在使用给定字符串执行 updateName 时可以使用 selectedProfile 进行验证？

describe('Use Update Profile Name', () => {
  let profile: Profile;

  beforeAll(() => {
    profile = {name: 'Out of office'};
    
    wrapper = ({ children }) => {
      return (
        <ProfileStoreProvider>{children}</ProfileStoreProvider>
      );
    };
  });
  
  it('Should update profile name', () => {
    const { result } = renderHook(() => useUpdateProfileName(), { wrapper });

    act(() => {
      //setSelectedProfile(profile);
      result.current.updateName('Online');
    });

    expect(selectedProfile).toHaveProperty('name', 'Online');
  });
});