Question

所以我有这个自定义钩子，我正在用 @testing-library/react-hooks、jasmine 和 karma 进行测试。这是一个 AngularJS/React 应用程序。我正在做迁移。

const useSearchParams = () => {
  const $rootScope = useAngularInjection('$rootScope');
  const stateProvider = useAngularInjection('$location');
  const [ url, setUrl ] = useState(stateProvider.search());

  $rootScope.$on('$locationChangeSuccess', () => {
    setUrl(stateProvider.search());
  });

  return url;
};

其中 useAngularInjection 是另一个仅注入 AngularJS 内容的钩子（它工作正常）。

这是我的测试（使用业力和茉莉花）

 it('should update the search query from the url when it changes', () => {
      $location.url('https://localhost:8000?all=true&order=title&start=0');
      $rootScope.$apply();

      const { result, rerender } = renderHook(() => useSearchParams());

      $location.url('https://localhost:8000?unscheduled=true&order=title&start=10');
      $rootScope.$apply();

      rerender();

      expect(result.current).toEqual({
        unscheduled: 'true',
        order: 'title',
        start: '10',
      });
 });

目前 result.current 仍为 {all: 'true', start: '0', order: 'title'}，未更新。

我尝试调试它，它实际上返回到 $locationChangeSuccess 分支，所以我不明白为什么它没有更新 result.current 的值。

$rootScope 和 $location 之前已注入并且也可以正常工作。

有什么想法吗？

自定义钩子测试 - 调用 rerender()

0 个答案: