Improves test suite

addon/components/h-o-t/grid.js

@@ -1,26 +1,24 @@
 import Component from '@glimmer/component';
+import { inject as service } from '@ember/service';
 import { getOwner } from '@ember/application';
 import { assign } from '@ember/polyfills';
 import { guidFor } from '@ember/object/internals';
 import { scheduleOnce } from '@ember/runloop';
 
 const NAMESPACE = 'hot-table-';
+const SERVICE = 'ember-handsontable/-private/hot-grid';
 
 export default class HOTGridComponent extends Component {
+  @service(SERVICE) grid;
+
   options = this.args.options || {};
 
   constructor() {
     super(...arguments);
 
     this.id = `${NAMESPACE}${guidFor(this)}`;
 
-    scheduleOnce('afterRender', this, this._initializeGrid);
-  }
-
-  _fetchHandsonTable() {
-    return import('handsontable')
-      .then((module) => module.default)
-      .then((Handsontable) => Handsontable);
+    scheduleOnce('afterRender', this, this.initializeGrid);
   }
 
   _mergeConfigs() {
@@ -34,17 +32,17 @@ export default class HOTGridComponent extends Component {
     );
   }
 
-  _initializeGrid() {
-    this._fetchHandsonTable().then((Handsontable) => {
-      const container = document.getElementById(this.id);
-
-      const HOTable = new Handsontable(container, this._mergeConfigs());
-
-      this.onInit(HOTable);
-    });
+  async initializeGrid() {
+    let Handsontable = await this.grid.load();
+
+    const container = document.getElementById(this.id);
+
+    const HOTable = new Handsontable(container, this._mergeConfigs());
+
+    return this.onInit(HOTable);
   }
 
   onInit() {
-    // NO-OP
+    this.args.onInit && this.args.onInit(...arguments);
   }
 }

addon/services/ember-handsontable/-private/hot-grid.js

@@ -0,0 +1,9 @@
+import Service from '@ember/service';
+
+export default class EmberHandsontablePrivateHotGridService extends Service {
+  async load() {
+    let Handsontable = (await import('handsontable')).default;
+
+    return Handsontable;
+  }
+}

app/services/ember-handsontable/-private/hot-grid.js

@@ -0,0 +1 @@
+export { default } from 'ember-handsontable/services/ember-handsontable/-private/hot-grid';

config/ember-try.js

@@ -4,15 +4,8 @@ const getChannelURL = require('ember-source-channel-url');
 
 module.exports = async function() {
   return {
+    useYarn: true,
     scenarios: [
-      {
-        name: 'ember-lts-3.12',
-        npm: {
-          devDependencies: {
-            'ember-source': '~3.12.0'
-          }
-        }
-      },
       {
         name: 'ember-lts-3.16',
         npm: {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ember-handsontable",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "description": "The default blueprint for ember-cli addons.",
   "keywords": [
     "ember-addon",
@@ -40,6 +40,7 @@
     "ember-cli": "~3.17.0",
     "ember-cli-addon-docs": "^0.6.16",
     "ember-cli-addon-docs-esdoc": "^0.2.3",
+    "ember-cli-code-coverage": "1.0.0-beta.9",
     "ember-cli-dependency-checker": "^3.2.0",
     "ember-cli-deploy": "^1.0.2",
     "ember-cli-deploy-build": "^2.0.0",

tests/integration/components/h-o-t/grid-test.js

@@ -6,21 +6,80 @@ import { hbs } from 'ember-cli-htmlbars';
 module('Integration | Component | h-o-t/grid', function(hooks) {
   setupRenderingTest(hooks);
 
-  test('it renders', async function(assert) {
-    // Set any properties with this.set('myProperty', 'value');
-    // Handle any actions with this.set('myAction', function(val) { ... });
+  hooks.beforeEach(async function() {
+    await this.owner.lookup('service:ember-handsontable/-private/hot-grid').load();
+  });
+
+  test('it renders without options', async function(assert) {
+    assert.expect(2);
+
+    this.data = [
+      ['', 'Ford', 'Tesla', 'Toyota', 'Honda'],
+      ['2017', 10, 11, 12, 13],
+      ['2018', 20, 11, 14, 13],
+      ['2019', 30, 15, 12, 13]
+    ];
+
+    await render(hbs`<HOT::Grid 
+      @data={{this.data}}
+    />`);
+
+    assert.equal(this.element.querySelectorAll('.ht_master .htCore thead tr').length, 0);
+    assert.equal(this.element.querySelectorAll('.ht_master .htCore tbody tr').length, 4);
+  });
+
+  test('it renders basic component', async function(assert) {
+    assert.expect(3);
+
+    this.data = [
+      ['', 'Ford', 'Tesla', 'Toyota', 'Honda'],
+      ['2017', 10, 11, 12, 13],
+      ['2018', 20, 11, 14, 13],
+      ['2019', 30, 15, 12, 13]
+    ];
+
+    await render(hbs`<HOT::Grid 
+      @data={{this.data}}
+      @options={{hash
+        rowHeaders=true
+        colHeaders=true
+        filters=true
+        dropdownMenu=true
+      }}
+    />`);
+
+    assert.equal(this.element.querySelectorAll('.ht_master .htCore thead tr').length, 1);
+    assert.equal(this.element.querySelectorAll('.ht_master .htCore thead th').length, 6);
+    assert.equal(this.element.querySelectorAll('.ht_master .htCore tbody tr').length, 4);
+  });
+
+  test('it fires onInit after render with the right args', async function(assert) {
+    assert.expect(4);
 
-    await render(hbs`<HOT::Grid />`);
+    this.data = [
+      ['', 'Ford', 'Tesla', 'Toyota', 'Honda'],
+      ['2017', 10, 11, 12, 13],
+      ['2018', 20, 11, 14, 13],
+      ['2019', 30, 15, 12, 13]
+    ];
 
-    assert.equal(this.element.textContent.trim(), '');
+    this.onInit = (HandsontableInstance) => {
+      assert.ok(HandsontableInstance, 'Arguments');
+    };
 
-    // Template block usage:
-    await render(hbs`
-      <HOT::Grid>
-        template block text
-      </HOT::Grid>
-    `);
+    await render(hbs`<HOT::Grid 
+      @data={{this.data}}
+      @options={{hash
+        rowHeaders=true
+        colHeaders=true
+        filters=true
+        dropdownMenu=true
+      }}
+      @onInit={{this.onInit}}
+    />`);
 
-    assert.equal(this.element.textContent.trim(), 'template block text');
+    assert.equal(this.element.querySelectorAll('.ht_master .htCore thead tr').length, 1);
+    assert.equal(this.element.querySelectorAll('.ht_master .htCore thead th').length, 6);
+    assert.equal(this.element.querySelectorAll('.ht_master .htCore tbody tr').length, 4);
   });
 });

tests/unit/services/ember-handsontable/-private/hot-grid-test.js

@@ -0,0 +1,14 @@
+import { module, test } from 'qunit';
+import { setupTest } from 'ember-qunit';
+
+module('Unit | Service | ember-handsontable/-private/hot-grid', function(hooks) {
+  setupTest(hooks);
+
+  test('it loads handsontable plugin', async function(assert) {
+    let service = this.owner.lookup('service:ember-handsontable/-private/hot-grid');
+
+    assert.ok(service);
+
+    await assert.ok(service.load());
+  });
+});