Repository URL to install this package:
|
Version:
1.2.8 ▾
|
"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);
});
});
});
});