react-inky/lib/components/__tests__/grid.js

React components for Inky

"use strict";

var _react = _interopRequireDefault(require("react"));

var _server = require("react-dom/server");

var _chai = require("chai");

var _Row = _interopRequireDefault(require("../Row"));

var _Column = _interopRequireDefault(require("../Column"));

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

describe('Grid', () => {
  it('can render nested grids', () => {
    const wrapper = (0, _server.renderToStaticMarkup)(_react.default.createElement(_Row.default, null, _react.default.createElement(_Column.default, {
      first: true,
      last: true
    }, _react.default.createElement(_Row.default, null))));
    (0, _chai.expect)(wrapper).html.to.equal(`
      <table class="row">
        <tbody>
          <tr>
            <th class="small-12 large-12 columns first last">
              <table>
                <tr>
                  <th>
                    <table class="row">
                      <tbody>
                        <tr></tr>
                      </tbody>
                    </table>
                  </th>
                </tr>
              </table>
            </th>
          </tr>
        </tbody>
      </table>
    `);
  });
  it('can detect the first and last child in a row', () => {
    const wrapper = (0, _server.renderToStaticMarkup)(_react.default.createElement(_Row.default, null, _react.default.createElement(_Column.default, null), _react.default.createElement(_Column.default, null)));
    (0, _chai.expect)(wrapper).html.to.equal(`
      <table class="row">
        <tbody>
          <tr>
            <th class="small-12 large-12 columns first">
              <table>
                <tr>
                  <th></th>
                  <th class="expander"></th>
                </tr>
              </table>
            </th>
            <th class="small-12 large-12 columns last">
              <table>
                <tr>
                  <th></th>
                  <th class="expander"></th>
                </tr>
              </table>
            </th>
          </tr>
        </tbody>
      </table>
    `);
  });
});