import React from 'react';
import { render, cleanup, waitFor } from '@testing-library/react';
import '@testing-library/jest-dom/extend-expect';

import Author from '.';

describe('Author Component', () => {
  test('render with props', () => {
    const { container, getByText } = render(<Author name="mohsen" prefix="by" link="name" />);
    expect(container.querySelector('.authorWraper')).toBeTruthy();
    expect(container.querySelector('.infoContainer')).toBeTruthy();
    const prefix = getByText('by');
    const name = getByText('mohsen');
    expect(prefix).toBeTruthy();
    expect(name).toBeTruthy();
    expect(container.querySelector('a').getAttribute('href')).toEqual('/name');
  });

  test('without link and image', () => {
    const { container } = render(<Author name="mohsen" />);
    expect(container.querySelector('.infoContainer')).toBeTruthy();
    expect(container.querySelector('a')).toBeFalsy();
    expect(container.querySelector('img')).toBeFalsy();
  });

  test('with date', () => {
    const { container, getByText } = render(
      <Author
        name="mohsen"
        icon={<i className="twitter" />}
        prefix="with"
        date="2020-04-24 15:37:42"
      />
    );
    expect(container.querySelector('.dateTimeWrapper')).toBeTruthy();
    const date = getByText('24.04.2020');
    const prefix = getByText('with');
    expect(date).toBeTruthy();
    expect(prefix).toBeTruthy();
    expect(container.querySelector('i')).toBeTruthy();
  });
  test('with verification badge with author profile image', async () => {
    // eslint-disable-next-line global-require
    const func = require('../../../helpers/device-detect');
    func.isNativeImageLazyLoadingSupported = jest.fn(() => true);

    const { container } = render(
      <Author
        authorImg="1689948486/hampus-320x320.jpg.jpeg"
        name="mohsen"
        icon={<i className="twitter" />}
        prefix="with"
        date="2020-04-24 15:37:42"
        showVerification
      />
    );
    await waitFor(() => {
      expect(container.querySelector('img')).toBeTruthy();
      expect(container.querySelector('.authorImgContainer')).toBeTruthy();
      expect(container.querySelectorAll('.authorImgContainer img')).toHaveLength(2);
    });
  });
  test('without verification badge', async () => {
    // eslint-disable-next-line global-require
    const func = require('../../../helpers/device-detect');
    func.isNativeImageLazyLoadingSupported = jest.fn(() => true);

    const { container } = render(
      <Author
        authorImg="1689948486/hampus-320x320.jpg.jpeg"
        name="mohsen"
        icon={<i className="twitter" />}
        prefix="with"
        date="2020-04-24 15:37:42"
      />
    );
    await waitFor(() => {
      expect(container.querySelectorAll('.authorImgContainer img')).toHaveLength(1);
    });
  });
});
afterEach(() => {
  cleanup();
});
