"use strict";

var _FloatingLayer = require("@enact/ui/FloatingLayer");
require("@testing-library/jest-dom");
var _react = require("@testing-library/react");
var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
var _react2 = require("react");
var _Button = _interopRequireDefault(require("../../Button"));
var _Popup = require("../Popup");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
var FloatingLayerController = (0, _FloatingLayer.FloatingLayerDecorator)('div');
var keyUp = function keyUp(keyCode) {
  return function (elm) {
    return _react.fireEvent.keyUp(elm, {
      keyCode: keyCode
    });
  };
};
var escapeKeyUp = keyUp(27);
describe('Popup Specs', function () {
  test('should set role to `alert` by default', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
        open: true,
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
          children: "popup"
        })
      })
    }));
    var popup = _react.screen.getByRole('alert');
    expect(popup).toBeInTheDocument();
  });
  test('should allow role to be overridden', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
        open: true,
        role: "dialog"
      })
    }));
    var popup = _react.screen.getByRole('dialog');
    expect(popup).toBeInTheDocument();
  });
  test('should be rendered opened if open is set to true', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
        open: true,
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
          children: "popup"
        })
      })
    }));
    var popup = _react.screen.getByText('popup');
    expect(popup).toBeInTheDocument();
  });
  test('should not be rendered if open is set to false', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
          children: "popup"
        })
      })
    }));
    var popup = _react.screen.queryByText('popup');
    expect(popup).toBeNull();
  });
  describe('with centered content', function () {
    test('should be rendered with centered content if `centered` is set to true', function () {
      (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          centered: true,
          open: true
        })
      }));
      var expected = 'centered';
      var popup = _react.screen.getByRole('alert');
      expect(popup).toHaveClass(expected);
    });
    test('should not be rendered with centered content if `centered` is set to false', function () {
      (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          open: true
        })
      }));
      var expected = 'centered';
      var popup = _react.screen.getByRole('alert');
      expect(popup).not.toHaveClass(expected);
    });
  });
  describe('with position center', function () {
    test('should have `center` class when no position is specified', function () {
      (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          open: true
        })
      }));
      var popup = _react.screen.getByRole('alert');
      var expected = 'center';
      expect(popup).toHaveClass(expected);
    });
    test('should have popup transition container with `center` class', function () {
      (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          open: true,
          position: "center"
        })
      }));
      var transitionContainer = _react.screen.getByRole('alert').parentElement.parentElement;
      var expected = 'center';
      expect(transitionContainer).toHaveClass(expected);
    });
  });
  describe('with position top', function () {
    test('should have `top` class', function () {
      (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          open: true,
          position: "top"
        })
      }));
      var popup = _react.screen.getByRole('alert');
      var expected = 'top';
      expect(popup).toHaveClass(expected);
    });
    test('should have popup transition container with `top` class', function () {
      (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          open: true,
          position: "top"
        })
      }));
      var transitionContainer = _react.screen.getByRole('alert').parentElement.parentElement;
      var expected = 'top';
      expect(transitionContainer).toHaveClass(expected);
    });
  });
  describe('with position bottom', function () {
    test('should have `bottom` class', function () {
      (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          open: true,
          position: "bottom"
        })
      }));
      var popup = _react.screen.getByRole('alert');
      var expected = 'bottom';
      expect(popup).toHaveClass(expected);
    });
    test('should have popup transition container with `bottom` class', function () {
      (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          open: true,
          position: "bottom"
        })
      }));
      var transitionContainer = _react.screen.getByRole('alert').parentElement.parentElement;
      var expected = 'bottom';
      expect(transitionContainer).toHaveClass(expected);
    });
  });
  describe('with position left', function () {
    test('should have `left` class', function () {
      (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          open: true,
          position: "left"
        })
      }));
      var popup = _react.screen.getByRole('alert');
      var expected = 'left';
      expect(popup).toHaveClass(expected);
    });
    test('should have popup transition container with `left` class', function () {
      (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          open: true,
          position: "left"
        })
      }));
      var transitionContainer = _react.screen.getByRole('alert').parentElement.parentElement;
      var expected = 'left';
      expect(transitionContainer).toHaveClass(expected);
    });
  });
  describe('with position right', function () {
    test('should have `right` class', function () {
      (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          open: true,
          position: "right",
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
            children: "popup"
          })
        })
      }));
      var popup = _react.screen.getByRole('alert');
      var expected = 'right';
      expect(popup).toHaveClass(expected);
    });
    test('should have popup transition container with `right` class', function () {
      (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          open: true,
          position: "right",
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
            children: "popup"
          })
        })
      }));
      var transitionContainer = _react.screen.getByRole('alert').parentElement.parentElement;
      var expected = 'right';
      expect(transitionContainer).toHaveClass(expected);
    });
  });
  describe('with position fullscreen', function () {
    test('should have `fullscreen` class', function () {
      (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          open: true,
          position: "fullscreen"
        })
      }));
      var popup = _react.screen.getByRole('alert');
      var expected = 'fullscreen';
      expect(popup).toHaveClass(expected);
    });
    test('should have popup transition container with `fullscreen` class', function () {
      (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          open: true,
          position: "fullscreen"
        })
      }));
      var transitionContainer = _react.screen.getByRole('alert').parentElement.parentElement;
      var expected = 'fullscreen';
      expect(transitionContainer).toHaveClass(expected);
    });
  });
  describe('with position changes dynamically', function () {
    test('should not have `top` class when position change from top to any other position', function () {
      var _render = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
            open: true,
            position: "top"
          })
        })),
        rerender = _render.rerender;
      var initialPopup = _react.screen.getByRole('alert');
      var expected = 'top';
      expect(initialPopup).toHaveClass(expected);
      rerender( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          open: true,
          position: "center"
        })
      }));
      var popup = _react.screen.getByRole('alert');
      expect(popup).not.toHaveClass(expected);
    });
  });
  test('should close popup on escape', /*#__PURE__*/_asyncToGenerator(function* () {
    var handleClose = jest.fn();
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
        open: true,
        onClose: handleClose,
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
          children: "popup"
        })
      })
    }));
    _react.fireEvent.keyUp(_react.screen.getByText('popup'), {
      keyCode: 27
    });
    yield (0, _react.waitFor)(function () {
      expect(handleClose).toHaveBeenCalled();
    });
  }));
  test('should apply `ease-in-out` class to transition container when noAnimation is false', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
        open: true
      })
    }));
    var transitionContainer = _react.screen.getByRole('alert').parentElement.parentElement;
    var expected = 'ease-in-out';
    expect(transitionContainer).toHaveClass(expected);
  });
  test('should apply `shown` class when visible with noAnimation', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
        noAnimation: true,
        open: true
      })
    }));
    var actual = _react.screen.getByRole('alert').parentElement.parentElement;
    var expected = 'shown';
    expect(actual).toHaveClass(expected);
  });
  test('should show close button if `closeButton` is set to true', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
        closeButton: true,
        noAnimation: true,
        open: true
      })
    }));
    var button = _react.screen.getByRole('button');
    var expected = 'closeButton';
    expect(button).toHaveClass(expected);
  });
  test('should call onShow after popup with noAnimation is opened', function () {
    var handleShow = jest.fn();
    var _render2 = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          noAnimation: true,
          onShow: handleShow
        })
      })),
      rerender = _render2.rerender;
    rerender( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
        noAnimation: true,
        onShow: handleShow,
        open: true
      })
    }));
    expect(handleShow).toHaveBeenCalled();
  });
  test('should handle onShow', /*#__PURE__*/_asyncToGenerator(function* () {
    var handleShow = jest.fn();
    var user = _userEvent["default"].setup();
    var PopupView = function PopupView() {
      var _useState = (0, _react2.useState)(false),
        _useState2 = _slicedToArray(_useState, 2),
        openState = _useState2[0],
        handleOpen = _useState2[1];
      return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Button["default"], {
          alt: "Normal",
          onClick: function onClick() {
            return handleOpen(true);
          },
          children: "Open 0"
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
            noAnimation: true,
            onShow: handleShow,
            open: openState,
            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
              children: "Content"
            })
          })
        })]
      });
    };
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(PopupView, {}));
    var button = _react.screen.getByRole('button');
    yield user.click(button);
    expect(handleShow).toHaveBeenCalled();
  }));
  test('should call onHide after popup with noAnimation is closed', function () {
    var handleHide = jest.fn();
    var _render3 = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          noAnimation: true,
          onHide: handleHide,
          open: true
        })
      })),
      rerender = _render3.rerender;
    rerender( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
        noAnimation: true,
        onHide: handleHide
      })
    }));
    expect(handleHide).toHaveBeenCalled();
  });
  test('should apply `hidden` class when popup closes', function () {
    var _render4 = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
          open: true
        })
      })),
      rerender = _render4.rerender;
    rerender( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {})
    }));
    var transitionContainer = _react.screen.getByRole('alert').parentElement.parentElement;
    var expected = 'hidden';
    expect(transitionContainer).toHaveClass(expected);
  });
  test('should fire onClose event with type and detail info when Popup is closed', function () {
    var handleClose = jest.fn();
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
        onClose: handleClose,
        open: true,
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
          children: "popup"
        })
      })
    }));
    var popup = _react.screen.getByText('popup');
    escapeKeyUp(popup);
    var actual = handleClose.mock.calls.length && handleClose.mock.calls[0][0];
    var expectedType = {
      type: 'onDismiss',
      detail: {
        inputType: 'key'
      }
    };
    expect(actual).toMatchObject(expectedType);
  });
  test('should call onClose on `closeButton` click', /*#__PURE__*/_asyncToGenerator(function* () {
    var handleClose = jest.fn();
    var user = _userEvent["default"].setup();
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingLayerController, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popup.Popup, {
        closeButton: true,
        noAnimation: true,
        onClose: handleClose,
        open: true
      })
    }));
    var button = _react.screen.getByRole('button');
    yield user.click(button);
    expect(handleClose).toHaveBeenCalled();
  }));
});