fix(oui-datagrid): fix empty cells when loading data (#348)

Author: euhmeuh

packages/oui-datagrid/src/datagrid.html

@@ -65,6 +65,7 @@
                                 column="column"
                                 index="rowIndex">
                             </oui-datagrid-cell>
+                            <oui-skeleton ng-if="row && row.$promise && !$ctrl.hasProperty(row, column.name)"></oui-skeleton>
                         </td>
                         <td ng-if="$ctrl.hasActionMenu || $ctrl.customizable"
                             class="oui-datagrid__cell oui-datagrid__cell-sticky">

packages/oui-datagrid/src/index.spec.js

@@ -115,7 +115,7 @@ describe("ouiDatagrid", () => {
                 expect(getCell($firstRow, 2).children().html()).toBe(additionnalDataValue);
             }));
 
-            it("should keep undefined when a cell is not loaded", inject(($q) => {
+            it("should display a skeleton when a cell is not loaded", inject(($q) => {
                 const deferred = $q.defer();
                 const loadRowSpy = jasmine.createSpy("loadRow");
 
@@ -138,7 +138,7 @@ describe("ouiDatagrid", () => {
                 expect(loadRowSpy.calls.count()).toEqual(1);
 
                 expect(getCell($firstRow, 0).children().html()).toBe(fakeData[0].firstName);
-                expect(getCell($firstRow, 2).children().html()).toBeUndefined();
+                expect(getCell($firstRow, 2).children()[0].tagName.toLowerCase()).toBe("oui-skeleton");
             }));
 
             it("should load data later and display it", inject(($q) => {
@@ -557,7 +557,7 @@ describe("ouiDatagrid", () => {
                 expect(getCell($fifthRow, 1).children().html()).toBe(fakeData[4].lastName);
             });
 
-            it("should keep undefined when a cell is not loaded", inject(($q) => {
+            it("should display a skeleton when a cell is not loaded", inject(($q) => {
                 const deferred = $q.defer();
                 const loadRowSpy = jasmine.createSpy("loadRow");
 
@@ -590,7 +590,7 @@ describe("ouiDatagrid", () => {
                 expect(loadRowSpy.calls.count()).toEqual(1);
 
                 expect(getCell($firstRow, 0).children().html()).toBe(fakeData[0].firstName);
-                expect(getCell($firstRow, 2).children().html()).toBeUndefined();
+                expect(getCell($firstRow, 2).children()[0].tagName.toLowerCase()).toBe("oui-skeleton");
             }));
 
             it("should load data later and display it", inject(($q) => {