"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));

var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));

require("@testing-library/jest-dom");

var _react = require("@testing-library/react");

var _react2 = _interopRequireDefault(require("react"));

var _testUtils = require("react-dom/test-utils");

var _ = _interopRequireDefault(require(".."));

var _images = require("../../../tests/testData/images");

var _utils = require("../../../tests/utils");

var _button = _interopRequireDefault(require("../../button"));

var originalOffsetWidth = Object.getOwnPropertyDescriptor(HTMLElement.prototype, 'offsetWidth');
var originalOffsetHeight = Object.getOwnPropertyDescriptor(HTMLElement.prototype, 'offsetHeight');
describe('ImagePreview', function () {
  var onloadRef;
  beforeAll(function () {
    Object.defineProperty(Image.prototype, 'onload', {
      get: function get() {
        return this._onload;
      },
      set: function set(onload) {
        onloadRef = onload;
        this._onload = onload;
      }
    });
  });
  afterEach(function () {
    jest.restoreAllMocks();
    jest.useRealTimers();
  });
  describe('snapshot', function () {
    it('renders correctly', function () {
      var wrapper = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_.default, {
        visible: true,
        onChange: jest.fn(),
        images: _images.images,
        mountContainer: false
      }));
      expect(wrapper.asFragment()).toMatchSnapshot();
    });
    it('renders correctly with origin', function () {
      var wrapper = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_.default, {
        visible: true,
        onChange: jest.fn(),
        images: _images.originImages,
        mountContainer: false
      }));
      expect(wrapper.asFragment()).toMatchSnapshot();
    });
  });
  it('should render show origin url button if origin url is not existed', function () {
    var _render = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_.default, {
      images: _images.images,
      visible: true
    })),
        container = _render.container;

    var buttonWrapper = container.querySelectorAll('.za-image-preview button');
    expect(buttonWrapper).toHaveLength(0);
  });
  it('should not call onClose handler when touch end and the duration between touchstart and touchend greater than 300ms', /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
    var mOnClose, contentWrapper;
    return _regenerator.default.wrap(function _callee$(_context) {
      while (1) {
        switch (_context.prev = _context.next) {
          case 0:
            mOnClose = jest.fn();
            (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_.default, {
              visible: true,
              images: _images.images,
              onClose: mOnClose
            }));
            contentWrapper = document.body.getElementsByClassName('za-image-preview__content')[0];

            _react.fireEvent.mouseDown(contentWrapper);

            _react.fireEvent.mouseMove(contentWrapper);

            _context.next = 7;
            return (0, _utils.sleep)(500);

          case 7:
            _react.fireEvent.mouseUp(contentWrapper);

            expect(mOnClose).not.toBeCalled();

          case 9:
          case "end":
            return _context.stop();
        }
      }
    }, _callee);
  })));
  beforeEach(function () {
    Object.defineProperty(HTMLElement.prototype, 'offsetWidth', {
      configurable: true,
      value: 375
    });
    Object.defineProperty(HTMLElement.prototype, 'offsetWidth', {
      configurable: true,
      value: 200
    });
  });
  afterAll(function () {
    Object.defineProperty(HTMLElement.prototype, 'offsetHeight', originalOffsetWidth);
    Object.defineProperty(HTMLElement.prototype, 'offsetHeight', originalOffsetHeight);
  });
  it('onChange', function () {
    var onChange = jest.fn();
    (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_.default, {
      visible: true,
      images: _images.images,
      onChange: onChange
    }));
    var element = document.body.querySelector('.za-carousel');

    _react.fireEvent.mouseDown(element, {
      pointerId: 1,
      clientX: 0,
      clientY: 0,
      buttons: 1
    });

    _react.fireEvent.mouseMove(element, {
      pointerId: 1,
      clientX: -200,
      clientY: 0,
      buttons: 1
    });

    _react.fireEvent.mouseUp(element, {
      pointerId: 1,
      clientX: -275
    });

    expect(onChange).toBeCalledTimes(1);
  });
  it('onClose', /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
    var mOnClose, content;
    return _regenerator.default.wrap(function _callee2$(_context2) {
      while (1) {
        switch (_context2.prev = _context2.next) {
          case 0:
            jest.useFakeTimers();
            mOnClose = jest.fn();
            (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_.default, {
              visible: true,
              images: _images.images,
              onClose: mOnClose
            }));
            content = document.body.querySelector('.za-image-preview__content');

            _react.fireEvent.mouseDown(content, {
              pointerId: 10,
              clientX: 20,
              clientY: 0,
              buttons: 1
            });

            _react.fireEvent.mouseMove(content, {
              pointerId: 10,
              clientX: 20,
              clientY: 0,
              buttons: 1
            });

            _react.fireEvent.mouseUp(content, {
              pointerId: 10,
              clientX: 20
            });

            jest.runAllTimers();
            expect(mOnClose).toBeCalledTimes(1);

          case 9:
          case "end":
            return _context2.stop();
        }
      }
    }, _callee2);
  })));
  it('load origin', /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3() {
    var _render2, getByText, content, newContent;

    return _regenerator.default.wrap(function _callee3$(_context3) {
      while (1) {
        switch (_context3.prev = _context3.next) {
          case 0:
            jest.useFakeTimers();
            _render2 = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_.default, {
              visible: true,
              images: _images.originImages,
              className: "test1"
            })), getByText = _render2.getByText;
            content = getByText('查看原图');

            _react.fireEvent.mouseDown(content, {
              pointerId: 10,
              clientX: 20,
              clientY: 0,
              buttons: 1
            });

            _react.fireEvent.mouseMove(content, {
              pointerId: 10,
              clientX: 20,
              clientY: 0,
              buttons: 1
            });

            _react.fireEvent.mouseUp(content, {
              pointerId: 10,
              clientX: 20
            });

            (0, _testUtils.act)(function () {
              var _onloadRef;

              (_onloadRef = onloadRef) === null || _onloadRef === void 0 ? void 0 : _onloadRef();
              jest.runAllTimers();
            });
            newContent = document.body.querySelector('.test1 button');
            expect(newContent).not.toBeInTheDocument();

          case 9:
          case "end":
            return _context3.stop();
        }
      }
    }, _callee3);
  })));
  it('should render pagination', function () {
    (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_.default, {
      visible: true,
      images: _images.images
    }));
    var paginationWrapper = document.body.getElementsByClassName('za-image-preview__pagination');
    expect(paginationWrapper).toHaveLength(1);
    expect(paginationWrapper[0].textContent).toContain('1 / 3');
  });
  it('should not render pagination', function () {
    (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_.default, {
      visible: true,
      images: _images.images,
      showPagination: false
    }));
    expect(document.body.getElementsByClassName('za-image-preview__pagination')).toHaveLength(0);
  });
  it('should render images', function () {
    (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_.default, {
      visible: true,
      images: _images.images
    }));
    var img = document.body.querySelectorAll('img');
    expect(img).toHaveLength(3);
    var srcArr = Array.from(img).map(function (v) {
      return v.getAttribute('src');
    });
    expect(srcArr).toEqual(_images.images);
  });
  it('show', /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee5() {
    var onClick, button;
    return _regenerator.default.wrap(function _callee5$(_context5) {
      while (1) {
        switch (_context5.prev = _context5.next) {
          case 0:
            onClick = /*#__PURE__*/function () {
              var _ref5 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4() {
                return _regenerator.default.wrap(function _callee4$(_context4) {
                  while (1) {
                    switch (_context4.prev = _context4.next) {
                      case 0:
                        _context4.next = 2;
                        return _.default.show({
                          images: _images.images,
                          className: 'image-static'
                        });

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

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

            (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_button.default, {
              onClick: onClick
            }, "show"));
            button = _react.screen.getByText('show');

            _react.fireEvent.click(button);

            expect(document.body.getElementsByClassName('image-static')[0]).toBeInTheDocument();

          case 5:
          case "end":
            return _context5.stop();
        }
      }
    }, _callee5);
  })));
});