zarm/es/custom-input/__tests__/index.test.js

基于 React 的移动端UI库

import { fireEvent, render } from '@testing-library/react';
import React from 'react';
import CustomInput from '../index';
describe('CustomInput', function () {
  it('renders correctly', function () {
    var wrapper = render( /*#__PURE__*/React.createElement(CustomInput, {
      type: "number"
    }));
    expect(wrapper.asFragment()).toMatchSnapshot();
  });
  it('renders readonly', function () {
    var wrapper = render( /*#__PURE__*/React.createElement(CustomInput, {
      type: "number",
      readOnly: true
    }));
    expect(wrapper.asFragment()).toMatchSnapshot();
  });
  it('auto focus', function () {
    var _render = render( /*#__PURE__*/React.createElement(CustomInput, {
      autoFocus: true,
      className: "custom-input"
    })),
        container = _render.container;

    var input = container.getElementsByClassName('za-custom-input--focus');
    expect(input).toHaveLength(1);
  });
  it('show clear', function () {
    var onChange = jest.fn();

    var _render2 = render( /*#__PURE__*/React.createElement(CustomInput, {
      clearable: true,
      className: "custom-input",
      defaultValue: "test",
      onChange: onChange,
      autoFocus: true
    })),
        container = _render2.container;

    var clear = container.querySelector('.za-custom-input__clear');
    fireEvent.click(clear);
    var input = container.querySelectorAll('input[type="hidden"]')[0];
    expect(input.value).toEqual('');
  }); // it('focus', () => {
  //   const onFocus = jest.fn();
  //   const { container } = render(
  //     <CustomInput className="custom-input" value="test" onFocus={onFocus} />,
  //   );
  //   const input = container.querySelector('.za-custom-input');
  //   fireEvent.click(input!);
  //   expect(onFocus).toBeCalled();
  // });

  it('disabled focus', function () {
    var onFocus = jest.fn();
    render( /*#__PURE__*/React.createElement(CustomInput, {
      className: "custom-input",
      value: "test",
      onFocus: onFocus,
      disabled: true
    }));
    var input = document.body.querySelector('.za-custom-input');
    fireEvent.click(input);
    expect(onFocus).toBeCalledTimes(0);
  });
  it('onBlur', function () {
    var onBlur = jest.fn();
    render( /*#__PURE__*/React.createElement(CustomInput, {
      type: "number",
      className: "custom-input",
      onBlur: onBlur,
      autoFocus: true
    }));
    fireEvent.click(document.body);
    expect(onBlur).toBeCalledTimes(1);
  });
  it('onKeyClick', function () {
    var onBlur = jest.fn();
    var onChange = jest.fn();
    render( /*#__PURE__*/React.createElement(CustomInput, {
      type: "number",
      className: "custom-input",
      onBlur: onBlur,
      autoFocus: true,
      onChange: onChange
    }));
    var item = document.body.getElementsByClassName('za-keyboard__item');
    fireEvent.click(item[10]);
    expect(onBlur).toBeCalledTimes(1);
    fireEvent.click(item[1]);
    expect(onChange).toBeCalled();
  });
  it('maxLength', function () {
    var onChange = jest.fn();
    render( /*#__PURE__*/React.createElement(CustomInput, {
      type: "number",
      className: "custom-input",
      value: "1234",
      maxLength: 4,
      autoFocus: true,
      onChange: onChange
    }));
    var item = document.body.getElementsByClassName('za-keyboard__item');
    fireEvent.click(item[1]);
    expect(onChange).toBeCalledTimes(0);
  });
});
describe('CustomInput.Number', function () {
  it('inputNumber value 0', function () {
    render( /*#__PURE__*/React.createElement(CustomInput, {
      clearable: true,
      type: "number",
      value: 0
    }));
    var input = document.body.querySelectorAll('input[type="hidden"]')[0];
    expect(input.value).toEqual('0');
  });
});
describe('CustomInput.Price', function () {
  it('renders correctly', function () {
    var wrapper = render( /*#__PURE__*/React.createElement(CustomInput, {
      type: "price"
    }));
    expect(wrapper.asFragment()).toMatchSnapshot();
  });
});
describe('CustomInput.Idcard', function () {
  it('renders correctly', function () {
    var wrapper = render( /*#__PURE__*/React.createElement(CustomInput, {
      type: "idcard",
      maxLength: 18
    }));
    expect(wrapper.asFragment()).toMatchSnapshot();
  });
});