import React from 'react';
import { render, screen, waitFor } from '@testing-library/react';

import { ConditionalWrapper } from './ConditionalWrapper';

describe('ConditionalWrapper', () => {
  it('Should wrap when true', async () => {
    render(
      <ConditionalWrapper condition wrapper={(children) => <a href="/">{children}</a>}>
        <img src="image.png" alt="" />
      </ConditionalWrapper>,
    );

    await waitFor(() => {
      expect(screen.queryAllByRole('link')).toHaveLength(1);
      expect(screen.queryAllByRole('img')).toHaveLength(1);
    });
  });

  it('Should not wrap when false', async () => {
    render(
      <ConditionalWrapper condition={false} wrapper={(children) => <a href="/">{children}</a>}>
        <img src="image.png" alt="" />
      </ConditionalWrapper>,
    );

    await waitFor(() => {
      expect(screen.queryAllByRole('link')).toHaveLength(0);
      expect(screen.queryAllByRole('img')).toHaveLength(1);
    });
  });
});