@ryami333/react-accessible-accordion/dist/AccordionItem/accordion-item.spec.js

Accessible Accordion component for React

'use strict';

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _reactTestRenderer = require('react-test-renderer');

var _reactTestRenderer2 = _interopRequireDefault(_reactTestRenderer);

var _accordionItemTitle = require('../AccordionItemTitle/accordion-item-title');

var _accordionItemTitle2 = _interopRequireDefault(_accordionItemTitle);

var _accordionItemBody = require('../AccordionItemBody/accordion-item-body');

var _accordionItemBody2 = _interopRequireDefault(_accordionItemBody);

var _accordionItem = require('./accordion-item');

var _accordionItem2 = _interopRequireDefault(_accordionItem);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

jest.mock('uuid', function () {
    return {
        v4: function v4() {
            return 'mock-uuid-hash';
        }
    };
});

jest.mock('../AccordionItemTitle/accordion-item-title', function () {
    var RealReact = require.requireActual('react');

    var MockElement = function (_RealReact$Component) {
        _inherits(MockElement, _RealReact$Component);

        function MockElement() {
            _classCallCheck(this, MockElement);

            return _possibleConstructorReturn(this, (MockElement.__proto__ || Object.getPrototypeOf(MockElement)).apply(this, arguments));
        }

        _createClass(MockElement, [{
            key: 'render',
            value: function render() {
                return RealReact.createElement('div', this.props, this.props.children);
            }
        }]);

        return MockElement;
    }(RealReact.Component);

    MockElement.accordionElementName = 'AccordionItemTitle';

    return MockElement;
});

jest.mock('../AccordionItemBody/accordion-item-body', function () {
    var RealReact = require.requireActual('react');

    var MockElement = function (_RealReact$Component2) {
        _inherits(MockElement, _RealReact$Component2);

        function MockElement() {
            _classCallCheck(this, MockElement);

            return _possibleConstructorReturn(this, (MockElement.__proto__ || Object.getPrototypeOf(MockElement)).apply(this, arguments));
        }

        _createClass(MockElement, [{
            key: 'render',
            value: function render() {
                return RealReact.createElement('div', this.props, this.props.children);
            }
        }]);

        return MockElement;
    }(RealReact.Component);

    MockElement.accordionElementName = 'AccordionItemBody';

    return MockElement;
});

describe('AccordionItem', function () {
    it('renders correctly with accordion true', function () {
        var tree = _reactTestRenderer2.default.create(_react2.default.createElement(
            _accordionItem2.default,
            null,
            _react2.default.createElement(
                _accordionItemTitle2.default,
                null,
                _react2.default.createElement(
                    'div',
                    null,
                    'Fake title'
                )
            ),
            _react2.default.createElement(
                _accordionItemBody2.default,
                null,
                _react2.default.createElement(
                    'div',
                    null,
                    'Fake body'
                )
            )
        )).toJSON();
        expect(tree).toMatchSnapshot();
    });

    it('renders correctly with accordion false', function () {
        var tree = _reactTestRenderer2.default.create(_react2.default.createElement(
            _accordionItem2.default,
            { accordion: false },
            _react2.default.createElement(
                _accordionItemTitle2.default,
                null,
                _react2.default.createElement(
                    'div',
                    null,
                    'Fake title'
                )
            ),
            _react2.default.createElement(
                _accordionItemBody2.default,
                null,
                _react2.default.createElement(
                    'div',
                    null,
                    'Fake body'
                )
            )
        )).toJSON();
        expect(tree).toMatchSnapshot();
    });

    it('still renders with no AccordionItemTitle or AccordionItemBody', function () {
        var tree = _reactTestRenderer2.default.create(_react2.default.createElement(
            _accordionItem2.default,
            { accordion: false },
            _react2.default.createElement(
                'div',
                null,
                'Fake title'
            ),
            _react2.default.createElement(
                'div',
                null,
                'Fake body'
            )
        )).toJSON();
        expect(tree).toMatchSnapshot();
    });

    it('renders with different className', function () {
        var tree = _reactTestRenderer2.default.create(_react2.default.createElement(
            _accordionItem2.default,
            { className: 'testCSSClass' },
            _react2.default.createElement(
                _accordionItemTitle2.default,
                null,
                _react2.default.createElement(
                    'div',
                    null,
                    'Fake title'
                )
            ),
            _react2.default.createElement(
                _accordionItemBody2.default,
                null,
                _react2.default.createElement(
                    'div',
                    null,
                    'Fake body'
                )
            )
        )).toJSON();
        expect(tree).toMatchSnapshot();
    });

    it('renders with different hideBodyClassName', function () {
        var tree = _reactTestRenderer2.default.create(_react2.default.createElement(
            _accordionItem2.default,
            { expanded: false, hideBodyClassName: 'testCSSClass--hidden' },
            _react2.default.createElement(
                _accordionItemTitle2.default,
                null,
                _react2.default.createElement(
                    'div',
                    null,
                    'Fake title'
                )
            ),
            _react2.default.createElement(
                _accordionItemBody2.default,
                null,
                _react2.default.createElement(
                    'div',
                    null,
                    'Fake body'
                )
            )
        )).toJSON();
        expect(tree).toMatchSnapshot();
    });

    it('renders correctly with other blocks inside', function () {
        var tree = _reactTestRenderer2.default.create(_react2.default.createElement(
            _accordionItem2.default,
            { accordion: false },
            _react2.default.createElement(
                _accordionItemTitle2.default,
                null,
                _react2.default.createElement(
                    'div',
                    null,
                    'Fake title'
                )
            ),
            _react2.default.createElement(
                'div',
                null,
                'Just another block'
            ),
            _react2.default.createElement(
                _accordionItemBody2.default,
                null,
                _react2.default.createElement(
                    'div',
                    null,
                    'Fake body'
                )
            )
        )).toJSON();
        expect(tree).toMatchSnapshot();
    });

    it('renders correctly with other blocks inside 2', function () {
        var tree = _reactTestRenderer2.default.create(_react2.default.createElement(
            _accordionItem2.default,
            { accordion: false },
            _react2.default.createElement(
                _accordionItemTitle2.default,
                null,
                _react2.default.createElement(
                    'div',
                    null,
                    'Fake title'
                )
            ),
            _react2.default.createElement(
                _accordionItemBody2.default,
                null,
                _react2.default.createElement(
                    'div',
                    null,
                    'Fake body'
                )
            ),
            _react2.default.createElement(
                'div',
                null,
                'Just another block'
            )
        )).toJSON();
        expect(tree).toMatchSnapshot();
    });
});