import * as React from 'react';
import { describe, expect, it, jest } from '@jest/globals';
import { render, screen, waitFor } from '@testing-library/react';
import { BrowserRouter } from 'react-router-dom';
import { Provider } from 'react-redux';
import { useEffect } from 'react';

import ErrorBoundary from '../ErrorBoundary';
import { store } from '../../../__data__/store';

const ProblematicComponent = () => {
  useEffect(() => {
    throw new Error('Test Error');
  }, []);

  return <div>Этот текст не должен появиться</div>;
};
jest.mock('@brojs/cli', () => {
  return {
    getNavigationValue: () => '/auth/login',
    getConfigValue: () => '/api',
  };
});

describe('ErrorBoundary', () => {
  it('должен отобразить запасной UI при ошибке', async () => {
    // Подавляем вывод ошибки в консоль во время теста
    const consoleSpy = jest.spyOn(console, 'error');
    consoleSpy.mockImplementation(() => {});

    const { container } = render(
      <Provider store={store}>
        <ErrorBoundary>
          <BrowserRouter>
            <ProblematicComponent />
          </BrowserRouter>
        </ErrorBoundary>
      </Provider>,
    );

    const button = await waitFor(() =>
      screen.getByTestId('error-reload-button'),
    );

    expect(button).not.toBeNull();
    expect(container).toMatchSnapshot();

    // Восстанавливаем console.error после теста
    consoleSpy.mockRestore();
  });
});
