@zohodesk/components/es/Button/__tests__/Button.spec.js

In this Package, we Provide Some Basic Components to Build Web App

import React from 'react';
import Button from "../Button";
import { render } from "@testing-library/react";
describe('Button component', () => {
  test('Should be render with the basic set of default props', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Button, null));
    expect(asFragment()).toMatchSnapshot();
  });
  const palette = ['plainPrimary', 'plainSecondary', 'primary', 'primaryFilled', 'dangerFilled', 'secondary', 'secondaryFilled', 'successFilled', 'info', 'tertiaryFilled'];
  test.each(palette)('Should render palette of buttons - %s', palette => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Button, {
      palette: palette
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  const size = ['small', 'medium', 'large', 'xlarge'];
  test.each(size)('Should render Sizes of buttons - %s', size => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Button, {
      size: size
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  const status = ['loading', 'success', 'none'];
  test.each(status)('Should render Status of buttons - %s', status => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Button, {
      status: status
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  const customStatus = ['loading', 'success'];
  test.each(customStatus)('Should render CustomStatusclassname of buttons - %s', customStatus => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Button, {
      status: customStatus,
      customClass: {
        customStatus: "customStautusClassName"
      }
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('Should be render with the basic set of default props with disabled is true', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Button, {
      disabled: true
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('Should be render with the basic set of default props with isBold is false', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Button, {
      isBold: false
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('Should be render with the basic set of default props with rounded is true', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Button, {
      rounded: true
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('Should be render with the basic set of default props with needAppearance is false', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Button, {
      needAppearance: false
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('Should be render with the basic set customButtonclass with buttonClass ', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Button, {
      customClass: {
        customButton: "customButtonClass"
      }
    }));
    expect(asFragment()).toMatchSnapshot();
  });
  test('Should be render with the basic set customstatusSize props with buttonClass ', () => {
    const {
      asFragment
    } = render( /*#__PURE__*/React.createElement(Button, {
      customClass: {
        customStatusSize: "customButtonClass"
      }
    }));
    expect(asFragment()).toMatchSnapshot();
  }); // test('Should be render with the basic set customstyle ', () => {
  //     const { asFragment } = render(<Button customStyle={{bold: "buttonBold"}} />);
  //     expect(asFragment()).toMatchSnapshot();
  // });
  // test('Should be render with the customstyle with medium ', () => {
  //     const { asFragment } = render(<Button customStyle={{$medium: "buttonMedium"}} />);
  //     expect(asFragment()).toMatchSnapshot();
  // });
});