function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _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(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) { ; } } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import React from 'react';
import '@testing-library/jest-dom/extend-expect';
import { renderToStaticMarkup } from 'react-dom/server';
import { render } from '@testing-library/react';
import { FloatingBox } from '.';
import { useStatefulRef } from '../../hooks/useStatefulRef';
describe('FloatingBox', function () {
  var wrapper;
  var children;
  describe('when provided a `renderTarget` and arbitrary JSX content', function () {
    beforeEach(function () {
      children = /*#__PURE__*/React.createElement("pre", null, "This is some arbitrary JSX");
      wrapper = render( /*#__PURE__*/React.createElement(FloatingBox, {
        isVisible: true,
        renderTarget: /*#__PURE__*/React.createElement("div", null, "Hello, World!"),
        role: "dialog",
        "aria-modal": true
      }, children));
    });
    it('applies the supplied `role`', function () {
      expect(wrapper.queryByTestId('floating-box')).toHaveAttribute('role', 'dialog');
    });
    it('applies additional arbitrary props to wrapper', function () {
      expect(wrapper.queryByTestId('floating-box')).toHaveAttribute('aria-modal');
    });
    it('applies the `role` attribute', function () {
      expect(wrapper.getByTestId('floating-box')).toHaveAttribute('role', 'dialog');
    });
    it('renders an embedded target', function () {
      expect(wrapper.getByTestId('floating-box-styled-target')).toBeInTheDocument();
    });
    it('renders the box', function () {
      expect(wrapper.getByTestId('floating-box')).toBeInTheDocument();
    });
    it('renders the provided renderTarget JSX', function () {
      expect(wrapper.getByText('Hello, World!')).toBeInTheDocument();
    });
    it('renders the provided arbitrary JSX', function () {
      expect(wrapper.getByTestId('floating-box-content').innerHTML).toContain(renderToStaticMarkup(children));
    });
  });
  describe('when provided a `renderTargetElement` and arbitrary JSX content', function () {
    beforeEach(function () {
      children = /*#__PURE__*/React.createElement("pre", null, "This is some arbitrary JSX");
      var TestComponent = function TestComponent() {
        var _useStatefulRef = useStatefulRef(),
          _useStatefulRef2 = _slicedToArray(_useStatefulRef, 2),
          element = _useStatefulRef2[0],
          setElement = _useStatefulRef2[1];
        return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
          ref: setElement
        }, "Hello, World!"), /*#__PURE__*/React.createElement(FloatingBox, {
          isVisible: true,
          targetElement: element,
          role: "dialog",
          "aria-modal": true
        }, children));
      };
      wrapper = render( /*#__PURE__*/React.createElement(TestComponent, null));
    });
    it('renders the box', function () {
      expect(wrapper.queryByTestId('floating-box')).toBeInTheDocument();
    });
    it('does not render an embedded target', function () {
      expect(wrapper.queryByTestId('floating-box-styled-target')).not.toBeInTheDocument();
    });
    it('renders the provided arbitrary JSX', function () {
      expect(wrapper.getByTestId('floating-box-content').innerHTML).toContain(renderToStaticMarkup(children));
    });
  });
  describe('when the content changes', function () {
    var ExampleFloatingBox = function ExampleFloatingBox(_ref) {
      var content = _ref.children;
      return /*#__PURE__*/React.createElement(FloatingBox, {
        isVisible: true,
        renderTarget: /*#__PURE__*/React.createElement("div", null, "Hello, World!"),
        role: "dialog",
        "aria-modal": true
      }, /*#__PURE__*/React.createElement(React.Fragment, null, content));
    };
    var initialId;
    beforeEach(function () {
      wrapper = render( /*#__PURE__*/React.createElement(ExampleFloatingBox, null, "Initial content"));
      initialId = wrapper.getByTestId('floating-box-content').id;
      wrapper.rerender( /*#__PURE__*/React.createElement(ExampleFloatingBox, null, "Updated content"));
    });
    it('does not generate a new content `id`', function () {
      expect(wrapper.getByTestId('floating-box-content')).toHaveAttribute('id', initialId);
    });
  });
});