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

import getPageData from 'gatsby-core-theme/tests/factories/pages/default.factory';
import GameIframe from '.';

describe('Game Iframe component', () => {
  test('render iframe', async () => {
    const { container } = render(
      <>
        <GameIframe page={getPageData()} />
      </>
    );

    expect(container).toBeTruthy();
    expect(container.querySelector('iframe')).toBeFalsy();

    const iframeLoadButton = container.querySelector('a');
    fireEvent.click(iframeLoadButton);

    await waitFor(() => {
      expect(container.querySelector('iframe')).toBeTruthy();
    });
  });
  test('render iframe with a link', async () => {
    const { container } = render(
      <>
        <button type="button" className="playfree">
          test play button
        </button>
        <GameIframe page={getPageData()} />
      </>
    );

    expect(container).toBeTruthy();
    expect(container.querySelector('iframe')).toBeFalsy();

    const iframeLoadButton = container.querySelector('.playfree');
    fireEvent.click(iframeLoadButton);

    await waitFor(() => {
      expect(container.querySelector('iframe')).toBeTruthy();
    });
  });
});
afterEach(() => {
  cleanup();
});
