react-accessible-tabs/lib/components/Panels.spec.js

Accessible React tabs component

'use strict';

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _mocha = require('mocha');

var _enzyme = require('enzyme');

var _expect = require('expect');

var _expect2 = _interopRequireDefault(_expect);

var _testData = require('../../tools/testData');

var _testData2 = _interopRequireDefault(_testData);

var _Panels = require('./Panels');

var _Panels2 = _interopRequireDefault(_Panels);

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

(0, _mocha.describe)('<Panels />', function () {
    (0, _mocha.it)('renders nothing with no data', function () {
        var wrapper = (0, _enzyme.shallow)(_react2.default.createElement(_Panels2.default, { data: [] }));

        (0, _expect2.default)(wrapper.type()).toBe(null);
    });

    (0, _mocha.it)('renders div.tabs__panels', function () {
        var wrapper = (0, _enzyme.shallow)(_react2.default.createElement(_Panels2.default, { data: _testData2.default }));

        (0, _expect2.default)(wrapper.is('div.tabs__panels')).toBe(true);
    });

    (0, _mocha.it)('contains 3 <Panel />s', function () {
        var wrapper = (0, _enzyme.shallow)(_react2.default.createElement(_Panels2.default, { data: _testData2.default }));

        (0, _expect2.default)(wrapper.html().match(/<section.*?class="tabs__panel.*?role="tabpanel".*?<\/section>/g).length).toBe(3);
    });

    (0, _mocha.it)('.tabs__panel 1\'s [id] is i0-Tab1', function () {
        var wrapper = (0, _enzyme.shallow)(_react2.default.createElement(_Panels2.default, { data: _testData2.default }));
        var tabPanel = wrapper.html().match(/<section.*?class="tabs__panel.*?role="tabpanel".*?<\/section>/)[0];

        (0, _expect2.default)(tabPanel.indexOf('id="i0-Tab1"') > -1).toBe(true);
    });
});