import { mockedMobile } from '../../../../mocks/data';
import userEvent from '@testing-library/user-event';
import MobileView from '../mobile-view';
import { render } from '@testing-library/react';

describe('MobileView component', () => {
  const mockedHandleBack = jest.fn();

  afterEach(() => jest.restoreAllMocks());

  test('successful render component', async () => {
    const result = render(<MobileView mobile={mockedMobile} onBack={mockedHandleBack} />);
    expect(await result.findByTestId('smskey-mobile-view')).toBeInTheDocument();
    expect(await result.findByText('شماره تلفن همراه:')).toBeInTheDocument();
    expect(await result.findByText(mockedMobile)).toBeInTheDocument();
    expect(
      await result.findByRole('button', { name: 'تغییر شماره تلفن همراه' })
    ).toBeInTheDocument();
  });

  test('call onBack function with correct arguments', async () => {
    const result = render(<MobileView mobile={mockedMobile} onBack={mockedHandleBack} />);
    const actionButton = await result.findByRole('button', { name: 'تغییر شماره تلفن همراه' });
    expect(actionButton).toBeInTheDocument();

    const user = userEvent.setup();
    await user.click(actionButton);
    expect(mockedHandleBack).toHaveBeenCalled();
  });
});
