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

基于 React 的移动端UI库

import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
import _regeneratorRuntime from "@babel/runtime/regenerator";
import { fireEvent, render, screen } from '@testing-library/react';
import React from 'react';
import Button from '../../button';
import Picker from '../index';
describe('Picker', function () {
  it('Picker render visible', function () {
    var _render = render( /*#__PURE__*/React.createElement(Picker, {
      dataSource: [{
        value: '1',
        label: '选项一'
      }, {
        value: '2',
        label: '选项二'
      }],
      visible: true
    })),
        container = _render.container;

    expect(container).toMatchSnapshot();
  });
  it('render custom label', function () {
    var datSource = [{
      code: '1',
      name: '北京市',
      children: [{
        code: '11',
        name: '海淀区'
      }, {
        code: '12',
        name: '西城区'
      }]
    }, {
      code: '2',
      name: '上海市',
      children: [{
        code: '21',
        name: '黄埔区'
      }, {
        code: '22',
        name: '虹口区'
      }]
    }];

    var _render2 = render( /*#__PURE__*/React.createElement(Picker, {
      dataSource: datSource,
      fieldNames: {
        label: 'name',
        value: 'code'
      },
      itemRender: function itemRender(data) {
        return data.name;
      }
    })),
        container = _render2.container;

    expect(container).toMatchSnapshot();
  });
  it('should trigger onConfirm when press ok button', function () {
    jest.useFakeTimers();
    var onConfirmFn = jest.fn();
    render( /*#__PURE__*/React.createElement(Picker, {
      dataSource: [{
        value: '1',
        label: '选项一',
        children: [{
          value: '11',
          label: '选项一'
        }, {
          value: '12',
          label: '选项二'
        }]
      }, {
        value: '2',
        label: '选项一',
        children: [{
          value: '21',
          label: '选项一'
        }, {
          value: '22',
          label: '选项二'
        }]
      }],
      visible: true,
      value: ['1', '12'],
      onConfirm: onConfirmFn
    }));
    var confirm = document.body.getElementsByClassName('za-picker__confirm')[0];
    fireEvent.click(confirm);
    jest.runAllTimers();
    expect(onConfirmFn).toBeCalled();
  });
  it('should trigger onCancel when press cancel button', function () {
    var onCancelFn = jest.fn();
    render( /*#__PURE__*/React.createElement(Picker, {
      dataSource: [{
        value: '1',
        label: '选项一',
        children: [{
          value: '11',
          label: '选项一'
        }, {
          value: '12',
          label: '选项二'
        }]
      }, {
        value: '2',
        label: '选项一',
        children: [{
          value: '21',
          label: '选项一'
        }, {
          value: '22',
          label: '选项二'
        }]
      }],
      visible: true,
      defaultValue: ['1', '12'],
      onCancel: onCancelFn
    }));
    var cancel = document.body.getElementsByClassName('za-picker__cancel')[0];
    fireEvent.click(cancel);
    expect(onCancelFn).toBeCalled();
  });
  test('imperative call onConfirm', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
    var onConfirm, onClick, button, confirm;
    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
      while (1) {
        switch (_context2.prev = _context2.next) {
          case 0:
            onConfirm = jest.fn();

            onClick = /*#__PURE__*/function () {
              var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
                return _regeneratorRuntime.wrap(function _callee$(_context) {
                  while (1) {
                    switch (_context.prev = _context.next) {
                      case 0:
                        _context.next = 2;
                        return Picker.prompt({
                          onConfirm: onConfirm,
                          dataSource: [{
                            value: '1',
                            label: '选项一'
                          }, {
                            value: '2',
                            label: '选项二'
                          }]
                        });

                      case 2:
                      case "end":
                        return _context.stop();
                    }
                  }
                }, _callee);
              }));

              return function onClick() {
                return _ref2.apply(this, arguments);
              };
            }();

            render( /*#__PURE__*/React.createElement(Button, {
              onClick: onClick
            }, "picker-prompt"));
            button = screen.getByText('picker-prompt');
            fireEvent.click(button);
            _context2.next = 7;
            return screen.findByText('确定');

          case 7:
            confirm = _context2.sent;
            fireEvent.click(confirm);
            expect(onConfirm).toBeCalled();

          case 10:
          case "end":
            return _context2.stop();
        }
      }
    }, _callee2);
  })));
  test('imperative call onCancel', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
    var onCancel, onClick, button, cancel;
    return _regeneratorRuntime.wrap(function _callee4$(_context4) {
      while (1) {
        switch (_context4.prev = _context4.next) {
          case 0:
            onCancel = jest.fn();

            onClick = /*#__PURE__*/function () {
              var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
                return _regeneratorRuntime.wrap(function _callee3$(_context3) {
                  while (1) {
                    switch (_context3.prev = _context3.next) {
                      case 0:
                        _context3.next = 2;
                        return Picker.prompt({
                          onCancel: onCancel,
                          cancelText: 'cancel',
                          dataSource: [{
                            value: '1',
                            label: '选项一'
                          }, {
                            value: '2',
                            label: '选项二'
                          }]
                        });

                      case 2:
                      case "end":
                        return _context3.stop();
                    }
                  }
                }, _callee3);
              }));

              return function onClick() {
                return _ref4.apply(this, arguments);
              };
            }();

            render( /*#__PURE__*/React.createElement(Button, {
              onClick: onClick
            }, "picker-prompt"));
            button = screen.getByText('picker-prompt');
            fireEvent.click(button);
            _context4.next = 7;
            return screen.findByText('cancel');

          case 7:
            cancel = _context4.sent;
            fireEvent.click(cancel);
            expect(onCancel).toBeCalled();

          case 10:
          case "end":
            return _context4.stop();
        }
      }
    }, _callee4);
  })));
});