Merge pull request #14 from dortort/chart-options-observer

observe changes to options, fix merge with defaultOptions issue

addon/components/google-chart.js

@@ -1,6 +1,6 @@
 import Ember from 'ember';
 
-const { assert, computed, on, run } = Ember;
+const { assert, computed, observer, on, run, $ } = Ember;
 
 export default Ember.Component.extend({
 
@@ -33,7 +33,7 @@ export default Ember.Component.extend({
   }),
 
   mergedOptions: computed('defaultOptions', 'options', function() {
-    return Ember.merge(this.get('defaultOptions'), this.get('options'));
+    return $.extend({}, this.get('defaultOptions'), this.get('options'));
   }),
 
   /* Methods */
@@ -53,7 +53,7 @@ export default Ember.Component.extend({
 
   /* TODO - Remove observer in favor of component lifecycle hooks */
 
-  rerenderChart: Ember.observer('data', function() {
+  rerenderChart: observer('data', 'mergedOptions', function() {
     const chart = this.get('chart');
 
     if (chart && this.get('data')) {

bower.json

@@ -9,7 +9,7 @@
     "ember-qunit": "0.4.9",
     "ember-qunit-notifications": "0.0.7",
     "ember-resolver": "~0.1.18",
-    "jquery": "^1.11.3",
+    "jquery": "1.11.3",
     "loader.js": "ember-cli/loader.js#3.2.1",
     "qunit": "~1.18.0",
     "hammerjs": "~2.0.4",

tests/integration/components/options-change-test.js

@@ -0,0 +1,51 @@
+import Ember from 'ember';
+import { moduleForComponent, test } from 'ember-qunit';
+import hbs from 'htmlbars-inline-precompile';
+
+const { run: { later } } = Ember;
+
+const data = [
+  ['Year', 'Sales', 'Expenses'],
+  ['2004', 1000, 400],
+  ['2005', 1170, 460],
+  ['2006', 660, 1120],
+  ['2007', 1030, 540],
+];
+
+moduleForComponent('line-chart', 'Integration | Component | chart options change', {
+  integration: true,
+});
+
+test('Changing options and rerender', function(assert) {
+  assert.expect(2);
+
+  const done = assert.async();
+
+  const title = 'Some legit title';
+
+  this.setProperties({
+    data,
+    options: { title },
+  });
+
+  this.render(hbs`{{line-chart data=data options=options chartDidRender='chartDidRender'}}`);
+
+  this.on('chartDidRender', () => {
+
+    later(() => {
+      assert.ok(this.$('div').html().indexOf(title) > -1, 'The component should have a title');
+
+      this.set('options', {});
+
+      later(() => {
+        assert.ok(this.$('div').html().indexOf(title) === -1, 'The component should no longer have a title');
+
+        done();
+
+      }, 100);
+
+    }, 500);
+
+  });
+
+});