как проверить / смоделировать реакцию крючков?

Question

Недавно я обновил библиотеку okta-реагировать и перевел приложение для использования новых хуков. Я обновляю свои тесты сейчас. useOktaAuth() - это undefined. Я хочу иметь возможность смоделировать это, чтобы я мог проверить, когда пользователь вошел в систему.

const { authState, authService } = useOktaAuth();

// TypeError: Cannot destructure property `authState` of 'undefined' or 'null'

Чтобы исправить это, я попытался смоделировать ловушку, выполнив:

    jest.mock('@okta/okta-react', () => ({
      useOktaAuth: () => {
        return {
          authState: {},
          authService: {}
        };
      }
    }));

Это не работает. Я все еще получаю какие-либо идеи о том, как проверить эти компоненты?

Спасибо

Answer 1

У меня было почти то же сообщение о том, что

TypeError: Невозможно уничтожить свойство 'authState' of '(0, _oktaReact.useOktaAuth) (...)', поскольку оно не определено. ** "

Составная часть:

import { useOktaAuth } from "@okta/okta-react";

const Login = () => {
const { authState } = useOktaAuth();
...

ТЕСТ:

jest.mock('@okta/okta-react', () => ({
    useOktaAuth: () => {
      return {
        authState: {},
        authService: {}
    };
  }
}));

describe("<Login /> component tests", () => {
  it("Should render Login component", done => {
      const wrapper = shallow(<Login/>);

      setImmediate(() => {
          wrapper.update();
          try {
              // Your assertion here
              done();
          } catch (error) {
              done.fail(error);
          }
      });
  });

});

Answer 2

jest.mock('@okta/okta-react', () => ({
    useOktaAuth: () => {
 return {
   authState: {},
   authService: {}
   };
 }
 }));

 test('should render CreateDeploymentManifestPage and ShowDeploymentManifest', 
  () => {
  const myMock= jest.fn();

  const wrapper = shallow(<CreateDeploymentManifestPage />);
  const basicInfo = wrapper.find(DeploymentBasicInfo);
  expect(wrapper.containsAllMatchingElements([
   <DeploymentBasicInfo />,
  ])).toBe(true);
  });