zarm
Version:
基于 React 的移动端UI库
272 lines (231 loc) • 9.81 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _react = require("@testing-library/react");
var _react2 = _interopRequireDefault(require("react"));
var _date = require("../../../tests/testData/date");
var _configProvider = _interopRequireDefault(require("../../config-provider"));
var _en_US = _interopRequireDefault(require("../../config-provider/locale/en_US"));
var _index = _interopRequireDefault(require("../index"));
var originalOffsetTop = Object.getOwnPropertyDescriptor(HTMLElement.prototype, 'offsetTop');
describe('Calendar', function () {
it('render horizontal', /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
var onChangeFn, _render, container;
return _regenerator.default.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
onChangeFn = jest.fn();
_render = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_index.default, {
min: _date.date7,
mode: "single",
onChange: onChangeFn,
direction: "horizontal",
header: true
})), container = _render.container;
expect(container).toMatchSnapshot();
case 3:
case "end":
return _context.stop();
}
}
}, _callee);
})));
it('render local EN', /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
var onChangeFn, _render2, container;
return _regenerator.default.wrap(function _callee2$(_context2) {
while (1) {
switch (_context2.prev = _context2.next) {
case 0:
onChangeFn = jest.fn();
_render2 = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_configProvider.default, {
locale: _en_US.default
}, /*#__PURE__*/_react2.default.createElement(_index.default, {
min: _date.date7,
mode: "single",
onChange: onChangeFn
}))), container = _render2.container;
expect(container).toMatchSnapshot();
case 3:
case "end":
return _context2.stop();
}
}
}, _callee2);
}))); // const originalWarn = console.warn;
// // @ts-ignore
// // eslint-disable-next-line no-return-assign
// afterEach(() => (console.warn = originalWarn));
// const consoleOutput: any = [];
// const mockedWarn = (output) => {
// consoleOutput.push(output);
// };
// // eslint-disable-next-line no-return-assign
// beforeEach(() => (console.warn = mockedWarn));
// it('coustom render days warning', async () => {
// const onChangeFn = jest.fn();
// render(
// <Calendar
// min={date7}
// mode="single"
// onChange={onChangeFn}
// dateRender={(date: Date) => {
// if (/(0|6)/.test(date.getDay().toString())) {
// return {};
// }
// return date.getDate();
// }}
// />,
// );
// await waitFor(() => {
// expect(consoleOutput.length).toBeGreaterThan(1);
// });
// });
// it('render horizontal trigger onChange when picker view', async () => {
// const onChangeFn = jest.fn();
// const { container } = render(<Calendar
// mode="single"
// onChange={onChangeFn}
// direction="horizontal"
// header
// defaultValue={new Date('2022-12-01')}
// />);
// const title = container.getElementsByClassName('za-calendar__title')[0];
// fireEvent.click(title);
// const pickerView = container.getElementsByClassName('za-picker-view');
// expect(pickerView.length).toEqual(1);
// const wheelEl = container.getElementsByClassName('za-wheel')[0];
// // fireEvent.mouseDown(wheelEl, { pointerId: 1, clientY: 0, buttons: 1 });
// // fireEvent.mouseMove(wheelEl, { pointerId: 1, clientY: 400, buttons: 1 });
// // fireEvent.mouseUp(wheelEl, { pointerId: 1, clientY: 600});
// await waitFor(() => {
// console.log( container.getElementsByClassName('za-wheel')[1])
// const newTitle = container.getElementsByClassName('za-calendar__title')[0];
// expect(newTitle.textContent).toEqual('2023年1月');
// });
// });
it('render horizontal trigger onChange when action btn click', /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3() {
var onChangeFn, _render3, container, btn, title, newTitle;
return _regenerator.default.wrap(function _callee3$(_context3) {
while (1) {
switch (_context3.prev = _context3.next) {
case 0:
onChangeFn = jest.fn();
_render3 = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_index.default, {
mode: "single",
onChange: onChangeFn,
direction: "horizontal",
header: true,
min: new Date('2022-11-01'),
defaultValue: new Date('2022-12-01')
})), container = _render3.container;
btn = container.getElementsByClassName('za-calendar__action-btn');
_react.fireEvent.click(btn[0]);
title = container.getElementsByClassName('za-calendar__title')[0];
expect(title.textContent).toEqual('2022年11月');
_react.fireEvent.click(btn[1]);
_react.fireEvent.click(btn[1]);
newTitle = container.getElementsByClassName('za-calendar__title')[0];
expect(newTitle.textContent).toEqual('2023年1月');
case 10:
case "end":
return _context3.stop();
}
}
}, _callee3);
})));
it('should trigger onChange when single click', /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4() {
var onChangeFn, _render4, container, day2;
return _regenerator.default.wrap(function _callee4$(_context4) {
while (1) {
switch (_context4.prev = _context4.next) {
case 0:
onChangeFn = jest.fn();
_render4 = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_index.default, {
min: _date.date7,
mode: "single",
onChange: onChangeFn
})), container = _render4.container;
day2 = [].slice.call(container.getElementsByClassName('za-calendar__day'))[15];
expect((0, _react.getByText)(day2, '16')).toBeTruthy();
_react.fireEvent.click(day2);
expect(onChangeFn).toBeCalled();
case 6:
case "end":
return _context4.stop();
}
}
}, _callee4);
})));
it('should trigger onChange when double click', function () {
var onChangeFn = jest.fn();
var _render5 = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_index.default, {
mode: "range",
min: new Date('2022-01-01'),
max: new Date('2022-01-28'),
onChange: onChangeFn
})),
container = _render5.container;
var days = [].slice.call(container.getElementsByClassName('za-calendar__day'));
_react.fireEvent.click(days[27]);
_react.fireEvent.click(days[16]);
expect(onChangeFn).toBeCalled();
});
it('should trigger onChange when multiple click', function () {
var onChangeFn = jest.fn();
var _render6 = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_index.default, {
mode: "multiple",
min: new Date('2022-01-01'),
max: new Date('2022-01-28'),
value: [new Date('2022-01-02')],
onChange: onChangeFn
})),
container = _render6.container;
var days = [].slice.call(container.getElementsByClassName('za-calendar__day'));
_react.fireEvent.click(days[2]);
_react.fireEvent.click(days[16]);
_react.fireEvent.click(days[16]);
expect(onChangeFn).toBeCalledTimes(3);
});
beforeEach(function () {
Object.defineProperty(HTMLElement.prototype, 'offsetTop', {
configurable: true,
value: 500
});
});
afterAll(function () {
Object.defineProperty(HTMLElement.prototype, 'offsetTop', originalOffsetTop);
});
it('body scroll', /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee5() {
var onChangeFn, _render7, container, body;
return _regenerator.default.wrap(function _callee5$(_context5) {
while (1) {
switch (_context5.prev = _context5.next) {
case 0:
onChangeFn = jest.fn();
_render7 = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_index.default, {
mode: "multiple",
min: new Date('2022-01-01'),
max: new Date('2022-10-28'),
onChange: onChangeFn
})), container = _render7.container;
body = container.getElementsByClassName('za-calendar__body');
_react.fireEvent.scroll(body[0], {
target: {
scrollTop: 200
}
});
_context5.next = 6;
return (0, _react.waitFor)(function () {
var newTitle = container.getElementsByClassName('za-calendar__scroll-month')[0];
expect(newTitle.textContent).toEqual('2022年1月');
});
case 6:
case "end":
return _context5.stop();
}
}
}, _callee5);
})));
});