react-ssr/lib/helpers/fetchData/fetchData.test.js

A simplified solution to React server side rendering.

'use strict';

function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { return Promise.resolve(value).then(function (value) { step("next", value); }, function (err) { step("throw", err); }); } } return step("next"); }); }; }

var fetchData = require('./fetchData');

var fakeCall = function fakeCall(fakeThingToResolve) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      resolve(fakeThingToResolve);
    }, 10);
  });
};

test('will directly return promises if component does not have ssrWaitsFor or fetchData', function () {
  var component = {};
  var result = fetchData(component, {}, []);
  expect(Array.isArray(result)).toBeTruthy();
  expect(result).toEqual([]);
});

test('will add a new promise in if the component has a fetchData', function () {
  var component = { fetchData: jest.fn() };
  var result = fetchData(component, {}, []);
  expect(result.length).toEqual(1);
});

test('it populates the promises array with 2 promises if there is one in ssrWaitsFor', function () {
  var component = {
    fetchData: jest.fn(),
    ssrWaitsFor: [{
      fetchData: jest.fn()
    }]
  };

  var result = fetchData(component, {}, []);

  expect(result.length).toEqual(2);
});

test('it rejects with the expected error when fetchData is not a function', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
  var component, result;
  return regeneratorRuntime.wrap(function _callee$(_context) {
    while (1) {
      switch (_context.prev = _context.next) {
        case 0:
          component = { fetchData: 'invalid-thing' };
          result = fetchData(component, {}, []);
          _context.next = 4;
          return expect(result[0]).resolves.toEqual(new Error('Fetch data not defined or not a function.'));

        case 4:
        case 'end':
          return _context.stop();
      }
    }
  }, _callee, undefined);
})));

test('it resolves with the expected props from a single fetchData', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
  var data, component, result;
  return regeneratorRuntime.wrap(function _callee2$(_context2) {
    while (1) {
      switch (_context2.prev = _context2.next) {
        case 0:
          data = { test: 'Game of Thrones!' };
          component = {
            fetchData: function fetchData() {
              return fakeCall(data);
            },
            displayName: 'ExampleOne'
          };
          result = fetchData(component, {}, []);
          _context2.next = 5;
          return expect(result[0]).resolves.toEqual({ ExampleOne: data });

        case 5:
        case 'end':
          return _context2.stop();
      }
    }
  }, _callee2, undefined);
})));

test('it resolves multiple keys when returning an object of several promises', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
  var data, component, result;
  return regeneratorRuntime.wrap(function _callee3$(_context3) {
    while (1) {
      switch (_context3.prev = _context3.next) {
        case 0:
          data = { one: 'Game of Thrones!', two: 'Westworld' };
          component = {
            fetchData: function fetchData() {
              return {
                one: fakeCall(data.one),
                two: fakeCall(data.two)
              };
            },
            displayName: 'ExampleTwo'
          };
          result = fetchData(component, {}, []);
          _context3.next = 5;
          return expect(result[0]).resolves.toEqual({ ExampleTwo: data });

        case 5:
        case 'end':
          return _context3.stop();
      }
    }
  }, _callee3, undefined);
})));