From a24ae6acc5aa23f8ce6220817a675b13bb5f45f4 Mon Sep 17 00:00:00 2001 From: Kyle Nathan Date: Mon, 9 Jan 2017 12:38:52 +0000 Subject: [PATCH] Pass card options to card/atom components --- .../components/mobiledoc-editor/component.js | 8 +++- .../components/mobiledoc-editor/template.hbs | 2 + .../mobiledoc-editor/component-test.js | 46 ++++++++++++++++++- 3 files changed, 53 insertions(+), 3 deletions(-) diff --git a/addon/components/mobiledoc-editor/component.js b/addon/components/mobiledoc-editor/component.js index 6698956..614b1df 100644 --- a/addon/components/mobiledoc-editor/component.js +++ b/addon/components/mobiledoc-editor/component.js @@ -56,6 +56,7 @@ export default Component.extend({ placeholder: this.get('placeholder'), spellcheck: this.get('spellcheck'), autofocus: this.get('autofocus'), + cardOptions: this.get('cardOptions'), cards: this.get('cards') || [], atoms: this.get('atoms') || [] }, options); @@ -159,8 +160,10 @@ export default Component.extend({ // Create a new editor. let editorOptions = this.get('editorOptions'); editorOptions.mobiledoc = mobiledoc; - editorOptions.cardOptions = { + let componentHooks = { [ADD_CARD_HOOK]: ({env, options, payload}, isEditing=false) => { + + console.log('options:', options); let cardId = Ember.uuid(); let cardName = env.name; if (isEditing) { @@ -178,6 +181,7 @@ export default Component.extend({ cardName, payload, env, + options, editor, postModel: env.postModel }); @@ -202,6 +206,7 @@ export default Component.extend({ payload, value, callbacks: env, + options, editor, postModel: env.postModel }); @@ -217,6 +222,7 @@ export default Component.extend({ this.get('componentAtoms').removeObject(atom); } }; + editorOptions.cardOptions = assign(componentHooks, editorOptions.cardOptions); editor = new Editor(editorOptions); editor.willRender(() => { // The editor's render/rerender will happen after this `editor.willRender`, diff --git a/addon/components/mobiledoc-editor/template.hbs b/addon/components/mobiledoc-editor/template.hbs index c4f684a..b5a3078 100644 --- a/addon/components/mobiledoc-editor/template.hbs +++ b/addon/components/mobiledoc-editor/template.hbs @@ -33,6 +33,7 @@ payload=card.payload data=card.payload env=card.env + options=card.options editCard=(action card.env.edit) saveCard=(action card.env.save) cancelCard=(action card.env.cancel) @@ -48,6 +49,7 @@ atomName=atom.atomName payload=atom.payload value=atom.value + options=atom.options saveAtom=(action atom.callbacks.save) }} {{/ember-wormhole}} diff --git a/tests/integration/components/mobiledoc-editor/component-test.js b/tests/integration/components/mobiledoc-editor/component-test.js index 13a1088..08b193e 100644 --- a/tests/integration/components/mobiledoc-editor/component-test.js +++ b/tests/integration/components/mobiledoc-editor/component-test.js @@ -16,9 +16,9 @@ import wait from 'ember-test-helpers/wait'; let { Component } = Ember; -const COMPONENT_CARD_EXPECTED_PROPS = ['env', 'editCard', 'saveCard', 'cancelCard', 'removeCard', 'postModel']; +const COMPONENT_CARD_EXPECTED_PROPS = ['env', 'editCard', 'saveCard', 'cancelCard', 'removeCard', 'postModel', 'options']; -const COMPONENT_ATOM_EXPECTED_PROPS = ['saveAtom']; +const COMPONENT_ATOM_EXPECTED_PROPS = ['saveAtom', 'options']; moduleForComponent('mobiledoc-editor', 'Integration | Component | mobiledoc editor', { integration: true, @@ -579,6 +579,48 @@ test(`sets ${COMPONENT_CARD_EXPECTED_PROPS.join(',')} properties on card compone `); }); +test(`passes options through to card components`, function(assert) { + + let cardOptions = { + foo: 'bar' + }; + let Component = Ember.Component.extend({ + didInsertElement() { + assert.equal(this.get('options.foo'), 'bar', `options property has been passed`); + } + }); + let card = this.registerCardComponent('demo-card', hbs`
`, Component); + this.set('cards', [card]); + this.set('mobiledoc', mobiledocWithCard('demo-card')); + this.set('cardOptions', cardOptions); + + this.render(hbs` + {{#mobiledoc-editor mobiledoc=mobiledoc cards=cards cardOptions=cardOptions as |editor|}} + {{/mobiledoc-editor}} + `); +}); + +test(`passes options through to atom components`, function(assert) { + + let cardOptions = { + foo: 'bar' + }; + let Component = Ember.Component.extend({ + didInsertElement() { + assert.equal(this.get('options.foo'), 'bar', `options property has been passed`); + } + }); + let atom = this.registerAtomComponent('demo-atom', hbs`I AM AN ATOM`, Component); + this.set('atoms', [atom]); + this.set('mobiledoc', mobiledocWithAtom('demo-atom')); + this.set('cardOptions', cardOptions); + + this.render(hbs` + {{#mobiledoc-editor mobiledoc=mobiledoc atoms=atoms cardOptions=cardOptions as |editor|}} + {{/mobiledoc-editor}} + `); +}); + test('component card `env` property exposes `isInEditor`', function(assert) { assert.expect(1);