@zohodesk/dot/es/list/Subject/__tests__/Subject.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 '@testing-library/jest-dom';
import Subject from "../Subject";
describe('Subject', () => {
  test('rendering the defult props', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Subject, null));
    expect(asFragment()).toMatchSnapshot();
  });
  const whiteSpace = ['normal', 'nowrap', 'pre', 'pre-line', 'pre-wrap', 'break-spaces'];
  test.each(whiteSpace)('rendering the whiteSpace of -%s', whiteSpace => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Subject, {
      whiteSpace: whiteSpace
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test.each(whiteSpace)('rendering the whiteSpace of -%s', whiteSpace => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Subject, {
      whiteSpace: whiteSpace,
      isLink: true
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('renders data attributes on link wrapper', () => {
    const dataId = 'subject-id';
    const {
      container
    } = render( /*#__PURE__*/React.createElement(Subject, {
      isLink: true,
      dataId: dataId
    }));
    expect(container).toMatchSnapshot();
    const anchor = container.querySelector('a');
    expect(anchor.getAttribute('data-id')).toBe(dataId);
    expect(anchor.getAttribute('data-test-id')).toBe(dataId);
  });
  test('renders text content', () => {
    const text = 'Test Subject';
    const {
      container
    } = render( /*#__PURE__*/React.createElement(Subject, {
      text: text
    }));
    expect(container.textContent).toContain(text);
  });
  test('renders with custom className', () => {
    const customClass = 'custom-subject';
    const {
      container
    } = render( /*#__PURE__*/React.createElement(Subject, {
      className: customClass
    }));
    expect(container.querySelector(`.${customClass}`)).not.toBeNull();
  });
  test('renders dotted text when isDotted is true', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Subject, {
      text: "Test",
      isDotted: true
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('renders children when provided', () => {
    const {
      container
    } = render( /*#__PURE__*/React.createElement(Subject, {
      isLink: true
    }, /*#__PURE__*/React.createElement("span", null, "Custom Child")));
    expect(container.querySelector('span').textContent).toBe('Custom Child');
  });
  test('applies fontWeight prop', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Subject, {
      text: "Test",
      fontWeight: "bold"
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('renders with href when isLink is true', () => {
    const href = 'https://example.com';
    const {
      container
    } = render( /*#__PURE__*/React.createElement(Subject, {
      isLink: true,
      href: href
    }));
    expect(container.querySelector('a').getAttribute('href')).toBe(href);
  });
  test('calls onClick when link is clicked', () => {
    const handleClick = jest.fn();
    const {
      container
    } = render( /*#__PURE__*/React.createElement(Subject, {
      isLink: true,
      onClick: handleClick
    }));
    container.querySelector('a').click();
    expect(handleClick).toHaveBeenCalled();
  });
  test('renders as non-link when isLink is false', () => {
    const {
      container
    } = render( /*#__PURE__*/React.createElement(Subject, {
      text: "Test",
      isLink: false
    }));
    expect(container.querySelector('a')).toBeNull();
  });
  test('applies custom className to non-link element', () => {
    const customClass = 'test-class';
    const {
      container
    } = render( /*#__PURE__*/React.createElement(Subject, {
      text: "Test",
      className: customClass,
      isLink: false
    }));
    expect(container.querySelector(`.${customClass}`)).not.toBeNull();
  });
  test('renders with target prop on link', () => {
    const {
      container
    } = render( /*#__PURE__*/React.createElement(Subject, {
      isLink: true,
      target: "_blank"
    }));
    expect(container.querySelector('a').getAttribute('target')).toBe('_blank');
  });
});