Finalize lifecycle methods

[phillipskevin]

Lifecycle methods

Called by connectedCallback; implemented by CanJS mixins; can be called by user (for testing); if implemented by user, must call super.<method>(); each method calls all the previous methods if they have not been called (passing props); Once called, each method is a no-op if called again.

• initialize(props)
• render(props)
• connect(props)

Called by disconnectedCallback; implemented by CanJS mixins; can be called by user (for testing); if implemented by user, must call super.<method>(); Once called, method is a no-op if called again.

• disconnect

Lifecycle hooks

Called by connect; can be implemented by user without having to call super.<method>().

• connected

Called by disconnect; can be implemented by user without having to call super.<method>().

• disconnected

Example

class MyElement extends StacheDefineElement {}
const myElement = new MyElement();

// can call lifecycle methods for testing
myElement.initialize(); // "ViewModel" ready to be tested
myElement.render(); // view ready to be tested

// can implement lifecycle methods
class MyElement2 extends StacheDefineElement {
    connected() {
        let timeoutId = setTimeout(() => {}, 1000);
        return () => { clearTimeout(timeoutId); };
    }
}

const myElement2 = new MyElement();
myElement2.connect(); // can test the view