zarm
Version:
基于 React 的移动端UI库
239 lines (196 loc) • 8.18 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = _interopRequireWildcard(require("react"));
require("@testing-library/jest-dom");
var _react2 = require("@testing-library/react");
var _index = _interopRequireDefault(require("../index"));
var _list = _interopRequireDefault(require("../../list"));
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) { if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } } return n.default = e, t && t.set(e, n), n; }
var REFRESH_STATE = {
normal: 0,
// 普通
pull: 1,
// 下拉刷新（未满足刷新条件）
drop: 2,
// 释放立即刷新（满足刷新条件）
loading: 3,
// 加载中
success: 4,
// 加载成功
failure: 5 // 加载失败
};
var LOAD_STATE = {
normal: 0,
// 普通
abort: 1,
// 中止
loading: 2,
// 加载中
success: 3,
// 加载成功
failure: 4,
// 加载失败
complete: 5 // 加载完成（无新数据）
};
var getRandomNum = function getRandomNum(min, max) {
var Range = max - min;
var Rand = Math.random();
return min + Math.round(Rand * Range);
};
var fetchData = function fetchData(length, dataSource) {
var newData = dataSource;
var startIndex = newData.length;
for (var i = startIndex; i < startIndex + length; i++) {
newData.push( /*#__PURE__*/_react.default.createElement(_list.default.Item, {
key: +i,
title: "\u7B2C ".concat(i + 1, " \u884C")
}));
}
return newData;
};
describe('Pull', function () {
var App = function App() {
var _React$useState = _react.default.useState([]),
_React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
dataSource = _React$useState2[0],
setDataSource = _React$useState2[1];
var _React$useState3 = _react.default.useState(REFRESH_STATE.normal),
_React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
refreshing = _React$useState4[0],
setRefreshing = _React$useState4[1];
var _React$useState5 = _react.default.useState(LOAD_STATE.normal),
_React$useState6 = (0, _slicedToArray2.default)(_React$useState5, 2),
loading = _React$useState6[0],
setLoading = _React$useState6[1];
var count = (0, _react.useRef)(0);
var refreshData = function refreshData() {
setRefreshing(REFRESH_STATE.loading);
setTimeout(function () {
if (count.current > 0) {
setRefreshing(REFRESH_STATE.failure);
return;
}
setDataSource(fetchData(20, []));
setRefreshing(REFRESH_STATE.success);
count.current += 1;
}, 2000); // setDataSource(fetchData(20, []));
// setRefreshing(REFRESH_STATE.success);
}; // 模拟加载更多数据
var loadData = function loadData() {
setLoading(LOAD_STATE.loading);
setTimeout(function () {
setDataSource(fetchData(20, []));
setLoading(LOAD_STATE.complete);
}, 2000);
};
_react.default.useEffect(function () {
setDataSource(fetchData(20, []));
}, []);
return /*#__PURE__*/_react.default.createElement(_index.default, {
refresh: {
state: refreshing,
handler: refreshData
},
load: {
state: loading,
distance: 200,
handler: loadData
}
}, /*#__PURE__*/_react.default.createElement(_list.default, null, dataSource));
};
it('renders correctly', function () {
var _render = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_index.default, null, /*#__PURE__*/_react.default.createElement("div", null, "1"), /*#__PURE__*/_react.default.createElement("div", null, "2"), /*#__PURE__*/_react.default.createElement("div", null, "3"))),
container = _render.container;
expect(container).toMatchSnapshot();
});
it('refreshing', /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
var _render2, container, getByText, pull;
return _regenerator.default.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
jest.useFakeTimers();
_render2 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(App, null)), container = _render2.container, getByText = _render2.getByText;
pull = container.querySelector('.za-pull');
_react2.fireEvent.mouseDown(pull, {
pointerId: 15,
clientX: 100,
clientY: 0,
buttons: 1
});
_react2.fireEvent.mouseMove(pull, {
pointerId: 15,
clientX: 100,
clientY: 100,
buttons: 1
});
_react2.fireEvent.mouseMove(pull, {
pointerId: 15,
clientX: 150,
clientY: 300,
buttons: 1
});
_react2.fireEvent.mouseUp(pull, {
pointerId: 15
});
(0, _react2.act)(function () {
jest.runAllTimers();
});
_context.next = 10;
return (0, _react2.waitFor)(function () {
expect(getByText('加载成功')).toBeInTheDocument();
});
case 10:
case "end":
return _context.stop();
}
}
}, _callee);
})));
it('loading', /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
var scrollToSpy, clientHeightSpy, scrollHeightSpy, _render3, getByText;
return _regenerator.default.wrap(function _callee2$(_context2) {
while (1) {
switch (_context2.prev = _context2.next) {
case 0:
jest.useFakeTimers();
scrollToSpy = jest.spyOn(window, 'scrollTo').mockImplementation(function (_, y) {
window.scrollY = y;
window.pageYOffset = y;
document.documentElement.scrollTop = y;
});
clientHeightSpy = jest.spyOn(document.documentElement, 'clientHeight', 'get').mockImplementation(function () {
return 100;
});
scrollHeightSpy = jest.spyOn(document.body, 'clientHeight', 'get').mockImplementation(function () {
return 1000;
});
_render3 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(App, null)), getByText = _render3.getByText;
window.scrollTo(0, 800);
_react2.fireEvent.scroll(window, {
scrollY: -100
});
(0, _react2.act)(function () {
jest.runOnlyPendingTimers();
});
_context2.next = 10;
return (0, _react2.waitFor)(function () {
expect(getByText('我是有底线的')).toBeInTheDocument();
});
case 10:
scrollToSpy.mockRestore();
scrollHeightSpy.mockRestore();
clientHeightSpy.mockRestore();
case 13:
case "end":
return _context2.stop();
}
}
}, _callee2);
})));
});