zarm/es/radio/__tests__/index.test.js

基于 React 的移动端UI库

import React from 'react';
import { fireEvent, render } from '@testing-library/react';
import Radio from '../index';
var classPrefix = 'za-radio';
describe('Radio', function () {
  it('renders correctly', function () {
    var wrapper = render( /*#__PURE__*/React.createElement(Radio, {
      checked: true,
      onChange: jest.fn()
    }, "foo"));
    expect(wrapper.asFragment()).toMatchSnapshot();
  });
  it('defaultChecked', function () {
    var wrapper = render( /*#__PURE__*/React.createElement(Radio, {
      defaultChecked: true
    }, "foo"));
    expect(wrapper.asFragment()).toMatchSnapshot();
  });
  it('disabled', function () {
    var wrapper = render( /*#__PURE__*/React.createElement(Radio, {
      disabled: true
    }, "foo"));
    expect(wrapper.asFragment()).toMatchSnapshot();
  });
  it('click event', function () {
    var _render = render( /*#__PURE__*/React.createElement(Radio, null, "foo")),
        container = _render.container;

    var input = container.querySelectorAll('input')[0];
    var radio = container.getElementsByTagName('label')[0];
    expect(input).not.toBeChecked();
    expect(radio).toHaveClass("".concat(classPrefix));
    fireEvent.click(radio);
    expect(input).toBeChecked();
    expect(radio).toHaveClass("".concat(classPrefix, "--checked"));
    fireEvent.click(radio);
    expect(input).toBeChecked();
    expect(radio).toHaveClass("".concat(classPrefix, "--checked"));
  });
  it('static method', function () {
    var _ref$current;

    var ref = /*#__PURE__*/React.createRef();
    var checked = false;
    var onChange = jest.fn(function (e) {
      checked = e.target.checked;
    });

    var _render2 = render( /*#__PURE__*/React.createElement(Radio, {
      ref: ref,
      onChange: onChange
    }, "foo")),
        container = _render2.container;

    var input = container.querySelectorAll('input')[0];
    (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.check();
    expect(input).toBeChecked();
    expect(onChange).toHaveBeenCalled();
    expect(checked).toEqual(true);
  });
});
describe('Radio.Group', function () {
  it('renders correctly', function () {
    var wrapper = render( /*#__PURE__*/React.createElement(Radio.Group, null, /*#__PURE__*/React.createElement(Radio, {
      value: "0"
    }, "\u9009\u9879\u4E00"), /*#__PURE__*/React.createElement(Radio, {
      value: "1"
    }, "\u9009\u9879\u4E8C"), /*#__PURE__*/React.createElement(Radio, {
      value: "2"
    }, "\u9009\u9879\u4E09")));
    expect(wrapper.asFragment()).toMatchSnapshot();
  });
  it('render value correctly', function () {
    var wrapper = render( /*#__PURE__*/React.createElement(Radio.Group, {
      value: "0"
    }, /*#__PURE__*/React.createElement(Radio, {
      value: "0"
    }, "\u9009\u9879\u4E00"), /*#__PURE__*/React.createElement(Radio, {
      value: "1"
    }, "\u9009\u9879\u4E8C"), /*#__PURE__*/React.createElement(Radio, {
      value: "2"
    }, "\u9009\u9879\u4E09")));
    expect(wrapper.asFragment()).toMatchSnapshot();
  });
  it('render defaultValue correctly', function () {
    var wrapper = render( /*#__PURE__*/React.createElement(Radio.Group, {
      defaultValue: "1"
    }, /*#__PURE__*/React.createElement(Radio, {
      value: "0"
    }, "\u9009\u9879\u4E00"), /*#__PURE__*/React.createElement(Radio, {
      value: "1"
    }, "\u9009\u9879\u4E8C"), /*#__PURE__*/React.createElement(Radio, {
      value: "2"
    }, "\u9009\u9879\u4E09")));
    expect(wrapper.asFragment()).toMatchSnapshot();
  });
  it('type is button', function () {
    var wrapper = render( /*#__PURE__*/React.createElement(Radio.Group, {
      type: "button"
    }, /*#__PURE__*/React.createElement(Radio, {
      value: "0"
    }, "\u9009\u9879\u4E00"), /*#__PURE__*/React.createElement(Radio, {
      value: "1"
    }, "\u9009\u9879\u4E8C"), /*#__PURE__*/React.createElement(Radio, {
      value: "2"
    }, "\u9009\u9879\u4E09")));
    expect(wrapper.asFragment()).toMatchSnapshot();
    var container = wrapper.container;
    var radio = container.getElementsByTagName('label')[0];
    fireEvent.click(radio);
    expect(radio).toHaveClass("".concat(classPrefix, "--checked"));
  });
  it('type is list', function () {
    var wrapper = render( /*#__PURE__*/React.createElement(Radio.Group, {
      type: "list"
    }, /*#__PURE__*/React.createElement(Radio, {
      value: "0"
    }, "\u9009\u9879\u4E00"), /*#__PURE__*/React.createElement(Radio, {
      value: "1"
    }, "\u9009\u9879\u4E8C"), /*#__PURE__*/React.createElement(Radio, {
      value: "2"
    }, "\u9009\u9879\u4E09")));
    expect(wrapper.asFragment()).toMatchSnapshot();
  });
  it('receive new value', function () {
    var _render3 = render( /*#__PURE__*/React.createElement(Radio.Group, {
      defaultValue: "0"
    }, /*#__PURE__*/React.createElement(Radio, {
      value: "0"
    }, "\u9009\u9879\u4E00"), /*#__PURE__*/React.createElement(Radio, {
      value: "1"
    }, "\u9009\u9879\u4E8C"), /*#__PURE__*/React.createElement(Radio, {
      value: "2"
    }, "\u9009\u9879\u4E09"))),
        container = _render3.container;

    var items = Array.from(container.querySelectorAll('input'));
    expect(items[0].checked).toEqual(true);
  });
  it('onChange', function () {
    var onChange = jest.fn();

    var _render4 = render( /*#__PURE__*/React.createElement(Radio.Group, {
      type: "list",
      onChange: onChange
    }, /*#__PURE__*/React.createElement(Radio, {
      value: "0"
    }, "\u9009\u9879\u4E00"), /*#__PURE__*/React.createElement(Radio, {
      value: "1"
    }, "\u9009\u9879\u4E8C"), /*#__PURE__*/React.createElement(Radio, {
      value: "2",
      disabled: true
    }, "\u9009\u9879\u4E09"))),
        container = _render4.container;

    var items = container.querySelectorAll('.za-radio');
    fireEvent.click(items[0]);
    expect(onChange).toBeCalledWith('0');
    fireEvent.click(items[0]);
    expect(onChange).toBeCalledWith('0'); // 测试disabled

    fireEvent.click(items[2]);
    expect(onChange).toBeCalledWith('0');
  });
});