Why Gemfury? Push, build, and install  RubyGems npm packages Python packages Maven artifacts PHP packages Go Modules Debian packages RPM packages NuGet packages

Repository URL to install this package:

Details    
@skava/modules / ___dist / SSR / react-tree-walker / __tests__ / react-tree-walker.js
Size: Mime:
"use strict";

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

var _reactDom = _interopRequireDefault(require("react-dom"));

var _preact = require("preact");

var _propTypes = _interopRequireDefault(require("prop-types"));

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

var _jsxFileName = "SSR/react-tree-walker/__tests__/react-tree-walker.js";

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

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }

const resolveLater = result => new Promise(resolve => setTimeout(() => {
  resolve(result);
}, 10));

describe('reactTreeWalker', () => {
  describe('react + preact', () => {
    [{
      Component: _react.Component,
      h: _react.createElement
    }, {
      Component: _preact.Component,
      h: _preact.createElement
    }].forEach(({
      Component,
      h
    }) => {
      const Stateless = jest.fn(({
        children
      }) => _react.default.createElement("div", {
        __source: {
          fileName: _jsxFileName,
          lineNumber: 34
        },
        __self: void 0
      }, children));
      Stateless.contextTypes = {
        theContext: _propTypes.default.string.isRequired
      };
      let Stateful = class Stateful extends Component {
        getData() {
          return typeof this.props.data === 'function' ? this.props.data() : this.props.data;
        }

        render() {
          return h('div', null, this.props.children);
        }

      };

      const createTree = ({
        async
      } = {
        async: false
      }) => {
        const Foo = Stateful;
        const Bob = Stateless;
        return h('div', {
          children: [h('h1', null, 'Hello World!'), h(Foo, {
            data: async ? () => resolveLater(1) : 1
          }), h(Foo, {
            data: async ? () => resolveLater(2) : 2
          }, h('div', null, [h(Bob, null, h(Foo, {
            children: [h(Foo, {
              data: async ? () => resolveLater(5) : 5
            }), h(Foo, {
              data: async ? () => resolveLater(6) : 6
            })],
            data: async ? () => resolveLater(4) : 4
          })), h('div', null, 'hi!')])), h(Foo, {
            data: async ? () => resolveLater(3) : 3
          })]
        });
      };

      it('simple sync visitor', () => {
        const actual = [];

        const visitor = (element, instance) => {
          if (instance && typeof instance.getData === 'function') {
            const data = instance.getData();
            actual.push(data);
          }
        };

        return (0, _index.default)(createTree(), visitor).then(() => {
          const expected = [1, 2, 4, 5, 6, 3];
          expect(actual).toEqual(expected);
        });
      });
      it('promise based visitor', () => {
        const actual = [];

        const visitor = (element, instance) => {
          if (instance && typeof instance.getData === 'function') {
            return instance.getData().then(data => {
              actual.push(data);
              return true;
            });
          }

          return true;
        };

        return (0, _index.default)(createTree({
          async: true
        }), visitor).then(() => {
          const expected = [1, 2, 4, 5, 6, 3];
          expect(actual).toEqual(expected);
        });
      });
      it('promise based visitor stops resolving', () => {
        const actual = [];

        const visitor = (element, instance) => {
          if (instance && typeof instance.getData === 'function') {
            return instance.getData().then(data => {
              actual.push(data);
              return data !== 4;
            });
          }

          return true;
        };

        return (0, _index.default)(createTree({
          async: true
        }), visitor).then(() => {
          const expected = [1, 2, 4, 3];
          expect(actual).toEqual(expected);
        });
      });
      it('componentWillMount & setState', () => {
        let actual = {};
        let Foo = class Foo extends Component {
          constructor(props) {
            super(props);
            this.state = {
              foo: 'foo'
            };
          }

          componentWillMount() {
            this.setState({
              foo: 'bar'
            });
            this.setState((state, props) => ({
              other: `I am ${props.value} ${state.foo}`
            }));
          }

          render() {
            actual = this.state;
            return h('div', null, this.state.foo);
          }

        };
        return (0, _index.default)(h(Foo, {
          value: 'foo'
        }), () => true).then(() => {
          const expected = {
            foo: 'bar',
            other: 'I am foo bar'
          };
          expect(actual).toMatchObject(expected);
        });
      });
      it('calls componentWillUnmount', () => {
        let called = true;
        let Foo = class Foo extends Component {
          componentWillUnmount() {
            called = true;
          }

          render() {
            return 'foo';
          }

        };
        return (0, _index.default)(h(Foo), () => true, null, {
          componentWillUnmount: true
        }).then(() => {
          expect(called).toBeTruthy();
        });
      });
      it('getChildContext', () => {
        let Foo = class Foo extends Component {
          getChildContext() {
            return {
              foo: 'val'
            };
          }

          render() {
            return h('div', null, this.props.children);
          }

        };
        let actual;

        function Bar(props, context) {
          actual = context;
          return 'bar';
        }

        Bar.contextTypes = {
          foo: _propTypes.default.string.isRequired
        };
        return (0, _index.default)(h(Foo, null, h(Bar)), () => true).then(() => {
          const expected = {
            foo: 'val'
          };
          expect(actual).toMatchObject(expected);
        });
      });
      it('works with instance-as-result component', () => {
        let Foo = class Foo extends Component {
          render() {
            return h('div', null, [h(Stateful, {
              data: 1
            }), h(Stateful, {
              data: 2
            })]);
          }

        };

        const Bar = props => new Foo(props);

        const actual = [];

        const visitor = (element, instance) => {
          if (instance && typeof instance.getData === 'function') {
            const data = instance.getData();
            actual.push(data);
          }
        };

        return (0, _index.default)(h(Bar), visitor).then(() => {
          const expected = [1, 2];
          expect(actual).toEqual(expected);
        });
      });
      describe('error handling', () => {
        it('throws async visitor errors', () => {
          const tree = createTree({
            async: true
          });
          const actual = [];

          const visitor = (element, instance) => {
            if (instance && typeof instance.getData === 'function') {
              return instance.getData().then(data => {
                actual.push(data);

                if (data === 4) {
                  return Promise.reject(new Error('Visitor made 💩'));
                }

                return true;
              });
            }

            return true;
          };

          return (0, _index.default)(tree, visitor).then(() => {
            throw new Error('Expected error was not thrown');
          }, err => {
            expect(err).toMatchObject(new Error('Visitor made 💩'));
            expect(actual).toEqual([1, 2, 4]);
          });
        });
        it('throws sync visitor errors', () => {
          const tree = createTree();
          const actual = [];

          const visitor = (element, instance) => {
            if (instance && typeof instance.getData === 'function') {
              const data = instance.getData();
              actual.push(data);

              if (data === 4) {
                throw new Error('Visitor made 💩');
              }
            }

            return true;
          };

          return (0, _index.default)(tree, visitor).then(() => {
            throw new Error('Expected error was not thrown');
          }, err => {
            expect(err).toMatchObject(new Error('Visitor made 💩'));
            expect(actual).toEqual([1, 2, 4]);
          });
        });
      });
    });
  });
  describe('react', () => {
    it('supports portals', () => {
      let Foo = class Foo extends _react.Component {
        getData() {
          return this.props.data;
        }

        render() {
          return 'foo';
        }

      };

      function Baz() {
        return _reactDom.default.createPortal(_react.default.createElement("div", {
          __source: {
            fileName: _jsxFileName,
            lineNumber: 297
          },
          __self: this
        }, _react.default.createElement(Foo, {
          data: 1,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 298
          },
          __self: this
        }), _react.default.createElement(Foo, {
          data: 2,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 299
          },
          __self: this
        })), document.createElement('div'));
      }

      const actual = [];

      const visitor = (element, instance) => {
        if (instance && typeof instance.getData === 'function') {
          const data = instance.getData();
          actual.push(data);
        }
      };

      return (0, _index.default)(_react.default.createElement(Baz, {
        __source: {
          fileName: _jsxFileName,
          lineNumber: 312
        },
        __self: void 0
      }), visitor).then(() => {
        const expected = [1, 2];
        expect(actual).toEqual(expected);
      });
    });
  });
});