summaryrefslogtreecommitdiff
path: root/thirdparty/preact/test/browser/lifecycle.js
diff options
context:
space:
mode:
Diffstat (limited to 'thirdparty/preact/test/browser/lifecycle.js')
-rw-r--r--thirdparty/preact/test/browser/lifecycle.js495
1 files changed, 0 insertions, 495 deletions
diff --git a/thirdparty/preact/test/browser/lifecycle.js b/thirdparty/preact/test/browser/lifecycle.js
deleted file mode 100644
index 4deb92163..000000000
--- a/thirdparty/preact/test/browser/lifecycle.js
+++ /dev/null
@@ -1,495 +0,0 @@
-import { h, render, rerender, Component } from '../../src/preact';
-/** @jsx h */
-
-let spyAll = obj => Object.keys(obj).forEach( key => sinon.spy(obj,key) );
-
-const EMPTY_CHILDREN = [];
-
-describe('Lifecycle methods', () => {
- let scratch;
-
- before( () => {
- scratch = document.createElement('div');
- (document.body || document.documentElement).appendChild(scratch);
- });
-
- beforeEach( () => {
- scratch.innerHTML = '';
- });
-
- after( () => {
- scratch.parentNode.removeChild(scratch);
- scratch = null;
- });
-
-
- describe('#componentWillUpdate', () => {
- it('should NOT be called on initial render', () => {
- class ReceivePropsComponent extends Component {
- componentWillUpdate() {}
- render() {
- return <div />;
- }
- }
- sinon.spy(ReceivePropsComponent.prototype, 'componentWillUpdate');
- render(<ReceivePropsComponent />, scratch);
- expect(ReceivePropsComponent.prototype.componentWillUpdate).not.to.have.been.called;
- });
-
- it('should be called when rerender with new props from parent', () => {
- let doRender;
- class Outer extends Component {
- constructor(p, c) {
- super(p, c);
- this.state = { i: 0 };
- }
- componentDidMount() {
- doRender = () => this.setState({ i: this.state.i + 1 });
- }
- render(props, { i }) {
- return <Inner i={i} {...props} />;
- }
- }
- class Inner extends Component {
- componentWillUpdate(nextProps, nextState) {
- expect(nextProps).to.be.deep.equal({ children:EMPTY_CHILDREN, i: 1 });
- expect(nextState).to.be.deep.equal({});
- }
- render() {
- return <div />;
- }
- }
- sinon.spy(Inner.prototype, 'componentWillUpdate');
- sinon.spy(Outer.prototype, 'componentDidMount');
-
- // Initial render
- render(<Outer />, scratch);
- expect(Inner.prototype.componentWillUpdate).not.to.have.been.called;
-
- // Rerender inner with new props
- doRender();
- rerender();
- expect(Inner.prototype.componentWillUpdate).to.have.been.called;
- });
-
- it('should be called on new state', () => {
- let doRender;
- class ReceivePropsComponent extends Component {
- componentWillUpdate() {}
- componentDidMount() {
- doRender = () => this.setState({ i: this.state.i + 1 });
- }
- render() {
- return <div />;
- }
- }
- sinon.spy(ReceivePropsComponent.prototype, 'componentWillUpdate');
- render(<ReceivePropsComponent />, scratch);
- expect(ReceivePropsComponent.prototype.componentWillUpdate).not.to.have.been.called;
-
- doRender();
- rerender();
- expect(ReceivePropsComponent.prototype.componentWillUpdate).to.have.been.called;
- });
- });
-
- describe('#componentWillReceiveProps', () => {
- it('should NOT be called on initial render', () => {
- class ReceivePropsComponent extends Component {
- componentWillReceiveProps() {}
- render() {
- return <div />;
- }
- }
- sinon.spy(ReceivePropsComponent.prototype, 'componentWillReceiveProps');
- render(<ReceivePropsComponent />, scratch);
- expect(ReceivePropsComponent.prototype.componentWillReceiveProps).not.to.have.been.called;
- });
-
- it('should be called when rerender with new props from parent', () => {
- let doRender;
- class Outer extends Component {
- constructor(p, c) {
- super(p, c);
- this.state = { i: 0 };
- }
- componentDidMount() {
- doRender = () => this.setState({ i: this.state.i + 1 });
- }
- render(props, { i }) {
- return <Inner i={i} {...props} />;
- }
- }
- class Inner extends Component {
- componentWillMount() {
- expect(this.props.i).to.be.equal(0);
- }
- componentWillReceiveProps(nextProps) {
- expect(nextProps.i).to.be.equal(1);
- }
- render() {
- return <div />;
- }
- }
- sinon.spy(Inner.prototype, 'componentWillReceiveProps');
- sinon.spy(Outer.prototype, 'componentDidMount');
-
- // Initial render
- render(<Outer />, scratch);
- expect(Inner.prototype.componentWillReceiveProps).not.to.have.been.called;
-
- // Rerender inner with new props
- doRender();
- rerender();
- expect(Inner.prototype.componentWillReceiveProps).to.have.been.called;
- });
-
- it('should be called in right execution order', () => {
- let doRender;
- class Outer extends Component {
- constructor(p, c) {
- super(p, c);
- this.state = { i: 0 };
- }
- componentDidMount() {
- doRender = () => this.setState({ i: this.state.i + 1 });
- }
- render(props, { i }) {
- return <Inner i={i} {...props} />;
- }
- }
- class Inner extends Component {
- componentDidUpdate() {
- expect(Inner.prototype.componentWillReceiveProps).to.have.been.called;
- expect(Inner.prototype.componentWillUpdate).to.have.been.called;
- }
- componentWillReceiveProps() {
- expect(Inner.prototype.componentWillUpdate).not.to.have.been.called;
- expect(Inner.prototype.componentDidUpdate).not.to.have.been.called;
- }
- componentWillUpdate() {
- expect(Inner.prototype.componentWillReceiveProps).to.have.been.called;
- expect(Inner.prototype.componentDidUpdate).not.to.have.been.called;
- }
- render() {
- return <div />;
- }
- }
- sinon.spy(Inner.prototype, 'componentWillReceiveProps');
- sinon.spy(Inner.prototype, 'componentDidUpdate');
- sinon.spy(Inner.prototype, 'componentWillUpdate');
- sinon.spy(Outer.prototype, 'componentDidMount');
-
- render(<Outer />, scratch);
- doRender();
- rerender();
-
- expect(Inner.prototype.componentWillReceiveProps).to.have.been.calledBefore(Inner.prototype.componentWillUpdate);
- expect(Inner.prototype.componentWillUpdate).to.have.been.calledBefore(Inner.prototype.componentDidUpdate);
- });
- });
-
-
- let _it = it;
- describe('#constructor and component(Did|Will)(Mount|Unmount)', () => {
- /* global DISABLE_FLAKEY */
- let it = DISABLE_FLAKEY ? xit : _it;
-
- let setState;
- class Outer extends Component {
- constructor(p, c) {
- super(p, c);
- this.state = { show:true };
- setState = s => this.setState(s);
- }
- render(props, { show }) {
- return (
- <div>
- { show && (
- <Inner {...props} />
- ) }
- </div>
- );
- }
- }
-
- class LifecycleTestComponent extends Component {
- constructor(p, c) { super(p, c); this._constructor(); }
- _constructor() {}
- componentWillMount() {}
- componentDidMount() {}
- componentWillUnmount() {}
- componentDidUnmount() {}
- render() { return <div />; }
- }
-
- class Inner extends LifecycleTestComponent {
- render() {
- return (
- <div>
- <InnerMost />
- </div>
- );
- }
- }
-
- class InnerMost extends LifecycleTestComponent {
- render() { return <div />; }
- }
-
- let spies = ['_constructor', 'componentWillMount', 'componentDidMount', 'componentWillUnmount', 'componentDidUnmount'];
-
- let verifyLifycycleMethods = (TestComponent) => {
- let proto = TestComponent.prototype;
- spies.forEach( s => sinon.spy(proto, s) );
- let reset = () => spies.forEach( s => proto[s].reset() );
-
- it('should be invoked for components on initial render', () => {
- reset();
- render(<Outer />, scratch);
- expect(proto._constructor).to.have.been.called;
- expect(proto.componentDidMount).to.have.been.called;
- expect(proto.componentWillMount).to.have.been.calledBefore(proto.componentDidMount);
- expect(proto.componentDidMount).to.have.been.called;
- });
-
- it('should be invoked for components on unmount', () => {
- reset();
- setState({ show:false });
- rerender();
-
- expect(proto.componentDidUnmount).to.have.been.called;
- expect(proto.componentWillUnmount).to.have.been.calledBefore(proto.componentDidUnmount);
- expect(proto.componentDidUnmount).to.have.been.called;
- });
-
- it('should be invoked for components on re-render', () => {
- reset();
- setState({ show:true });
- rerender();
-
- expect(proto._constructor).to.have.been.called;
- expect(proto.componentDidMount).to.have.been.called;
- expect(proto.componentWillMount).to.have.been.calledBefore(proto.componentDidMount);
- expect(proto.componentDidMount).to.have.been.called;
- });
- };
-
- describe('inner components', () => {
- verifyLifycycleMethods(Inner);
- });
-
- describe('innermost components', () => {
- verifyLifycycleMethods(InnerMost);
- });
-
- describe('when shouldComponentUpdate() returns false', () => {
- let setState;
-
- class Outer extends Component {
- constructor() {
- super();
- this.state = { show:true };
- setState = s => this.setState(s);
- }
- render(props, { show }) {
- return (
- <div>
- { show && (
- <div>
- <Inner {...props} />
- </div>
- ) }
- </div>
- );
- }
- }
-
- class Inner extends Component {
- shouldComponentUpdate(){ return false; }
- componentWillMount() {}
- componentDidMount() {}
- componentWillUnmount() {}
- componentDidUnmount() {}
- render() {
- return <div />;
- }
- }
-
- let proto = Inner.prototype;
- let spies = ['componentWillMount', 'componentDidMount', 'componentWillUnmount', 'componentDidUnmount'];
- spies.forEach( s => sinon.spy(proto, s) );
-
- let reset = () => spies.forEach( s => proto[s].reset() );
-
- beforeEach( () => reset() );
-
- it('should be invoke normally on initial mount', () => {
- render(<Outer />, scratch);
- expect(proto.componentWillMount).to.have.been.called;
- expect(proto.componentWillMount).to.have.been.calledBefore(proto.componentDidMount);
- expect(proto.componentDidMount).to.have.been.called;
- });
-
- it('should be invoked normally on unmount', () => {
- setState({ show:false });
- rerender();
-
- expect(proto.componentWillUnmount).to.have.been.called;
- expect(proto.componentWillUnmount).to.have.been.calledBefore(proto.componentDidUnmount);
- expect(proto.componentDidUnmount).to.have.been.called;
- });
-
- it('should still invoke mount for shouldComponentUpdate():false', () => {
- setState({ show:true });
- rerender();
-
- expect(proto.componentWillMount).to.have.been.called;
- expect(proto.componentWillMount).to.have.been.calledBefore(proto.componentDidMount);
- expect(proto.componentDidMount).to.have.been.called;
- });
-
- it('should still invoke unmount for shouldComponentUpdate():false', () => {
- setState({ show:false });
- rerender();
-
- expect(proto.componentWillUnmount).to.have.been.called;
- expect(proto.componentWillUnmount).to.have.been.calledBefore(proto.componentDidUnmount);
- expect(proto.componentDidUnmount).to.have.been.called;
- });
- });
- });
-
- describe('Lifecycle DOM Timing', () => {
- it('should be invoked when dom does (DidMount, WillUnmount) or does not (WillMount, DidUnmount) exist', () => {
- let setState;
- class Outer extends Component {
- constructor() {
- super();
- this.state = { show:true };
- setState = s => {
- this.setState(s);
- this.forceUpdate();
- };
- }
- componentWillMount() {
- expect(document.getElementById('OuterDiv'), 'Outer componentWillMount').to.not.exist;
- }
- componentDidMount() {
- expect(document.getElementById('OuterDiv'), 'Outer componentDidMount').to.exist;
- }
- componentWillUnmount() {
- expect(document.getElementById('OuterDiv'), 'Outer componentWillUnmount').to.exist;
- }
- componentDidUnmount() {
- expect(document.getElementById('OuterDiv'), 'Outer componentDidUnmount').to.not.exist;
- }
- render(props, { show }) {
- return (
- <div id="OuterDiv">
- { show && (
- <div>
- <Inner {...props} />
- </div>
- ) }
- </div>
- );
- }
- }
-
- class Inner extends Component {
- componentWillMount() {
- expect(document.getElementById('InnerDiv'), 'Inner componentWillMount').to.not.exist;
- }
- componentDidMount() {
- expect(document.getElementById('InnerDiv'), 'Inner componentDidMount').to.exist;
- }
- componentWillUnmount() {
- // @TODO Component mounted into elements (non-components)
- // are currently unmounted after those elements, so their
- // DOM is unmounted prior to the method being called.
- //expect(document.getElementById('InnerDiv'), 'Inner componentWillUnmount').to.exist;
- }
- componentDidUnmount() {
- expect(document.getElementById('InnerDiv'), 'Inner componentDidUnmount').to.not.exist;
- }
-
- render() {
- return <div id="InnerDiv" />;
- }
- }
-
- let proto = Inner.prototype;
- let spies = ['componentWillMount', 'componentDidMount', 'componentWillUnmount', 'componentDidUnmount'];
- spies.forEach( s => sinon.spy(proto, s) );
-
- let reset = () => spies.forEach( s => proto[s].reset() );
-
- render(<Outer />, scratch);
- expect(proto.componentWillMount).to.have.been.called;
- expect(proto.componentWillMount).to.have.been.calledBefore(proto.componentDidMount);
- expect(proto.componentDidMount).to.have.been.called;
-
- reset();
- setState({ show:false });
-
- expect(proto.componentWillUnmount).to.have.been.called;
- expect(proto.componentWillUnmount).to.have.been.calledBefore(proto.componentDidUnmount);
- expect(proto.componentDidUnmount).to.have.been.called;
-
- reset();
- setState({ show:true });
-
- expect(proto.componentWillMount).to.have.been.called;
- expect(proto.componentWillMount).to.have.been.calledBefore(proto.componentDidMount);
- expect(proto.componentDidMount).to.have.been.called;
- });
-
- it('should remove this.base for HOC', () => {
- let createComponent = (name, fn) => {
- class C extends Component {
- componentWillUnmount() {
- expect(this.base, `${name}.componentWillUnmount`).to.exist;
- }
- componentDidUnmount() {
- expect(this.base, `${name}.componentDidUnmount`).not.to.exist;
- }
- render(props) { return fn(props); }
- }
- spyAll(C.prototype);
- return C;
- };
-
- class Wrapper extends Component {
- render({ children }) {
- return <div class="wrapper">{children}</div>;
- }
- }
-
- let One = createComponent('One', () => <Wrapper>one</Wrapper> );
- let Two = createComponent('Two', () => <Wrapper>two</Wrapper> );
- let Three = createComponent('Three', () => <Wrapper>three</Wrapper> );
-
- let components = [One, Two, Three];
-
- let Selector = createComponent('Selector', ({ page }) => {
- let Child = components[page];
- return <Child />;
- });
-
- class App extends Component {
- render(_, { page }) {
- return <Selector page={page} />;
- }
- }
-
- let app;
- render(<App ref={ c => app=c } />, scratch);
-
- for (let i=0; i<20; i++) {
- app.setState({ page: i%components.length });
- app.forceUpdate();
- }
- });
- });
-});