reshow-flux/build/es/__tests__/connectHookTest.mjs

The smallest react flux and Fast hook alternative

import _classCallCheck from "reshow-runtime/es/helpers/classCallCheck";
import _createClass from "reshow-runtime/es/helpers/createClass";
import _possibleConstructorReturn from "reshow-runtime/es/helpers/possibleConstructorReturn";
import _isNativeReflectConstruct from "reshow-runtime/es/helpers/isNativeReflectConstruct";
import _getPrototypeOf from "reshow-runtime/es/helpers/getPrototypeOf";
import _inherits from "reshow-runtime/es/helpers/inherits";
import _asyncToGenerator from "reshow-runtime/es/helpers/asyncToGenerator";
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
// @ts-check

import * as React from "react";
var {
  Component
} = React;
import { expect } from "chai";
import { act, render, hideConsoleError, cleanIt, waitFor } from "reshow-unit";
import { createReducer } from "reshow-flux-base";
import useConnect from "../useConnect.mjs";
import { jsx as _jsx } from "react/jsx-runtime";
describe("Test Connect Hook", function () {
  var reducer;
  beforeEach(function () {
    reducer = createReducer(function (_state, action) {
      return action;
    });
  });
  it("basic test", /*#__PURE__*/_asyncToGenerator(function* () {
    var [store, dispatch] = reducer;
    var Foo = function Foo(/**@type any*/props) {
      var state = useConnect({
        storeLocator: function storeLocator() {
          return store;
        },
        calculateState: function calculateState() {
          return store.getState();
        }
      })(props);
      return /*#__PURE__*/_jsx("div", {
        className: state.foo
      });
    };
    var wrap = render(/*#__PURE__*/_jsx(Foo, {}));
    expect(wrap.html()).to.equal("<div></div>");
    var a = {
      foo: "111"
    };
    yield act(function () {
      return dispatch(a);
    }, 5);
    yield waitFor(function () {
      expect(wrap.html()).to.equal('<div class="111"></div>');
    });
    yield act(function () {
      return dispatch({
        foo: "222"
      });
    });
    yield waitFor(function () {
      expect(wrap.html()).to.equal('<div class="222"></div>');
    });
  }));
  it("test Warnings for some updates during render", /*#__PURE__*/_asyncToGenerator(function* () {
    var _Foo;
    var [store, dispatch] = reducer;
    /**
     * https://fb.me/setstate-in-render
     * https://reactjs.org/blog/2020/02/26/react-v16.13.0.html#warnings-for-some-updates-during-render
     */
    var init = 0;
    var Foo = function Foo(/**@type any*/props) {
      var state = useConnect({
        storeLocator: function storeLocator() {
          return store;
        },
        calculateState: function calculateState() {
          return store.getState();
        }
      })(props);
      if (init <= 1) {
        dispatch({
          foo: "bar"
        });
      }
      init++;
      return /*#__PURE__*/_jsx("div", {
        className: state.foo
      });
    };
    var VDom = /*#__PURE__*/function (_Component) {
      function VDom() {
        _classCallCheck(this, VDom);
        return _callSuper(this, VDom, arguments);
      }
      _inherits(VDom, _Component);
      return _createClass(VDom, [{
        key: "componentDidCatch",
        value: function componentDidCatch(/**@type any*/error, /**@type any*/errorInfo) {
          console.log({
            error,
            errorInfo
          });
        }
      }, {
        key: "render",
        value: function render() {
          return _Foo || (_Foo = /*#__PURE__*/_jsx(Foo, {}));
        }
      }]);
    }(Component);
    yield act();
    var wrap = render(/*#__PURE__*/_jsx(VDom, {}));
    var html = wrap.html();
    expect(html).to.equal('<div class="bar"></div>');
    wrap.unmount();
  }));
});
describe("Test Connect Hook with store", function () {
  var reducer;
  beforeEach(function () {
    reducer = createReducer(function (_state, action) {
      return action;
    });
    hideConsoleError();
  });
  afterEach(function () {
    cleanIt();
  });
  it("test store not defined", function () {
    var _Foo2;
    var [store] = reducer;
    var Foo = function Foo(/**@type any*/props) {
      var state = useConnect({
        calculateState: function calculateState() {
          return store.getState();
        }
      })(props);
      return /*#__PURE__*/_jsx("div", {
        className: state.foo
      });
    };
    expect(function () {
      render(_Foo2 || (_Foo2 = /*#__PURE__*/_jsx(Foo, {})));
    }).to.throw();
  });
});