@zohodesk/dot/es/alert/AlertHeader/__tests__/AlertHeader.spec.js

In this Library, we Provide Some Basic Components to Build Your Application

import React from 'react';
import { render } from '@testing-library/react';
import AlertHeader from "../AlertHeader";
describe('AlertHeader', () => {
  const mockOnClose = jest.fn();
  const iconTypes = ['delete', 'alert', 'remoteAssist', 'splitTicket', 'update'];
  const palettes = ['default', 'primary', 'danger'];
  test('renders with default props', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(AlertHeader, null));
    expect(asFragment()).toMatchSnapshot();
  });
  test('renders with title', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(AlertHeader, {
      title: "Custom Icon Class"
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test.each(palettes)('renders with palette - %s', palette => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(AlertHeader, {
      palette: palette
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('renders with needIcon false', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(AlertHeader, {
      needIcon: false
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test.each(iconTypes)('renders with iconType - %s', iconType => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(AlertHeader, {
      iconType: iconType
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('renders with onClose function and closeTitle', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(AlertHeader, {
      title: "Closable Alert",
      onClose: mockOnClose,
      closeTitle: "Close Alert"
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('renders iconName is provided', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(AlertHeader, {
      iconName: "ZD-plus"
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('renders with breakChildren prop', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(AlertHeader, {
      breakChildren: true
    }, /*#__PURE__*/React.createElement("div", null, "Child Content with Break")));
    expect(asFragment()).toMatchSnapshot();
  });
  test('renders with children content', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(AlertHeader, null, /*#__PURE__*/React.createElement("div", null, "Child Content")));
    expect(asFragment()).toMatchSnapshot();
  });
  test('renders with custom iconClass', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(AlertHeader, {
      iconClass: "custom-icon-class"
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('renders with dataId prop', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(AlertHeader, {
      dataId: "alertDataId"
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('renders iconType and iconSize is fales', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(AlertHeader, {
      iconType: "alert"
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('renders iconType and iconSize is true', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(AlertHeader, {
      iconType: "alert",
      iconSize: "16"
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('renders falls back when neither iconName nor matching iconType is available', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(AlertHeader, {
      iconType: "nonexistentType"
    }));
    expect(asFragment()).toMatchSnapshot();
  });
});