Merge branch 'compwright-master' into develop

README.md

@@ -17,6 +17,12 @@ Include the library files:
 <script src="dist/ngHandsontable.js"></script>
 ```
 
+Include component to your app:
+
+```js
+angular.module('my-app', ['ngHandsontable']);
+```
+
 Template:
 
 ```html

dist/ngHandsontable.js

@@ -5,7 +5,7 @@
  * Copyright 2015 Handsoncode sp. z o.o. <[email protected]>
  * Licensed under the MIT license.
  * https://github.com/handsontable/ngHandsontable
- * Date: Thu Mar 03 2016 16:35:01 GMT+0100 (CET)
+ * Date: Wed Apr 06 2016 14:44:50 GMT-0400 (EDT)
 */
 
 if (document.all && !document.addEventListener) { // IE 8 and lower
@@ -132,6 +132,7 @@ Handsontable.hooks.add('afterContextMenuShow', function() {
           hot;
 
         container.className = this.containerClassName;
+        container.id = htSettings.hotId;
         element[0].appendChild(container);
         hot = new Handsontable(container, htSettings);
 

src/services/settingFactory.js

@@ -31,6 +31,10 @@
           hot;
 
         container.className = this.containerClassName;
+
+        if (!container.id && htSettings.hotId) {
+          container.id = htSettings.hotId;
+        }
         element[0].appendChild(container);
         hot = new Handsontable(container, htSettings);
 

test/services/settingFactory.spec.js

@@ -11,6 +11,7 @@ describe('settingFactory', function() {
     var element = [{appendChild: jasmine.createSpy('appendChild')}];
     var hotSettings = {colHeaders: [1, 2], width: 200, columns: [{width: 100}]};
     var hotInstance = {};
+
     window.HandsontableOrg = Handsontable;
     window.Handsontable = function(element, settings) {
       hotInstance.element = element;
@@ -27,6 +28,26 @@ describe('settingFactory', function() {
     window.Handsontable = HandsontableOrg;
   }));
 
+  it('should create new div element with "id" defined from hot-id attribute', inject(function(settingFactory) {
+    var element = [{appendChild: jasmine.createSpy('appendChild')}];
+    var hotSettings = {hotId: 'my-table', colHeaders: [1, 2], width: 200, columns: [{width: 100}]};
+    var hotInstance = {};
+
+    window.HandsontableOrg = Handsontable;
+    window.Handsontable = function(element, settings) {
+      hotInstance.element = element;
+      hotInstance.settings = settings;
+    };
+
+    settingFactory.initializeHandsontable(element, hotSettings);
+
+    expect(element[0].appendChild).toHaveBeenCalled();
+    expect(element[0].appendChild.calls.argsFor(0)[0].nodeName).toBe('DIV');
+    expect(hotInstance.element.id).toBe('my-table');
+
+    window.Handsontable = HandsontableOrg;
+  }));
+
   it('should update Handsontable settings (updateHandsontableSettings)', inject(function(settingFactory) {
     var hotInstance = {updateSettings: jasmine.createSpy('updateSettings')};
     var hotSettings = {colHeaders: [1, 2], width: 200, columns: [{width: 100}]};