реагировать-intl с реагировать-тестирование-библиотека дает недопустимую ошибку вызова ловушки

Question

в нашем проекте мы используем react-intl для интернационализации. Мы используем jest в качестве основы тестирования, и мы решили переместить нашу библиотеку утилит для модульного тестирования с энзима на react-testing-library. Но теперь, поскольку нет мелкого рендеринга, я должен сам предоставить <IntlProvider ... /> в тесте, никаких проблем. Но даже если я это сделаю, при тестировании терминала выдает Invalid hook call. Hooks can only be called inside of the body of a function component, но когда я запускаю проект локально, никакие ошибки не работают нормально, как ожидалось. PS в тестах провайдер Apollo работает нормально.

Могу предоставить дополнительную информацию, если вам нужно!

FirstNameFor.test.tsx

import { IntlProvider } from 'react-intl';
import { createMockClient } from 'mock-apollo-client';
import { ApolloProvider as ApolloProviderHooks } from '@apollo/react-hooks';
import { ApolloProvider } from 'react-apollo';

const wrapper = (mockProps, mockClient) => {
  return (
    <ApolloProvider client={mockClient}>
      <ApolloProviderHooks client={mockClient}>
        <IntlProvider locale="en">
          <FirstNameForm
            handleNext={mockProps.handleNext}
            onboardingState={mockProps.onboardingState}
            setHelpContent={mockProps.setHelpContent}
            updateOnboardingState={mockProps.updateOnboardingState}
          />
        </IntlProvider>
      </ApolloProviderHooks>
    </ApolloProvider>
  );
};

describe('FirstNameForm Container', () => {
  afterEach(() => {
    jest.clearAllMocks();
    cleanup();
  });

  it('should match snapshot', () => {
    // Arrange
    const mockProps = {
      handleNext: jest.fn(),
      onboardingState: {},
      setHelpContent: jest.fn(),
      updateOnboardingState: jest.fn(),
    };
    const mockClient = createMockClient();

    // Act
    render(wrapper(mockProps, mockClient));

    // Assert
    expect(wrapper).toMatchSnapshot();
  });
});

FirstNameForm.tsx

export const FirstNameForm: React.FC<StepContentProps> = props => {
  const [showMessageMutation] = useShowMessageMutation();
  const intl = useIntl();

  const formik = useFormik<FirstNameFormValues>({
   ...,
  });

  return <FirstNameFormComponent formik={formik} intl={intl} />;
};

Снимок экрана терминала