«React обнаружил изменение порядка хуков»

Question

Я столкнулся с этой проблемой при написании теста для компонента Auth. Не уверен, что это проблема в том, как я пишу тест, или проблема в самом приложении. Ниже приведена ошибка.

         Previous render            Next render
         ------------------------------------------------------
      1. useState                   useState
      2. undefined                  useEffect

, и я вижу это сообщение при неудачных тестах. " Обработано больше хуков, чем во время предыдущего рендеринга. "

Когда я добавил консольные операторы для useEffect, я увидел, что он вызывается только один раз.

Ниже мой компонент Auth .

const Auth: React.FC<Props> = (props) => {
 const state = useConsoleState();
 const [problemType, setProblemType] = React.useState<ProblemTypeEnum>("TECH");
React.useEffect(() => {
    switch (props.supportType) {
      case "limit":
        setProblemType("LIMIT");
        break;
      case "account":
        setProblemType("ACCOUNT");
        break;
      default:
        setProblemType("TECH");
        break;
    }
  }, [props.supportType]);
};
const userId = getUserOcid(state.userProfile);
const cimsUserValidationResult = authApiCalls.callCims(!props.csi, props.csi, userId, problemType, state.homeRegionName);

и мой тест

describe("Auth tests", () => {
  beforeEach(() => {
   const useEffect = jest.spyOn(React, "useEffect");
   useEffect.mockImplementationOnce(f => f());
   authApiCalls.callCims = jest.fn().mockReturnValue({
      loading: false,
      response: {
        response: {
          ok: true,
        },
      },
    } as QueryResult<ValidationResponse>);
  });
  const runProblemTypeTest = (url: string, supportType: SupportType) => {
    window = Object.create(window);
    Object.defineProperty(window, "location", {
      value: {
        href: url,
      },
      writable: true
    });
    mount(
      <Auth supportType=. {supportType}>
        <div>TestChild</div>
      </Authorization>
    );
    expect(authApiCalls.callCims).toHaveBeenCalledWith(
      false,
      "1234",
      "test",
      supportType,
      "homeRegion"
    );
  };
  it("check problem type passed to validate when problem type absent in the url", () => {
    runProblemTypeTest("http://www.test.com", "tech");
  });
});