diff --git a/src/dom_components/index.js b/src/dom_components/index.js index 0914fb58f..c84172984 100644 --- a/src/dom_components/index.js +++ b/src/dom_components/index.js @@ -516,11 +516,25 @@ module.exports = () => { * @return {this} */ addType(type, methods) { + const { + model = {}, + view = {}, + isComponent, + extend, + extendView + } = methods; const compType = this.getType(type); - const typeToExtend = compType ? compType : this.getType('default'); + const extendType = this.getType(extend); + const extendViewType = this.getType(extendView); + const typeToExtend = extendType + ? extendType + : compType + ? compType + : this.getType('default'); const modelToExt = typeToExtend.model; - const viewToExt = typeToExtend.view; - const { model = {}, view = {}, isComponent } = methods; + const viewToExt = extendViewType + ? extendViewType.view + : typeToExtend.view; // If the model/view is a simple object I need to extend it if (typeof model === 'object') { diff --git a/test/specs/dom_components/index.js b/test/specs/dom_components/index.js index 640c3638f..cfabd6b02 100644 --- a/test/specs/dom_components/index.js +++ b/test/specs/dom_components/index.js @@ -205,6 +205,47 @@ describe('DOM Components', () => { expect(comp.get('type')).toEqual(id); expect(comp.getAttributes()['test-prop']).toEqual(testProp); }); + + test('Extend component type with custom model and view', () => { + obj = em.get('DomComponents'); + const id = 'text'; + const testProp = 'testValue'; + const testText = 'Some text'; + const initialTypes = obj.getTypes().length; + obj.addType('text', { + model: { + defaults: { + testProp + } + }, + view: { + onRender() { + this.el.style.backgroundColor = 'red'; + } + } + }); + expect(obj.getTypes().length).toBe(initialTypes); + obj.addComponent(`