import React from 'react';
import '@testing-library/jest-dom/extend-expect';
import { renderToStaticMarkup } from 'react-dom/server';
import { render } from '@testing-library/react';
import { Container } from '.';
describe('Container', function () {
  var wrapper;
  var children;
  describe('when provided without a size and arbitrary JSX content', function () {
    beforeEach(function () {
      children = /*#__PURE__*/React.createElement("pre", null, "Arbitrary JSX");
      wrapper = render( /*#__PURE__*/React.createElement(Container, null, children));
    });
    it('applied the correct style rules based on the size prop', function () {
      expect(wrapper.getByTestId('container')).toHaveStyleRule('padding-left', '2rem');
      expect(wrapper.getByTestId('container')).toHaveStyleRule('padding-right', '2rem');
    });
    it('renders the content correctly', function () {
      expect(wrapper.getByTestId('container').innerHTML).toContain(renderToStaticMarkup(children));
    });
  });
  describe('when provided with a size of small', function () {
    beforeEach(function () {
      wrapper = render( /*#__PURE__*/React.createElement(Container, {
        size: "small"
      }));
    });
    it('applied the correct style rules based on the size prop', function () {
      expect(wrapper.getByTestId('container')).toHaveStyleRule('padding-left', '2rem');
      expect(wrapper.getByTestId('container')).toHaveStyleRule('padding-right', '2rem');
    });
  });
  describe('when provided with a size of large', function () {
    beforeEach(function () {
      wrapper = render( /*#__PURE__*/React.createElement(Container, {
        size: "large"
      }));
    });
    it('applied the correct style rules based on the size prop', function () {
      expect(wrapper.getByTestId('container')).toHaveStyleRule('padding-left', '2.5rem');
      expect(wrapper.getByTestId('container')).toHaveStyleRule('padding-right', '2.5rem');
    });
  });
});