import React from 'react';
import transformNode from './replaceMedia';

// Mock the loadable component to return a dummy component
jest.mock('@loadable/component', () => ({
  __esModule: true,
  default: jest.fn(),
}));

// Mock the actual implementation of loadable to handle dynamic imports
jest.mock('@loadable/component', () => ({
  __esModule: true,
  ...jest.requireActual('@loadable/component'),
  default: jest.fn().mockImplementation(() => {
    const DummyComponent = ({ ...props }) => <div {...props}>Iframe</div>;
    return DummyComponent;
  }),
}));

describe('replaceMedia function', () => {
  it('iframe', async () => {
    const node = { name: 'iframe', attribs: { src: 'https://iframe.com' } };
    const transformedNode = await transformNode(node, {}, {});
    expect(transformedNode.type.name).toBe('DummyComponent');
  });

  it('img', () => {
    const node = {
      name: 'img',
      attribs: {
        src: 'https://cdn.images.com/image.jpg',
        class: 'content-image--align-center',
        width: '300px',
        height: '200px',
        alt: 'Alt text',
      },
    };
    const transformedNode = transformNode(node, {}, {});
    expect(transformedNode.type.name).toBe('LazyImage');
    expect(transformedNode.props.src).toBe('https://cdn.images.com/image.jpg');
    expect(transformedNode.props.width).toBe('300');
    expect(transformedNode.props.height).toBe('200');
    expect(transformedNode.props.alt).toBe('Alt text');
    expect(transformedNode.props.className).toBe('alignCenter');
  });

  it('transforms p node with img child correctly', () => {
    const node = {
      name: 'p',
      children: [{ name: 'img', attribs: { src: 'https://cdn.images.com/image.jpg' } }],
    };
    const transformedNode = transformNode(node, {}, {});
    expect(transformedNode.attribs.style).toBe('');
  });

  it('h1 tag', () => {
    const node = { name: 'h1', children: [{ data: 'Title' }] };
    const page = { siteInfo: { site_name: 'Site' }, title: 'Page', relation: { name: 'Author' } };
    const translations = {};
    transformNode(node, page, translations);

    expect(node.children[0].data).toBe('Title');
  });
});
