src/app/components/Embeds/EmbedImages/index.test.tsx

Summary

Maintainability
A
0 mins
Test Coverage
import React from 'react';
import { render, screen } from '../../react-testing-library-with-providers';
import { chartEmbedImages, createEmbedImagesFixture } from './fixtures';
import EmbedImages from '.';

describe('EmbedImages', () => {
  beforeEach(() => {
    process.env.SIMORGH_INCLUDES_BASE_URL =
      'https://www.test.bbc.com/ws/includes';
    process.env.SIMORGH_ICHEF_BASE_URL = 'https://ichef.bbci.co.uk';
  });
  it('should not render when empty embedImages array is passed in', async () => {
    const { container } = render(<EmbedImages blocks={[]} />);

    expect(container).toBeEmptyDOMElement();
  });

  it.each`
    imageAttribute | fixture
    ${'locator'}   | ${createEmbedImagesFixture({ locator: null })}
    ${'alt'}       | ${createEmbedImagesFixture({ alt: null })}
    ${'width'}     | ${createEmbedImagesFixture({ width: null })}
    ${'height'}    | ${createEmbedImagesFixture({ height: null })}
  `(
    'should not render when $imageAttribute is missing from data',
    ({ fixture }) => {
      const { container } = render(<EmbedImages blocks={fixture.blocks} />);

      expect(container).toBeEmptyDOMElement();
    },
  );
  describe('Canonical', () => {
    it('should render a 1632px width image', async () => {
      render(<EmbedImages blocks={chartEmbedImages.blocks} />);

      const chartEmbedImage = screen.queryByRole('img');
      expect(chartEmbedImage).toHaveAttribute('width', '1632');
    });

    it('should construct the correct URL', async () => {
      render(<EmbedImages blocks={chartEmbedImages.blocks} />);

      const chartEmbedImage = screen.queryByRole('img');
      expect(chartEmbedImage).toHaveAttribute(
        'src',
        'https://ichef.bbci.co.uk/news/1632/idt2-test/idt2/793f648b-b17f-489a-a473-9e5a71f12684/image/816',
      );
    });
  });
  describe('AMP', () => {
    it('should render a 1280px width amp-image', async () => {
      const { container } = render(
        <EmbedImages blocks={chartEmbedImages.blocks} />,
        {
          isAmp: true,
        },
      );

      const chartEmbedImage = container.getElementsByTagName('amp-img')[0];
      expect(chartEmbedImage).toHaveAttribute('width', '1280');
    });

    it('should construct the correct URL', async () => {
      const { container } = render(
        <EmbedImages blocks={chartEmbedImages.blocks} />,
        {
          isAmp: true,
        },
      );

      const chartEmbedImage = container.getElementsByTagName('amp-img')[0];
      expect(chartEmbedImage).toHaveAttribute(
        'src',
        'https://ichef.bbci.co.uk/news/1280/idt2-test/idt2/793f648b-b17f-489a-a473-9e5a71f12684/image/640',
      );
    });
  });
});