@virtuous/react-conductor/Route/spec.js

React bindings for Conductor

"use strict";

var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));

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

var _enzyme = require("enzyme");

var _conductor = require("@virtuous/conductor");

var _index = _interopRequireDefault(require("../Router/index"));

var _context2 = require("../context");

var _index2 = _interopRequireDefault(require("./index"));

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

function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }

function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

var pattern = '/myroute/:id';
var spy = jest.spyOn(_conductor.router, 'register');

var transform = function transform(route) {
  return route;
};

describe('<Route />', function () {
  it('should render component', function () {
    (0, _enzyme.mount)(_react["default"].createElement(_index["default"], null, _react["default"].createElement(_index2["default"], {
      pattern: pattern,
      component: function component() {
        return _react["default"].createElement("div", null);
      },
      transform: transform
    })));
    expect(spy).toHaveBeenCalledWith(pattern, transform);
  });
  it('should correctly set the RouteContext value', function () {
    var contextValue = null;

    var current = _conductor.router.getCurrentRoute();

    var MyComponent = function MyComponent() {
      return _react["default"].createElement(_context2.RouteContext.Consumer, null, function (route) {
        contextValue = route;
        return null;
      });
    };

    (0, _enzyme.mount)(_react["default"].createElement(_index["default"], null, _react["default"].createElement(_index2["default"], {
      pattern: pattern,
      component: MyComponent
    })));
    expect(_objectSpread({}, current, {
      open: true,
      visible: true
    })).toMatchObject(contextValue);
  });
  it('should render null when does not match current route', function () {
    var route = (0, _enzyme.mount)(_react["default"].createElement(_index["default"], null, _react["default"].createElement(_index2["default"], {
      pattern: "/wrong",
      component: function component() {
        return _react["default"].createElement("div", null);
      }
    })));
    expect(route.html()).toBe('');
  });
  it('should react to router events and update',
  /*#__PURE__*/
  _asyncToGenerator(
  /*#__PURE__*/
  _regenerator["default"].mark(function _callee() {
    var route;
    return _regenerator["default"].wrap(function _callee$(_context) {
      while (1) {
        switch (_context.prev = _context.next) {
          case 0:
            route = (0, _enzyme.mount)(_react["default"].createElement(_index["default"], null, _react["default"].createElement(_index2["default"], {
              pattern: pattern,
              component: function component() {
                return _react["default"].createElement("div", null);
              }
            }), _react["default"].createElement(_index2["default"], {
              pattern: "/other",
              component: function component() {
                return _react["default"].createElement("div", null);
              }
            }))); // Should initially render the component (match found).

            expect(route.find(_index2["default"]).at(0).html()).toBe('<div></div>');
            expect(route.find(_index2["default"]).at(1).html()).toBeNull();
            _context.next = 5;
            return _conductor.router.push({
              pathname: '/other'
            });

          case 5:
            route.update(); // Should now render null (first route does not match).

            expect(route.find(_index2["default"]).at(0).html()).toBeNull();
            expect(route.find(_index2["default"]).at(1).html()).toBe('<div></div>');

          case 8:
          case "end":
            return _context.stop();
        }
      }
    }, _callee);
  })));
});