Fix issue that broke themes ahmadsoe#142

.eslintrc.js

@@ -17,6 +17,7 @@ module.exports = {
   },
   globals: {
     Highcharts: false,
+    define: false
   },
   rules: {
     'ember/avoid-leaking-state-in-ember-objects': 'off',

addon/components/high-charts.js

@@ -1,12 +1,12 @@
 import { assign } from '@ember/polyfills';
-
 import Component from '@ember/component';
 import { getOwner } from '@ember/application';
-import { set, getProperties, get, computed } from '@ember/object';
+import { set, getProperties, get, computed, getWithDefault } from '@ember/object';
 import { run } from '@ember/runloop';
 import { setDefaultHighChartOptions } from '../utils/option-loader';
 import { getSeriesMap, getSeriesChanges } from '../utils/chart-data';
 import layout from 'ember-highcharts/templates/components/high-charts';
+import merge from 'deepmerge';
 
 /* Map ember-highcharts modes to Highcharts methods
  * https://api.highcharts.com/class-reference/Highcharts.html
@@ -28,7 +28,10 @@ export default Component.extend({
   callback: undefined,
 
   buildOptions: computed('chartOptions', 'content.[]', function() {
-    let chartOptions = assign({}, get(this, 'theme'), get(this, 'chartOptions'));
+    let theme = getWithDefault(this, 'theme', {});
+    let passedChartOptions = getWithDefault(this, 'chartOptions', {});
+
+    let chartOptions = merge(theme, passedChartOptions);
     let chartContent = get(this, 'content');
 
     // if 'no-data-to-display' module has been imported, keep empty series and leave it to highcharts to show no data label.

index.js

@@ -6,6 +6,16 @@ let path = require('path');
 
 module.exports = {
   name: 'ember-highcharts',
+  options: {
+    nodeAssets: {
+      deepmerge: {
+        vendor: {
+          srcDir: 'dist',
+          include: ['umd.js']
+        }
+      }
+    }
+  },
 
   included() {
     this._super.included.apply(this, arguments);
@@ -64,6 +74,9 @@ module.exports = {
         app.import(path.join(highchartsPath, 'modules', moduleFilename));
       }
     }
+
+    app.import('vendor/deepmerge/umd.js');
+    app.import('vendor/shims/deepmerge.js');
   },
 
   treeForVendor(vendorTree) {

package.json

@@ -25,8 +25,10 @@
     "bootstrap": "3.3.7",
     "broccoli-funnel": "^2.0.1",
     "broccoli-merge-trees": "^1.2.0",
+    "deepmerge": "2.1.1",
     "ember-cli-babel": "^6.6.0",
-    "ember-cli-htmlbars": "^2.0.1"
+    "ember-cli-htmlbars": "^2.0.1",
+    "ember-cli-node-assets": "^0.2.2"
   },
   "devDependencies": {
     "broccoli-asset-rev": "^2.4.5",

tests/unit/components/high-charts-test.js

@@ -0,0 +1,99 @@
+import { module, test } from 'qunit';
+import { setupTest } from 'ember-qunit';
+
+module('Unit | Component | high-charts', function(hooks) {
+  setupTest(hooks);
+
+  this.sampleTheme = {
+    colors: ['#058DC7', '#50B432', '#ED561B', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263', '#6AF9C4'],
+    title: {
+      style: {
+        color: '#000',
+        font: 'bold 16px "Trebuchet MS", Verdana, sans-serif'
+      }
+    },
+    subtitle: {
+      style: {
+        color: '#666666',
+        font: 'bold 12px "Trebuchet MS", Verdana, sans-serif'
+      }
+    },
+    legend: {
+      itemStyle: {
+        font: '9pt Trebuchet MS, Verdana, sans-serif',
+        color: 'black'
+      },
+      itemHoverStyle: {
+        color: 'gray'
+      }
+    }
+  };
+
+  this.postMergeOptions = {
+    colors: [
+      '#058DC7',
+      '#50B432',
+      '#ED561B',
+      '#DDDF00',
+      '#24CBE5',
+      '#64E572',
+      '#FF9655',
+      '#FFF263',
+      '#6AF9C4',
+      '#000000',
+      '#FFFFFF'
+    ],
+    title: {
+      style: {
+        color: '#FF00FF',
+        font: 'bold 16px "Trebuchet MS", Verdana, sans-serif',
+        fontWeight: 'bold'
+      }
+    },
+    series: [
+      {
+        color: '#aaaaaa',
+        data: 0,
+        id: 'noData'
+      }
+    ],
+    subtitle: {
+      style: {
+        color: '#666666',
+        font: 'bold 12px "Trebuchet MS", Verdana, sans-serif'
+      }
+    },
+    legend: {
+      itemStyle: {
+        font: '9pt Trebuchet MS, Verdana, sans-serif',
+        color: 'black'
+      },
+      itemHoverStyle: {
+        color: 'blue'
+      }
+    }
+  };
+
+  test('it merges the theme and chartOptions correctly', function(assert) {
+    let component = this.owner.factoryFor('component:high-charts').create({
+      content: [],
+      theme: this.sampleTheme,
+      chartOptions: {
+        colors: ['#000000', '#FFFFFF'],
+        title: {
+          style: {
+            color: '#FF00FF',
+            fontWeight: 'bold'
+          }
+        },
+        legend: {
+          itemHoverStyle: {
+            color: 'blue'
+          }
+        }
+      }
+    });
+    let mergedChartOptions = component.get('buildOptions');
+    assert.deepEqual(mergedChartOptions, this.postMergeOptions);
+  });
+});

vendor/shims/deepmerge.js

@@ -0,0 +1,13 @@
+(function() {
+  function vendorModule() {
+    'use strict';
+
+    return {
+    /* eslint-disable-next-line dot-notation */
+      'default': self['deepmerge'],
+      __esModule: true
+    };
+  }
+
+  define('deepmerge', [], vendorModule);
+})();

yarn.lock

@@ -1311,7 +1311,7 @@ broccoli-lint-eslint@^4.2.1:
     lodash.defaultsdeep "^4.6.0"
     md5-hex "^2.0.0"
 
-broccoli-merge-trees@^1.0.0, broccoli-merge-trees@^1.2.0:
+broccoli-merge-trees@^1.0.0, broccoli-merge-trees@^1.1.1, broccoli-merge-trees@^1.2.0:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/broccoli-merge-trees/-/broccoli-merge-trees-1.2.4.tgz#a001519bb5067f06589d91afa2942445a2d0fdb5"
   dependencies:
@@ -2030,6 +2030,10 @@ deep-is@~0.1.3:
   version "0.1.3"
   resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.3.tgz#b369d6fb5dbc13eecf524f91b070feedc357cf34"
 
+[email protected]:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-2.1.1.tgz#e862b4e45ea0555072bf51e7fd0d9845170ae768"
+
 defaults@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/defaults/-/defaults-1.0.3.tgz#c656051e9817d9ff08ed881477f3fe4019f3ef7d"
@@ -2286,6 +2290,17 @@ ember-cli-lodash-subset@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/ember-cli-lodash-subset/-/ember-cli-lodash-subset-2.0.1.tgz#20cb68a790fe0fde2488ddfd8efbb7df6fe766f2"
 
+ember-cli-node-assets@^0.2.2:
+  version "0.2.2"
+  resolved "https://registry.yarnpkg.com/ember-cli-node-assets/-/ember-cli-node-assets-0.2.2.tgz#d2d55626e7cc6619f882d7fe55751f9266022708"
+  dependencies:
+    broccoli-funnel "^1.0.1"
+    broccoli-merge-trees "^1.1.1"
+    broccoli-source "^1.1.0"
+    debug "^2.2.0"
+    lodash "^4.5.1"
+    resolve "^1.1.7"
+
 ember-cli-normalize-entity-name@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/ember-cli-normalize-entity-name/-/ember-cli-normalize-entity-name-1.0.0.tgz#0b14f7bcbc599aa117b5fddc81e4fd03c4bad5b7"
@@ -3576,8 +3591,8 @@ heimdalljs@^0.2.0, heimdalljs@^0.2.1, heimdalljs@^0.2.3:
     rsvp "~3.2.1"
 
 highcharts@^5.0.12:
-  version "5.0.12"
-  resolved "https://registry.yarnpkg.com/highcharts/-/highcharts-5.0.12.tgz#f73b970fe5c7f04100220b64aa7bd7fb019d11e2"
+  version "5.0.15"
+  resolved "https://registry.yarnpkg.com/highcharts/-/highcharts-5.0.15.tgz#a9af11538a85b85f300e66f7a0e048a7ef8ab381"
 
 [email protected]:
   version "2.16.3"
@@ -4379,6 +4394,10 @@ lodash@^4.14.0, lodash@^4.17.4, lodash@^4.3.0, lodash@^4.6.1:
   version "4.17.5"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.5.tgz#99a92d65c0272debe8c96b6057bc8fbfa3bed511"
 
+lodash@^4.5.1:
+  version "4.17.10"
+  resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.10.tgz#1b7793cf7259ea38fb3661d4d38b3260af8ae4e7"
+
 log-symbols@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/log-symbols/-/log-symbols-2.2.0.tgz#5740e1c5d6f0dfda4ad9323b5332107ef6b4c40a"
@@ -5524,6 +5543,12 @@ resolve@^1.1.2, resolve@^1.1.6, resolve@^1.3.0, resolve@^1.3.3, resolve@^1.5.0:
   dependencies:
     path-parse "^1.0.5"
 
+resolve@^1.1.7:
+  version "1.8.1"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.8.1.tgz#82f1ec19a423ac1fbd080b0bab06ba36e84a7a26"
+  dependencies:
+    path-parse "^1.0.5"
+
 [email protected]:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/responselike/-/responselike-1.0.2.tgz#918720ef3b631c5642be068f15ade5a46f4ba1e7"