@upendradevsingh/webcore/dist/Popover/popover.test.js

UI Core Components for web

'use strict';

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _chai = require('chai');

var _enzyme = require('enzyme');

var _Popover = require('./Popover');

var _Popover2 = _interopRequireDefault(_Popover);

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

describe('<Popover />', function () {
    it('render children when passed in', function () {
        var wrapper = (0, _enzyme.render)(_react2.default.createElement(
            _Popover2.default,
            null,
            _react2.default.createElement(
                'p',
                { className: 'text' },
                ' I am popover '
            ),
            _react2.default.createElement(
                'p',
                { className: 'text' },
                ' I am popover '
            )
        ));
        (0, _chai.expect)(wrapper.find('.text')).to.have.length(2);
    });

    it('creates popover content block', function () {
        var wrapper = (0, _enzyme.render)(_react2.default.createElement(
            _Popover2.default,
            {
                targetClass: 'btn',
                inline: true,
                placement: "right",
                targetText: 'I am Popover - Right' },
            _react2.default.createElement(
                'p',
                null,
                ' I am Popover Content '
            ),
            _react2.default.createElement(
                'p',
                null,
                ' I am Popover Content '
            ),
            _react2.default.createElement(
                'p',
                null,
                ' I am Popover Content '
            )
        ));

        // Rendered html of Popover component
        (0, _chai.expect)(wrapper.html().trim()).to.equal('<div class="popover-options" style="position:relative;display:inline-block;"><div class="popover fade right in" role="tooltip" style="display:block;left:-9999px;top:0;opacity:0;"><div class="arrow" style="left:-11px;"></div><h3 class="popover-title hide"></h3><div class="popover-content"><p> I am Popover Content </p><p> I am Popover Content </p><p> I am Popover Content </p></div></div><span class="popover-btn btn">I am Popover - Right</span></div>');
    });
});