@king-design/intact 2.1.3 → 2.1.4

package/es/components/table/index.spec.js

@@ -31,1147 +31,943 @@ describe('Table', function () {
   });
   it('check & uncheck', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
     var _mount, instance, element, table, checked, spy, spyCheckRow, spyUncheckRow, spyCheckAll, spyUncheckAll, _element$querySelecto, tr1, tr2, all;
-
     return _regeneratorRuntime.wrap(function _callee$(_context) {
-      while (1) {
-        switch (_context.prev = _context.next) {
-          case 0:
-            _mount = mount(BasicDemo), instance = _mount[0], element = _mount[1];
-            table = instance.$lastInput.children;
-            checked = table.checked; // bind $change:checked event
-
-            spy = sinon.spy(function (v) {
-              return console.log(v);
-            });
-            table.on('$change:checkedKeys', spy);
-            spyCheckRow = sinon.spy(function (data, index, key) {
-              return console.log('checkRow', data, index, key);
-            });
-            table.on('checkRow', spyCheckRow);
-            spyUncheckRow = sinon.spy(function (data, index, key) {
-              return console.log('uncheckRow', data, index, key);
-            });
-            table.on('uncheckRow', spyUncheckRow);
-            spyCheckAll = sinon.spy(function () {
-              return console.log('checkAll');
-            });
-            table.on('checkAll', spyCheckAll);
-            spyUncheckAll = sinon.spy(function () {
-              return console.log('uncheckAll');
-            });
-            table.on('uncheckAll', spyUncheckAll); // click row
-
-            _element$querySelecto = element.querySelectorAll('tbody tr'), tr1 = _element$querySelecto[0], tr2 = _element$querySelecto[1];
-            tr1.click();
-            _context.next = 17;
-            return wait();
-
-          case 17:
-            expect(table.get('checkedKeys')).to.eql([0]);
-            expect(spyCheckRow.callCount).to.eql(1);
-            tr2.click();
-            _context.next = 22;
-            return wait();
-
-          case 22:
-            expect(table.get('checkedKeys')).to.eql([0, 1]);
-            expect(checked.getAllCheckedStatus()).eql(AllCheckedStatus.All);
-            expect(spyCheckRow.callCount).to.eql(2);
-            expect(spyCheckAll.callCount).to.eq(0);
-            tr1.click();
-            _context.next = 29;
-            return wait();
-
-          case 29:
-            expect(table.get('checkedKeys')).to.eql([1]);
-            expect(checked.getAllCheckedStatus()).eql(AllCheckedStatus.Indeterminate);
-            expect(spyUncheckRow.callCount).to.eql(1);
-            all = element.querySelector('.k-checkbox');
-            all.click();
-            _context.next = 36;
-            return wait();
-
-          case 36:
-            expect(checked.getAllCheckedStatus()).eql(AllCheckedStatus.All);
-            expect(spyCheckAll.callCount).to.eql(1);
-            all.click();
-            _context.next = 41;
-            return wait();
-
-          case 41:
-            expect(checked.getAllCheckedStatus()).eql(AllCheckedStatus.None);
-            expect(table.get('checkedKeys')).to.eql([]);
-            expect(spyUncheckAll.callCount).to.eql(1);
-            expect(spy.callCount).to.eql(5); // clear data of table should only trigger $change:checked event once, #407
-
-            all.click();
-            instance.set('data', []);
-            _context.next = 49;
-            return wait();
-
-          case 49:
-            expect(spy.callCount).to.eql(7);
-
-          case 50:
-          case "end":
-            return _context.stop();
-        }
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          _mount = mount(BasicDemo), instance = _mount[0], element = _mount[1];
+          table = instance.$lastInput.children;
+          checked = table.checked; // bind $change:checked event
+          spy = sinon.spy(function (v) {
+            return console.log(v);
+          });
+          table.on('$change:checkedKeys', spy);
+          spyCheckRow = sinon.spy(function (data, index, key) {
+            return console.log('checkRow', data, index, key);
+          });
+          table.on('checkRow', spyCheckRow);
+          spyUncheckRow = sinon.spy(function (data, index, key) {
+            return console.log('uncheckRow', data, index, key);
+          });
+          table.on('uncheckRow', spyUncheckRow);
+          spyCheckAll = sinon.spy(function () {
+            return console.log('checkAll');
+          });
+          table.on('checkAll', spyCheckAll);
+          spyUncheckAll = sinon.spy(function () {
+            return console.log('uncheckAll');
+          });
+          table.on('uncheckAll', spyUncheckAll);
+          // click row
+          _element$querySelecto = element.querySelectorAll('tbody tr'), tr1 = _element$querySelecto[0], tr2 = _element$querySelecto[1];
+          tr1.click();
+          _context.next = 17;
+          return wait();
+        case 17:
+          expect(table.get('checkedKeys')).to.eql([0]);
+          expect(spyCheckRow.callCount).to.eql(1);
+          tr2.click();
+          _context.next = 22;
+          return wait();
+        case 22:
+          expect(table.get('checkedKeys')).to.eql([0, 1]);
+          expect(checked.getAllCheckedStatus()).eql(AllCheckedStatus.All);
+          expect(spyCheckRow.callCount).to.eql(2);
+          expect(spyCheckAll.callCount).to.eq(0);
+          tr1.click();
+          _context.next = 29;
+          return wait();
+        case 29:
+          expect(table.get('checkedKeys')).to.eql([1]);
+          expect(checked.getAllCheckedStatus()).eql(AllCheckedStatus.Indeterminate);
+          expect(spyUncheckRow.callCount).to.eql(1);
+          all = element.querySelector('.k-checkbox');
+          all.click();
+          _context.next = 36;
+          return wait();
+        case 36:
+          expect(checked.getAllCheckedStatus()).eql(AllCheckedStatus.All);
+          expect(spyCheckAll.callCount).to.eql(1);
+          all.click();
+          _context.next = 41;
+          return wait();
+        case 41:
+          expect(checked.getAllCheckedStatus()).eql(AllCheckedStatus.None);
+          expect(table.get('checkedKeys')).to.eql([]);
+          expect(spyUncheckAll.callCount).to.eql(1);
+          expect(spy.callCount).to.eql(5);
+          // clear data of table should only trigger $change:checked event once, #407
+          all.click();
+          instance.set('data', []);
+          _context.next = 49;
+          return wait();
+        case 49:
+          expect(spy.callCount).to.eql(7);
+        case 50:
+        case "end":
+          return _context.stop();
       }
     }, _callee);
   })));
   it('click row of radio table', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
     var _mount2, instance, element, table, _element$querySelecto2, tr1, tr2;
-
     return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-      while (1) {
-        switch (_context2.prev = _context2.next) {
-          case 0:
-            _mount2 = mount(CheckTypeDemo), instance = _mount2[0], element = _mount2[1];
-            table = instance.refs.__radio; // click row
-
-            _element$querySelecto2 = element.querySelectorAll('.k-table:nth-child(2) tbody tr'), tr1 = _element$querySelecto2[0], tr2 = _element$querySelecto2[1];
-            tr1.click();
-            _context2.next = 6;
-            return wait();
-
-          case 6:
-            expect(table.get('checkedKeys')).eql([0]);
-            tr2.click();
-            _context2.next = 10;
-            return wait();
-
-          case 10:
-            expect(table.get('checkedKeys')).eql([1]);
-
-          case 11:
-          case "end":
-            return _context2.stop();
-        }
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          _mount2 = mount(CheckTypeDemo), instance = _mount2[0], element = _mount2[1];
+          table = instance.refs.__radio; // click row
+          _element$querySelecto2 = element.querySelectorAll('.k-table:nth-child(2) tbody tr'), tr1 = _element$querySelecto2[0], tr2 = _element$querySelecto2[1];
+          tr1.click();
+          _context2.next = 6;
+          return wait();
+        case 6:
+          expect(table.get('checkedKeys')).eql([0]);
+          tr2.click();
+          _context2.next = 10;
+          return wait();
+        case 10:
+          expect(table.get('checkedKeys')).eql([1]);
+        case 11:
+        case "end":
+          return _context2.stop();
       }
     }, _callee2);
   })));
   it('getCheckedData', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
     var _mount3, instance, element, _instance$refs, checkboxTable, radioTable, _element$querySelecto3, tr1, tr2, _element$querySelecto4, tr11, tr22;
-
     return _regeneratorRuntime.wrap(function _callee3$(_context3) {
-      while (1) {
-        switch (_context3.prev = _context3.next) {
-          case 0:
-            _mount3 = mount(CheckTypeDemo), instance = _mount3[0], element = _mount3[1];
-            _instance$refs = instance.refs, checkboxTable = _instance$refs.__checkbox, radioTable = _instance$refs.__radio;
-            _element$querySelecto3 = element.querySelectorAll('.k-table:nth-child(1) tbody tr'), tr1 = _element$querySelecto3[0], tr2 = _element$querySelecto3[1];
-            tr1.click();
-            _context3.next = 6;
-            return wait();
-
-          case 6:
-            expect(_JSON$stringify(checkboxTable.getCheckedData())).to.matchSnapshot();
-            tr2.click();
-            _context3.next = 10;
-            return wait();
-
-          case 10:
-            expect(_JSON$stringify(checkboxTable.getCheckedData())).to.matchSnapshot();
-            _element$querySelecto4 = element.querySelectorAll('.k-table:nth-child(2) tbody tr'), tr11 = _element$querySelecto4[0], tr22 = _element$querySelecto4[1];
-            tr11.click();
-            _context3.next = 15;
-            return wait();
-
-          case 15:
-            expect(_JSON$stringify(radioTable.getCheckedData())).to.matchSnapshot();
-            tr22.click();
-            _context3.next = 19;
-            return wait();
-
-          case 19:
-            expect(_JSON$stringify(radioTable.getCheckedData())).to.matchSnapshot();
-
-          case 20:
-          case "end":
-            return _context3.stop();
-        }
+      while (1) switch (_context3.prev = _context3.next) {
+        case 0:
+          _mount3 = mount(CheckTypeDemo), instance = _mount3[0], element = _mount3[1];
+          _instance$refs = instance.refs, checkboxTable = _instance$refs.__checkbox, radioTable = _instance$refs.__radio;
+          _element$querySelecto3 = element.querySelectorAll('.k-table:nth-child(1) tbody tr'), tr1 = _element$querySelecto3[0], tr2 = _element$querySelecto3[1];
+          tr1.click();
+          _context3.next = 6;
+          return wait();
+        case 6:
+          expect(_JSON$stringify(checkboxTable.getCheckedData())).to.matchSnapshot();
+          tr2.click();
+          _context3.next = 10;
+          return wait();
+        case 10:
+          expect(_JSON$stringify(checkboxTable.getCheckedData())).to.matchSnapshot();
+          _element$querySelecto4 = element.querySelectorAll('.k-table:nth-child(2) tbody tr'), tr11 = _element$querySelecto4[0], tr22 = _element$querySelecto4[1];
+          tr11.click();
+          _context3.next = 15;
+          return wait();
+        case 15:
+          expect(_JSON$stringify(radioTable.getCheckedData())).to.matchSnapshot();
+          tr22.click();
+          _context3.next = 19;
+          return wait();
+        case 19:
+          expect(_JSON$stringify(radioTable.getCheckedData())).to.matchSnapshot();
+        case 20:
+        case "end":
+          return _context3.stop();
       }
     }, _callee3);
   })));
   it('expand & shrink', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
     var _mount4, instance, element, _instance$refs2, rowExpandableTable, rowUnExpandableTable, _element$querySelecto5, table1, table2, _table1$querySelector, tr, _table2$querySelector, tr1, icon;
-
     return _regeneratorRuntime.wrap(function _callee4$(_context4) {
-      while (1) {
-        switch (_context4.prev = _context4.next) {
-          case 0:
-            _mount4 = mount(ExpandDemo), instance = _mount4[0], element = _mount4[1];
-            _instance$refs2 = instance.refs, rowExpandableTable = _instance$refs2.__test1, rowUnExpandableTable = _instance$refs2.__test2;
-            _element$querySelecto5 = element.querySelectorAll('.k-table'), table1 = _element$querySelecto5[0], table2 = _element$querySelecto5[1];
-            _table1$querySelector = table1.querySelectorAll('tbody tr'), tr = _table1$querySelector[0];
-            tr.click();
-            _context4.next = 7;
-            return wait();
-
-          case 7:
-            expect(table1.outerHTML).to.matchSnapshot();
-            tr.click();
-            _context4.next = 11;
-            return wait();
-
-          case 11:
-            expect(table1.outerHTML).to.matchSnapshot();
-            _table2$querySelector = table2.querySelectorAll('tbody tr'), tr1 = _table2$querySelector[0];
-            tr1.click();
-            _context4.next = 16;
-            return wait();
-
-          case 16:
-            expect(table2.outerHTML).to.matchSnapshot();
-            icon = tr1.querySelector('.icon');
-            icon.click();
-            _context4.next = 21;
-            return wait();
-
-          case 21:
-            expect(table2.outerHTML).to.matchSnapshot();
-            icon.click();
-            _context4.next = 25;
-            return wait();
-
-          case 25:
-            expect(table2.outerHTML).to.matchSnapshot();
-
-          case 26:
-          case "end":
-            return _context4.stop();
-        }
+      while (1) switch (_context4.prev = _context4.next) {
+        case 0:
+          _mount4 = mount(ExpandDemo), instance = _mount4[0], element = _mount4[1];
+          _instance$refs2 = instance.refs, rowExpandableTable = _instance$refs2.__test1, rowUnExpandableTable = _instance$refs2.__test2;
+          _element$querySelecto5 = element.querySelectorAll('.k-table'), table1 = _element$querySelecto5[0], table2 = _element$querySelecto5[1];
+          _table1$querySelector = table1.querySelectorAll('tbody tr'), tr = _table1$querySelector[0];
+          tr.click();
+          _context4.next = 7;
+          return wait();
+        case 7:
+          expect(table1.outerHTML).to.matchSnapshot();
+          tr.click();
+          _context4.next = 11;
+          return wait();
+        case 11:
+          expect(table1.outerHTML).to.matchSnapshot();
+          _table2$querySelector = table2.querySelectorAll('tbody tr'), tr1 = _table2$querySelector[0];
+          tr1.click();
+          _context4.next = 16;
+          return wait();
+        case 16:
+          expect(table2.outerHTML).to.matchSnapshot();
+          icon = tr1.querySelector('.icon');
+          icon.click();
+          _context4.next = 21;
+          return wait();
+        case 21:
+          expect(table2.outerHTML).to.matchSnapshot();
+          icon.click();
+          _context4.next = 25;
+          return wait();
+        case 25:
+          expect(table2.outerHTML).to.matchSnapshot();
+        case 26:
+        case "end":
+          return _context4.stop();
       }
     }, _callee4);
   })));
   it('merge cells', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
     var _mount5, instance, element, _instance$refs3, mergeCheckboxTable, mergeRadioTable, _element$querySelecto6, table1, table2, _table1$querySelector2, tr3, tr4, tr5, _table2$querySelector2, _tr1, _tr4;
-
     return _regeneratorRuntime.wrap(function _callee5$(_context5) {
-      while (1) {
-        switch (_context5.prev = _context5.next) {
-          case 0:
-            _mount5 = mount(MergeCellDemo), instance = _mount5[0], element = _mount5[1];
-            _instance$refs3 = instance.refs, mergeCheckboxTable = _instance$refs3.__test1, mergeRadioTable = _instance$refs3.__test2;
-            _element$querySelecto6 = element.querySelectorAll('.k-table'), table1 = _element$querySelecto6[0], table2 = _element$querySelecto6[1];
-            _table1$querySelector2 = table1.querySelectorAll('tbody tr'), tr3 = _table1$querySelector2[2], tr4 = _table1$querySelector2[3], tr5 = _table1$querySelector2[4];
-            expect(mergeCheckboxTable.get('checkedKeys')).eql([3]);
-            expect(table1.outerHTML).to.matchSnapshot();
-            tr3.click();
-            _context5.next = 9;
-            return wait();
-
-          case 9:
-            expect(mergeCheckboxTable.get('checkedKeys')).eql([3, 2]);
-            expect(table1.outerHTML).to.matchSnapshot();
-            tr4.click();
-            _context5.next = 14;
-            return wait();
-
-          case 14:
-            expect(mergeCheckboxTable.get('checkedKeys')).eql([2]);
-            expect(table1.outerHTML).to.matchSnapshot();
-            tr4.click();
-            _context5.next = 19;
-            return wait();
-
-          case 19:
-            expect(mergeCheckboxTable.get('checkedKeys')).eql([2, 3]);
-            expect(table1.outerHTML).to.matchSnapshot();
-            tr5.click();
-            _context5.next = 24;
-            return wait();
-
-          case 24:
-            expect(mergeCheckboxTable.get('checkedKeys')).eql([2, 3, 4]);
-            expect(table1.outerHTML).to.matchSnapshot();
-            _table2$querySelector2 = table2.querySelectorAll('tbody tr'), _tr1 = _table2$querySelector2[0], _tr4 = _table2$querySelector2[3];
-            expect(mergeRadioTable.get('checkedKeys')).eql([0, 1]);
-            expect(table2.outerHTML).to.matchSnapshot();
-
-            _tr4.click();
-
-            _context5.next = 32;
-            return wait();
-
-          case 32:
-            expect(mergeRadioTable.get('checkedKeys')).eql([1, 2, 3, 4]);
-            expect(table2.outerHTML).to.matchSnapshot();
-
-            _tr1.click();
-
-            _context5.next = 37;
-            return wait();
-
-          case 37:
-            expect(mergeRadioTable.get('checkedKeys')).eql([1, 0]);
-            expect(table2.outerHTML).to.matchSnapshot();
-
-          case 39:
-          case "end":
-            return _context5.stop();
-        }
+      while (1) switch (_context5.prev = _context5.next) {
+        case 0:
+          _mount5 = mount(MergeCellDemo), instance = _mount5[0], element = _mount5[1];
+          _instance$refs3 = instance.refs, mergeCheckboxTable = _instance$refs3.__test1, mergeRadioTable = _instance$refs3.__test2;
+          _element$querySelecto6 = element.querySelectorAll('.k-table'), table1 = _element$querySelecto6[0], table2 = _element$querySelecto6[1];
+          _table1$querySelector2 = table1.querySelectorAll('tbody tr'), tr3 = _table1$querySelector2[2], tr4 = _table1$querySelector2[3], tr5 = _table1$querySelector2[4];
+          expect(mergeCheckboxTable.get('checkedKeys')).eql([3]);
+          expect(table1.outerHTML).to.matchSnapshot();
+          tr3.click();
+          _context5.next = 9;
+          return wait();
+        case 9:
+          expect(mergeCheckboxTable.get('checkedKeys')).eql([3, 2]);
+          expect(table1.outerHTML).to.matchSnapshot();
+          tr4.click();
+          _context5.next = 14;
+          return wait();
+        case 14:
+          expect(mergeCheckboxTable.get('checkedKeys')).eql([2]);
+          expect(table1.outerHTML).to.matchSnapshot();
+          tr4.click();
+          _context5.next = 19;
+          return wait();
+        case 19:
+          expect(mergeCheckboxTable.get('checkedKeys')).eql([2, 3]);
+          expect(table1.outerHTML).to.matchSnapshot();
+          tr5.click();
+          _context5.next = 24;
+          return wait();
+        case 24:
+          expect(mergeCheckboxTable.get('checkedKeys')).eql([2, 3, 4]);
+          expect(table1.outerHTML).to.matchSnapshot();
+          _table2$querySelector2 = table2.querySelectorAll('tbody tr'), _tr1 = _table2$querySelector2[0], _tr4 = _table2$querySelector2[3];
+          expect(mergeRadioTable.get('checkedKeys')).eql([0, 1]);
+          expect(table2.outerHTML).to.matchSnapshot();
+          _tr4.click();
+          _context5.next = 32;
+          return wait();
+        case 32:
+          expect(mergeRadioTable.get('checkedKeys')).eql([1, 2, 3, 4]);
+          expect(table2.outerHTML).to.matchSnapshot();
+          _tr1.click();
+          _context5.next = 37;
+          return wait();
+        case 37:
+          expect(mergeRadioTable.get('checkedKeys')).eql([1, 0]);
+          expect(table2.outerHTML).to.matchSnapshot();
+        case 39:
+        case "end":
+          return _context5.stop();
       }
     }, _callee5);
   })));
   it('sort', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee6() {
     var _mount6, instance, element, _element$querySelecto7, th1, th2;
-
     return _regeneratorRuntime.wrap(function _callee6$(_context6) {
-      while (1) {
-        switch (_context6.prev = _context6.next) {
-          case 0:
-            _mount6 = mount(SortDemo), instance = _mount6[0], element = _mount6[1];
-            _element$querySelecto7 = element.querySelectorAll('thead th'), th1 = _element$querySelecto7[1], th2 = _element$querySelecto7[2];
-            th1.click();
-            _context6.next = 5;
-            return wait();
-
-          case 5:
-            expect(instance.get('sort')).to.eql({
-              key: 'name',
-              type: 'desc'
-            });
-            th2.click();
-            _context6.next = 9;
-            return wait();
-
-          case 9:
-            expect(instance.get('sort')).to.eql({
-              key: 'age',
-              type: 'desc'
-            });
-            th2.click();
-            _context6.next = 13;
-            return wait();
-
-          case 13:
-            expect(instance.get('sort')).to.eql({
-              key: 'age',
-              type: 'asc'
-            });
-            th2.click();
-            _context6.next = 17;
-            return wait();
-
-          case 17:
-            expect(instance.get('sort')).to.eql({});
-
-          case 18:
-          case "end":
-            return _context6.stop();
-        }
+      while (1) switch (_context6.prev = _context6.next) {
+        case 0:
+          _mount6 = mount(SortDemo), instance = _mount6[0], element = _mount6[1];
+          _element$querySelecto7 = element.querySelectorAll('thead th'), th1 = _element$querySelecto7[1], th2 = _element$querySelecto7[2];
+          th1.click();
+          _context6.next = 5;
+          return wait();
+        case 5:
+          expect(instance.get('sort')).to.eql({
+            key: 'name',
+            type: 'desc'
+          });
+          th2.click();
+          _context6.next = 9;
+          return wait();
+        case 9:
+          expect(instance.get('sort')).to.eql({
+            key: 'age',
+            type: 'desc'
+          });
+          th2.click();
+          _context6.next = 13;
+          return wait();
+        case 13:
+          expect(instance.get('sort')).to.eql({
+            key: 'age',
+            type: 'asc'
+          });
+          th2.click();
+          _context6.next = 17;
+          return wait();
+        case 17:
+          expect(instance.get('sort')).to.eql({});
+        case 18:
+        case "end":
+          return _context6.stop();
       }
     }, _callee6);
   })));
   it('group', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee7() {
     var _mount7, instance, element, _instance$refs4, __test1, __test2, _element$querySelecto8, table1, table2, icon, dropdown, item, icon2, dropdown2, _dropdown2$querySelec, item1, item2, newDropdown;
-
     return _regeneratorRuntime.wrap(function _callee7$(_context7) {
-      while (1) {
-        switch (_context7.prev = _context7.next) {
-          case 0:
-            _mount7 = mount(GroupDemo), instance = _mount7[0], element = _mount7[1];
-            _instance$refs4 = instance.refs, __test1 = _instance$refs4.__test1, __test2 = _instance$refs4.__test2;
-            _element$querySelecto8 = element.querySelectorAll('.k-table'), table1 = _element$querySelecto8[0], table2 = _element$querySelecto8[1];
-            icon = table1.querySelector('.k-table-group');
-            dispatchEvent(icon, 'click');
-            _context7.next = 7;
-            return wait();
-
-          case 7:
-            dropdown = getElement('.k-table-group-dropdown');
-            expect(dropdown.innerHTML).to.matchSnapshot();
-            item = dropdown.querySelector('.k-dropdown-item:nth-child(2)');
-            item.click();
-            _context7.next = 13;
-            return wait();
-
-          case 13:
-            expect(instance.get('group')).to.eql({
-              status: 'active'
-            });
-            expect(table1.innerHTML).to.matchSnapshot();
-            icon2 = table2.querySelector('.k-table-group');
-            dispatchEvent(icon2, 'click');
-            _context7.next = 19;
-            return wait();
-
-          case 19:
-            dropdown2 = getElement('.k-table-group-dropdown');
-            expect(dropdown2.innerHTML).to.matchSnapshot();
-            _dropdown2$querySelec = dropdown2.querySelectorAll('.k-checkbox'), item1 = _dropdown2$querySelec[0], item2 = _dropdown2$querySelec[1];
-            item1.click();
-            _context7.next = 25;
-            return wait();
-
-          case 25:
-            expect(instance.get('multipleGroup')).to.eql({
-              status: ['active']
-            });
-            expect(table2.innerHTML).to.matchSnapshot();
-            item2.click();
-            _context7.next = 30;
-            return wait();
-
-          case 30:
-            expect(instance.get('multipleGroup')).to.eql({
-              status: ['active', 'stopped']
-            });
-            expect(table2.innerHTML).to.matchSnapshot(); // update group
-
-            instance.set('statusGroup', [{
-              label: 'label',
-              value: 'value'
-            }]);
-            dispatchEvent(icon, 'click');
-            _context7.next = 36;
-            return wait(500);
-
-          case 36:
-            newDropdown = getElement('.k-table-group-dropdown');
-            expect(newDropdown.innerHTML).to.matchSnapshot();
-
-          case 38:
-          case "end":
-            return _context7.stop();
-        }
+      while (1) switch (_context7.prev = _context7.next) {
+        case 0:
+          _mount7 = mount(GroupDemo), instance = _mount7[0], element = _mount7[1];
+          _instance$refs4 = instance.refs, __test1 = _instance$refs4.__test1, __test2 = _instance$refs4.__test2;
+          _element$querySelecto8 = element.querySelectorAll('.k-table'), table1 = _element$querySelecto8[0], table2 = _element$querySelecto8[1];
+          icon = table1.querySelector('.k-table-group');
+          dispatchEvent(icon, 'click');
+          _context7.next = 7;
+          return wait();
+        case 7:
+          dropdown = getElement('.k-table-group-dropdown');
+          expect(dropdown.innerHTML).to.matchSnapshot();
+          item = dropdown.querySelector('.k-dropdown-item:nth-child(2)');
+          item.click();
+          _context7.next = 13;
+          return wait();
+        case 13:
+          expect(instance.get('group')).to.eql({
+            status: 'active'
+          });
+          expect(table1.innerHTML).to.matchSnapshot();
+          icon2 = table2.querySelector('.k-table-group');
+          dispatchEvent(icon2, 'click');
+          _context7.next = 19;
+          return wait();
+        case 19:
+          dropdown2 = getElement('.k-table-group-dropdown');
+          expect(dropdown2.innerHTML).to.matchSnapshot();
+          _dropdown2$querySelec = dropdown2.querySelectorAll('.k-checkbox'), item1 = _dropdown2$querySelec[0], item2 = _dropdown2$querySelec[1];
+          item1.click();
+          _context7.next = 25;
+          return wait();
+        case 25:
+          expect(instance.get('multipleGroup')).to.eql({
+            status: ['active']
+          });
+          expect(table2.innerHTML).to.matchSnapshot();
+          item2.click();
+          _context7.next = 30;
+          return wait();
+        case 30:
+          expect(instance.get('multipleGroup')).to.eql({
+            status: ['active', 'stopped']
+          });
+          expect(table2.innerHTML).to.matchSnapshot();
+          // update group
+          instance.set('statusGroup', [{
+            label: 'label',
+            value: 'value'
+          }]);
+          dispatchEvent(icon, 'click');
+          _context7.next = 36;
+          return wait(500);
+        case 36:
+          newDropdown = getElement('.k-table-group-dropdown');
+          expect(newDropdown.innerHTML).to.matchSnapshot();
+        case 38:
+        case "end":
+          return _context7.stop();
       }
     }, _callee7);
   })));
   it('fix columns', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee8() {
     var _mount8, instance, element, table, tableElement, scrollElement;
-
     return _regeneratorRuntime.wrap(function _callee8$(_context8) {
-      while (1) {
-        switch (_context8.prev = _context8.next) {
-          case 0:
-            _mount8 = mount(FixColumnDemo), instance = _mount8[0], element = _mount8[1];
-            table = instance.refs.__test;
-            element.style.width = "1000px";
-            tableElement = element.querySelector('.k-table:nth-child(2)');
-            scrollElement = tableElement.querySelector('.k-table-wrapper'); // should add k-scroll-middle classname
-
-            scrollElement.scrollLeft = 100;
-            _context8.next = 8;
-            return wait(100);
-
-          case 8:
-            expect(tableElement.outerHTML).to.matchSnapshot(); // should add k-scroll-right classname
-
-            scrollElement.scrollLeft = 1000;
-            _context8.next = 12;
-            return wait(100);
-
-          case 12:
-            expect(tableElement.outerHTML).to.matchSnapshot(); // should change max-height if we set fixHeader to true
-
-            table.set('fixHeader', true);
-            _context8.next = 16;
-            return wait();
-
-          case 16:
-            expect(tableElement.outerHTML).to.matchSnapshot();
-
-          case 17:
-          case "end":
-            return _context8.stop();
-        }
+      while (1) switch (_context8.prev = _context8.next) {
+        case 0:
+          _mount8 = mount(FixColumnDemo), instance = _mount8[0], element = _mount8[1];
+          table = instance.refs.__test;
+          element.style.width = "1000px";
+          tableElement = element.querySelector('.k-table:nth-child(2)');
+          scrollElement = tableElement.querySelector('.k-table-wrapper'); // should add k-scroll-middle classname
+          scrollElement.scrollLeft = 100;
+          _context8.next = 8;
+          return wait(100);
+        case 8:
+          expect(tableElement.outerHTML).to.matchSnapshot();
+          // should add k-scroll-right classname
+          scrollElement.scrollLeft = 1000;
+          _context8.next = 12;
+          return wait(100);
+        case 12:
+          expect(tableElement.outerHTML).to.matchSnapshot();
+          // should change max-height if we set fixHeader to true
+          table.set('fixHeader', true);
+          _context8.next = 16;
+          return wait();
+        case 16:
+          expect(tableElement.outerHTML).to.matchSnapshot();
+        case 17:
+        case "end":
+          return _context8.stop();
       }
     }, _callee8);
   })));
   it('resize', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee9() {
     var _mount9, instance, element, table, resize;
-
     return _regeneratorRuntime.wrap(function _callee9$(_context9) {
-      while (1) {
-        switch (_context9.prev = _context9.next) {
-          case 0:
-            _mount9 = mount(BasicDemo), instance = _mount9[0], element = _mount9[1];
-            table = instance.refs.__test;
-            resize = element.querySelector('.k-table-resize');
-            dispatchEvent(resize, 'mousedown', {
-              which: 1,
-              clientX: 0
-            });
-            dispatchEvent(document, 'mousemove', {
-              clientX: 1
-            });
-            dispatchEvent(document, 'mouseup');
-            _context9.next = 8;
-            return wait();
-
-          case 8:
-            expect(element.innerHTML).to.matchSnapshot();
-
-          case 9:
-          case "end":
-            return _context9.stop();
-        }
+      while (1) switch (_context9.prev = _context9.next) {
+        case 0:
+          _mount9 = mount(BasicDemo), instance = _mount9[0], element = _mount9[1];
+          table = instance.refs.__test;
+          resize = element.querySelector('.k-table-resize');
+          dispatchEvent(resize, 'mousedown', {
+            which: 1,
+            clientX: 0
+          });
+          dispatchEvent(document, 'mousemove', {
+            clientX: 1
+          });
+          dispatchEvent(document, 'mouseup');
+          _context9.next = 8;
+          return wait();
+        case 8:
+          expect(element.innerHTML).to.matchSnapshot();
+        case 9:
+        case "end":
+          return _context9.stop();
       }
     }, _callee9);
   })));
   it('store width on resizing', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee10() {
     var _mount10, instance, element, resize, innerHTML, _mount11, table;
-
     return _regeneratorRuntime.wrap(function _callee10$(_context10) {
-      while (1) {
-        switch (_context10.prev = _context10.next) {
-          case 0:
-            localStorage.removeItem('resizableTable');
-            _mount10 = mount(ResizableDemo), instance = _mount10[0], element = _mount10[1]; // should equal to minWidth
-
-            _context10.next = 4;
-            return wait();
-
-          case 4:
-            expect(element.querySelector('thead th:nth-child(4)').offsetWidth).to.eql(300);
-            resize = element.querySelector('.k-table-resize');
-            dispatchEvent(resize, 'mousedown', {
-              which: 1,
-              clientX: 0
-            });
-            dispatchEvent(document, 'mousemove', {
-              clientX: 1
-            });
-            dispatchEvent(document, 'mouseup');
-            _context10.next = 11;
-            return wait();
-
-          case 11:
-            // rerender
-            innerHTML = element.innerHTML;
-            unmount();
-            _mount11 = mount(ResizableDemo), table = _mount11[1];
-            expect(table.innerHTML).to.matchSnapshot();
-            expect(table.innerHTML).to.eql(innerHTML);
-            localStorage.removeItem('resizableTable');
-
-          case 17:
-          case "end":
-            return _context10.stop();
-        }
+      while (1) switch (_context10.prev = _context10.next) {
+        case 0:
+          localStorage.removeItem('resizableTable');
+          _mount10 = mount(ResizableDemo), instance = _mount10[0], element = _mount10[1]; // should equal to minWidth
+          _context10.next = 4;
+          return wait();
+        case 4:
+          expect(element.querySelector('thead th:nth-child(4)').offsetWidth).to.eql(300);
+          resize = element.querySelector('.k-table-resize');
+          dispatchEvent(resize, 'mousedown', {
+            which: 1,
+            clientX: 0
+          });
+          dispatchEvent(document, 'mousemove', {
+            clientX: 1
+          });
+          dispatchEvent(document, 'mouseup');
+          _context10.next = 11;
+          return wait();
+        case 11:
+          // rerender
+          innerHTML = element.innerHTML;
+          unmount();
+          _mount11 = mount(ResizableDemo), table = _mount11[1];
+          expect(table.innerHTML).to.matchSnapshot();
+          expect(table.innerHTML).to.eql(innerHTML);
+          localStorage.removeItem('resizableTable');
+        case 17:
+        case "end":
+          return _context10.stop();
       }
     }, _callee10);
   })));
   it('resize column that its previous column is hidden', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee11() {
     var _mount12, instance, element, resize;
-
     return _regeneratorRuntime.wrap(function _callee11$(_context11) {
-      while (1) {
-        switch (_context11.prev = _context11.next) {
-          case 0:
-            localStorage.removeItem('resizableTable');
-            _mount12 = mount(ResizableDemo, null, ResizableDemoData), instance = _mount12[0], element = _mount12[1];
-            resize = element.querySelector('thead th:nth-child(4) .k-table-resize');
-            dispatchEvent(resize, 'mousedown', {
-              which: 1,
-              clientX: 0
-            });
-            dispatchEvent(document, 'mousemove', {
-              clientX: 1
-            });
-            dispatchEvent(document, 'mouseup');
-            _context11.next = 8;
-            return wait();
-
-          case 8:
-            expect(element.innerHTML).to.matchSnapshot();
-            localStorage.removeItem('resizableTable');
-
-          case 10:
-          case "end":
-            return _context11.stop();
-        }
+      while (1) switch (_context11.prev = _context11.next) {
+        case 0:
+          localStorage.removeItem('resizableTable');
+          _mount12 = mount(ResizableDemo, null, ResizableDemoData), instance = _mount12[0], element = _mount12[1];
+          resize = element.querySelector('thead th:nth-child(4) .k-table-resize');
+          dispatchEvent(resize, 'mousedown', {
+            which: 1,
+            clientX: 0
+          });
+          dispatchEvent(document, 'mousemove', {
+            clientX: 1
+          });
+          dispatchEvent(document, 'mouseup');
+          _context11.next = 8;
+          return wait();
+        case 8:
+          expect(element.innerHTML).to.matchSnapshot();
+          localStorage.removeItem('resizableTable');
+        case 10:
+        case "end":
+          return _context11.stop();
       }
     }, _callee11);
   })));
   it('should set the width of table equal to container after resizing and expanding container', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee12() {
     var _mount13, instance, element, resize, container;
-
     return _regeneratorRuntime.wrap(function _callee12$(_context12) {
-      while (1) {
-        switch (_context12.prev = _context12.next) {
-          case 0:
-            _mount13 = mount(BasicDemo), instance = _mount13[0], element = _mount13[1];
-            resize = element.querySelector('.k-table-resize');
-            dispatchEvent(resize, 'mousedown', {
-              which: 1,
-              clientX: 0
-            });
-            dispatchEvent(document, 'mousemove', {
-              clientX: 1
-            });
-            dispatchEvent(document, 'mouseup');
-            _context12.next = 7;
-            return wait();
-
-          case 7:
-            container = element.parentNode;
-            container.style.width = '1000px';
-            _context12.next = 11;
-            return wait(200);
-
-          case 11:
-            expect(element.querySelector('table').style.width).to.eql('1000px');
-
-          case 12:
-          case "end":
-            return _context12.stop();
-        }
+      while (1) switch (_context12.prev = _context12.next) {
+        case 0:
+          _mount13 = mount(BasicDemo), instance = _mount13[0], element = _mount13[1];
+          resize = element.querySelector('.k-table-resize');
+          dispatchEvent(resize, 'mousedown', {
+            which: 1,
+            clientX: 0
+          });
+          dispatchEvent(document, 'mousemove', {
+            clientX: 1
+          });
+          dispatchEvent(document, 'mouseup');
+          _context12.next = 7;
+          return wait();
+        case 7:
+          container = element.parentNode;
+          container.style.width = '1000px';
+          _context12.next = 11;
+          return wait(200);
+        case 11:
+          expect(element.querySelector('table').style.width).to.eql('1000px');
+        case 12:
+        case "end":
+          return _context12.stop();
       }
     }, _callee12);
   })));
   it('loading', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee13() {
     var _mount14, instance, element;
-
     return _regeneratorRuntime.wrap(function _callee13$(_context13) {
-      while (1) {
-        switch (_context13.prev = _context13.next) {
-          case 0:
-            _mount14 = mount(LoadingDemo), instance = _mount14[0], element = _mount14[1];
-            instance.set('loading', true);
-            _context13.next = 4;
-            return wait();
-
-          case 4:
-            expect(element.innerHTML).to.matchSnapshot();
-            instance.set('loading', false);
-            _context13.next = 8;
-            return wait();
-
-          case 8:
-            expect(element.innerHTML).to.matchSnapshot();
-
-          case 9:
-          case "end":
-            return _context13.stop();
-        }
+      while (1) switch (_context13.prev = _context13.next) {
+        case 0:
+          _mount14 = mount(LoadingDemo), instance = _mount14[0], element = _mount14[1];
+          instance.set('loading', true);
+          _context13.next = 4;
+          return wait();
+        case 4:
+          expect(element.innerHTML).to.matchSnapshot();
+          instance.set('loading', false);
+          _context13.next = 8;
+          return wait();
+        case 8:
+          expect(element.innerHTML).to.matchSnapshot();
+        case 9:
+        case "end":
+          return _context13.stop();
       }
     }, _callee13);
   })));
   it('export', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee14() {
     var _mount15, instance, element, content, content1;
-
     return _regeneratorRuntime.wrap(function _callee14$(_context14) {
-      while (1) {
-        switch (_context14.prev = _context14.next) {
-          case 0:
-            this.timeout(0);
-            _mount15 = mount(ExportDemo), instance = _mount15[0], element = _mount15[1];
-            _context14.next = 4;
-            return instance.refs.table.exportTable();
-
-          case 4:
-            content = _context14.sent;
-            expect(content.replace(/\r\n|\r/g, '\n')).to.matchSnapshot();
-            _context14.next = 8;
-            return instance.refs.table.exportTable([{
-              a: '1',
-              b: 2,
-              c: 3
-            }]);
-
-          case 8:
-            content1 = _context14.sent;
-            expect(content1.replace(/\r\n|\r/g, '\n')).to.matchSnapshot();
-
-          case 10:
-          case "end":
-            return _context14.stop();
-        }
+      while (1) switch (_context14.prev = _context14.next) {
+        case 0:
+          this.timeout(0);
+          _mount15 = mount(ExportDemo), instance = _mount15[0], element = _mount15[1];
+          _context14.next = 4;
+          return instance.refs.table.exportTable();
+        case 4:
+          content = _context14.sent;
+          expect(content.replace(/\r\n|\r/g, '\n')).to.matchSnapshot();
+          _context14.next = 8;
+          return instance.refs.table.exportTable([{
+            a: '1',
+            b: 2,
+            c: 3
+          }]);
+        case 8:
+          content1 = _context14.sent;
+          expect(content1.replace(/\r\n|\r/g, '\n')).to.matchSnapshot();
+        case 10:
+        case "end":
+          return _context14.stop();
       }
     }, _callee14, this);
   })));
   it('selectedKeys', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee15() {
     var _mount16, instance, element, _element$querySelecto9, table1, table2, _table1$querySelector3, tr1, tr2, _table2$querySelector3, tr21, tr22;
-
     return _regeneratorRuntime.wrap(function _callee15$(_context15) {
-      while (1) {
-        switch (_context15.prev = _context15.next) {
-          case 0:
-            _mount16 = mount(SelectedKeysDemo), instance = _mount16[0], element = _mount16[1];
-            _element$querySelecto9 = element.querySelectorAll('tbody'), table1 = _element$querySelecto9[0], table2 = _element$querySelecto9[1];
-            _table1$querySelector3 = table1.querySelectorAll('tr'), tr1 = _table1$querySelector3[0], tr2 = _table1$querySelector3[1];
-            tr1.click();
-            _context15.next = 6;
-            return wait();
-
-          case 6:
-            expect(table1.innerHTML).to.matchSnapshot();
-            tr2.click();
-            _context15.next = 10;
-            return wait();
-
-          case 10:
-            expect(table1.innerHTML).to.matchSnapshot();
-            expect(instance.refs.__test1.getSelectedData()).to.have.lengthOf(1);
-            tr2.click();
-            _context15.next = 15;
-            return wait();
-
-          case 15:
-            expect(table1.innerHTML).to.matchSnapshot();
-            expect(instance.refs.__test1.getSelectedData()).to.have.lengthOf(0);
-            _table2$querySelector3 = table2.querySelectorAll('tr'), tr21 = _table2$querySelector3[0], tr22 = _table2$querySelector3[1];
-            tr21.click();
-            _context15.next = 21;
-            return wait();
-
-          case 21:
-            expect(table2.innerHTML).to.matchSnapshot();
-            tr22.click();
-            _context15.next = 25;
-            return wait();
-
-          case 25:
-            expect(table2.innerHTML).to.matchSnapshot();
-            expect(instance.refs.__test2.getSelectedData()).to.have.lengthOf(2);
-            tr22.click();
-            _context15.next = 30;
-            return wait();
-
-          case 30:
-            expect(table2.innerHTML).to.matchSnapshot();
-            expect(instance.refs.__test2.getSelectedData()).to.have.lengthOf(1);
-
-          case 32:
-          case "end":
-            return _context15.stop();
-        }
+      while (1) switch (_context15.prev = _context15.next) {
+        case 0:
+          _mount16 = mount(SelectedKeysDemo), instance = _mount16[0], element = _mount16[1];
+          _element$querySelecto9 = element.querySelectorAll('tbody'), table1 = _element$querySelecto9[0], table2 = _element$querySelecto9[1];
+          _table1$querySelector3 = table1.querySelectorAll('tr'), tr1 = _table1$querySelector3[0], tr2 = _table1$querySelector3[1];
+          tr1.click();
+          _context15.next = 6;
+          return wait();
+        case 6:
+          expect(table1.innerHTML).to.matchSnapshot();
+          tr2.click();
+          _context15.next = 10;
+          return wait();
+        case 10:
+          expect(table1.innerHTML).to.matchSnapshot();
+          expect(instance.refs.__test1.getSelectedData()).to.have.lengthOf(1);
+          tr2.click();
+          _context15.next = 15;
+          return wait();
+        case 15:
+          expect(table1.innerHTML).to.matchSnapshot();
+          expect(instance.refs.__test1.getSelectedData()).to.have.lengthOf(0);
+          _table2$querySelector3 = table2.querySelectorAll('tr'), tr21 = _table2$querySelector3[0], tr22 = _table2$querySelector3[1];
+          tr21.click();
+          _context15.next = 21;
+          return wait();
+        case 21:
+          expect(table2.innerHTML).to.matchSnapshot();
+          tr22.click();
+          _context15.next = 25;
+          return wait();
+        case 25:
+          expect(table2.innerHTML).to.matchSnapshot();
+          expect(instance.refs.__test2.getSelectedData()).to.have.lengthOf(2);
+          tr22.click();
+          _context15.next = 30;
+          return wait();
+        case 30:
+          expect(table2.innerHTML).to.matchSnapshot();
+          expect(instance.refs.__test2.getSelectedData()).to.have.lengthOf(1);
+        case 32:
+        case "end":
+          return _context15.stop();
       }
     }, _callee15);
   })));
   it('tooltip', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee16() {
     var _mount17, instance, element, tr, content;
-
     return _regeneratorRuntime.wrap(function _callee16$(_context16) {
-      while (1) {
-        switch (_context16.prev = _context16.next) {
-          case 0:
-            _mount17 = mount(TooltipDemo), instance = _mount17[0], element = _mount17[1];
-            tr = element.querySelector('tbody tr');
-            dispatchEvent(tr, 'mouseenter');
-            _context16.next = 5;
-            return wait();
-
-          case 5:
-            content = getElement('.k-tooltip-content');
-            expect(content.textContent).to.matchSnapshot();
-
-          case 7:
-          case "end":
-            return _context16.stop();
-        }
+      while (1) switch (_context16.prev = _context16.next) {
+        case 0:
+          _mount17 = mount(TooltipDemo), instance = _mount17[0], element = _mount17[1];
+          tr = element.querySelector('tbody tr');
+          dispatchEvent(tr, 'mouseenter');
+          _context16.next = 5;
+          return wait();
+        case 5:
+          content = getElement('.k-tooltip-content');
+          expect(content.textContent).to.matchSnapshot();
+        case 7:
+        case "end":
+          return _context16.stop();
       }
     }, _callee16);
   })));
   it('tree', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee17() {
     var _mount18, instance, element, table, checkbox, arrow;
-
     return _regeneratorRuntime.wrap(function _callee17$(_context17) {
-      while (1) {
-        switch (_context17.prev = _context17.next) {
-          case 0:
-            _mount18 = mount(TreeDemo), instance = _mount18[0], element = _mount18[1];
-            table = instance.$lastInput.children; // check all
-
-            checkbox = element.querySelector('.k-checkbox');
-            checkbox.click();
-            _context17.next = 6;
-            return wait();
-
-          case 6:
-            expect(element.innerHTML).to.matchSnapshot();
-            expect(table.getCheckedData()).to.have.lengthOf(8);
-            arrow = element.querySelector('.k-table-arrow');
-            arrow.click();
-            _context17.next = 12;
-            return wait();
-
-          case 12:
-            expect(element.innerHTML).to.matchSnapshot();
-            arrow.click();
-            _context17.next = 16;
-            return wait();
-
-          case 16:
-            expect(element.innerHTML).to.matchSnapshot();
-            expect(table.getCheckedData()).to.have.lengthOf(8);
-
-          case 18:
-          case "end":
-            return _context17.stop();
-        }
+      while (1) switch (_context17.prev = _context17.next) {
+        case 0:
+          _mount18 = mount(TreeDemo), instance = _mount18[0], element = _mount18[1];
+          table = instance.$lastInput.children; // check all
+          checkbox = element.querySelector('.k-checkbox');
+          checkbox.click();
+          _context17.next = 6;
+          return wait();
+        case 6:
+          expect(element.innerHTML).to.matchSnapshot();
+          expect(table.getCheckedData()).to.have.lengthOf(8);
+          arrow = element.querySelector('.k-table-arrow');
+          arrow.click();
+          _context17.next = 12;
+          return wait();
+        case 12:
+          expect(element.innerHTML).to.matchSnapshot();
+          arrow.click();
+          _context17.next = 16;
+          return wait();
+        case 16:
+          expect(element.innerHTML).to.matchSnapshot();
+          expect(table.getCheckedData()).to.have.lengthOf(8);
+        case 18:
+        case "end":
+          return _context17.stop();
       }
     }, _callee17);
   })));
   it('should keep checked status of the disabled row', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee18() {
     var _mount19, instance, element, checked, checkbox, _element$querySelecto10, checkbox2, checkbox4;
-
     return _regeneratorRuntime.wrap(function _callee18$(_context18) {
-      while (1) {
-        switch (_context18.prev = _context18.next) {
-          case 0:
-            _mount19 = mount(DisabledDemo), instance = _mount19[0], element = _mount19[1];
-            checked = instance.$lastInput.children.checked;
-            checkbox = element.querySelector('.k-checkbox');
-            checkbox.click();
-            _context18.next = 6;
-            return wait();
-
-          case 6:
-            expect(instance.get('checkedKeys')).to.eql(['3', '2', '4']);
-            checkbox.click();
-            _context18.next = 10;
-            return wait();
-
-          case 10:
-            expect(instance.get('checkedKeys')).to.eql(['3']);
-            _element$querySelecto10 = element.querySelectorAll('.k-checkbox'), checkbox2 = _element$querySelecto10[2], checkbox4 = _element$querySelecto10[4];
-            checkbox2.click();
-            _context18.next = 15;
-            return wait();
-
-          case 15:
-            expect(checked.getAllCheckedStatus()).eql(AllCheckedStatus.Indeterminate);
-            checkbox4.click();
-            _context18.next = 19;
-            return wait();
-
-          case 19:
-            expect(checked.getAllCheckedStatus()).eql(AllCheckedStatus.All);
-
-          case 20:
-          case "end":
-            return _context18.stop();
-        }
+      while (1) switch (_context18.prev = _context18.next) {
+        case 0:
+          _mount19 = mount(DisabledDemo), instance = _mount19[0], element = _mount19[1];
+          checked = instance.$lastInput.children.checked;
+          checkbox = element.querySelector('.k-checkbox');
+          checkbox.click();
+          _context18.next = 6;
+          return wait();
+        case 6:
+          expect(instance.get('checkedKeys')).to.eql(['3', '2', '4']);
+          checkbox.click();
+          _context18.next = 10;
+          return wait();
+        case 10:
+          expect(instance.get('checkedKeys')).to.eql(['3']);
+          _element$querySelecto10 = element.querySelectorAll('.k-checkbox'), checkbox2 = _element$querySelecto10[2], checkbox4 = _element$querySelecto10[4];
+          checkbox2.click();
+          _context18.next = 15;
+          return wait();
+        case 15:
+          expect(checked.getAllCheckedStatus()).eql(AllCheckedStatus.Indeterminate);
+          checkbox4.click();
+          _context18.next = 19;
+          return wait();
+        case 19:
+          expect(checked.getAllCheckedStatus()).eql(AllCheckedStatus.All);
+        case 20:
+        case "end":
+          return _context18.stop();
       }
     }, _callee18);
   })));
   it('scroll to row', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee19() {
     var _mount20, instance, element, table, scroll, tr, height, test;
-
     return _regeneratorRuntime.wrap(function _callee19$(_context19) {
-      while (1) {
-        switch (_context19.prev = _context19.next) {
-          case 0:
-            _mount20 = mount(ScrollToRowDemo), instance = _mount20[0], element = _mount20[1];
-            table = instance.refs.table;
-            scroll = element.querySelector('.k-table-wrapper');
-            tr = element.querySelector('tbody tr');
-            height = tr.offsetHeight;
-
-            test = function test(rows) {
-              expect(scroll.scrollTop).to.eql(height * rows);
-            };
-
-            _context19.next = 8;
-            return table.scrollToRowByIndex(2);
-
-          case 8:
-            test(2);
-            _context19.next = 11;
-            return table.scrollToRowByIndex(1);
-
-          case 11:
-            test(1);
-            _context19.next = 14;
-            return table.scrollToRowByKey('name 3');
-
-          case 14:
-            test(2);
-            _context19.next = 17;
-            return table.scrollToRowByKey('name 2');
-
-          case 17:
-            test(1);
-
-          case 18:
-          case "end":
-            return _context19.stop();
-        }
+      while (1) switch (_context19.prev = _context19.next) {
+        case 0:
+          _mount20 = mount(ScrollToRowDemo), instance = _mount20[0], element = _mount20[1];
+          table = instance.refs.table;
+          scroll = element.querySelector('.k-table-wrapper');
+          tr = element.querySelector('tbody tr');
+          height = tr.offsetHeight;
+          test = function test(rows) {
+            expect(scroll.scrollTop).to.eql(height * rows);
+          };
+          _context19.next = 8;
+          return table.scrollToRowByIndex(2);
+        case 8:
+          test(2);
+          _context19.next = 11;
+          return table.scrollToRowByIndex(1);
+        case 11:
+          test(1);
+          _context19.next = 14;
+          return table.scrollToRowByKey('name 3');
+        case 14:
+          test(2);
+          _context19.next = 17;
+          return table.scrollToRowByKey('name 2');
+        case 17:
+          test(1);
+        case 18:
+        case "end":
+          return _context19.stop();
       }
     }, _callee19);
   })));
   it('render a hidden table with minWidth', function () {
     var Demo = /*#__PURE__*/function (_Component) {
       _inheritsLoose(Demo, _Component);
-
       function Demo() {
         var _context20;
-
         var _this;
-
         for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
           args[_key] = arguments[_key];
         }
-
         _this = _Component.call.apply(_Component, _concatInstanceProperty(_context20 = [this]).call(_context20, args)) || this;
         _this.Table = Table;
         _this.TableColumn = TableColumn;
         return _this;
       }
-
       return Demo;
     }(Component);
-
     Demo.template = "\n                const {Table, TableColumn} = this;\n                <div style=\"display: none;\">\n                    <Table>\n                        <TableColumn key=\"a\" minWidth={30} />\n                    </Table>\n                </div>\n            ";
-
     var _mount21 = mount(Demo),
-        element = _mount21[1];
-
+      element = _mount21[1];
     expect(element.innerHTML).to.matchSnapshot();
   });
   it('draggable', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee20() {
     var _mount22, instance, element, _element$querySelecto11, tr1, tr2, _element$getBoundingC, top;
-
     return _regeneratorRuntime.wrap(function _callee20$(_context21) {
-      while (1) {
-        switch (_context21.prev = _context21.next) {
-          case 0:
-            _mount22 = mount(DraggableTable), instance = _mount22[0], element = _mount22[1];
-            _element$querySelecto11 = element.querySelectorAll('tbody tr'), tr1 = _element$querySelecto11[0], tr2 = _element$querySelecto11[1];
-            _element$getBoundingC = element.getBoundingClientRect(), top = _element$getBoundingC.top;
-            dispatchEvent(tr2, 'dragstart');
-            dispatchEvent(tr1, 'dragover', {
-              clientY: top + 41 + 20
-            });
-            dispatchEvent(tr2, 'dragend');
-            _context21.next = 8;
-            return wait(500);
-
-          case 8:
-            expect(element.innerHTML).to.matchSnapshot();
-
-          case 9:
-          case "end":
-            return _context21.stop();
-        }
+      while (1) switch (_context21.prev = _context21.next) {
+        case 0:
+          _mount22 = mount(DraggableTable), instance = _mount22[0], element = _mount22[1];
+          _element$querySelecto11 = element.querySelectorAll('tbody tr'), tr1 = _element$querySelecto11[0], tr2 = _element$querySelecto11[1];
+          _element$getBoundingC = element.getBoundingClientRect(), top = _element$getBoundingC.top;
+          dispatchEvent(tr2, 'dragstart');
+          dispatchEvent(tr1, 'dragover', {
+            clientY: top + 41 + 20
+          });
+          dispatchEvent(tr2, 'dragend');
+          _context21.next = 8;
+          return wait(500);
+        case 8:
+          expect(element.innerHTML).to.matchSnapshot();
+        case 9:
+        case "end":
+          return _context21.stop();
       }
     }, _callee20);
   })));
   it('should not check all even though the keys is equal but the checkedKeys have some keys that not in rowKeys', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee21() {
     var Demo, _mount23, instance, element, table, checked;
-
     return _regeneratorRuntime.wrap(function _callee21$(_context23) {
-      while (1) {
-        switch (_context23.prev = _context23.next) {
-          case 0:
-            Demo = /*#__PURE__*/function (_Component2) {
-              _inheritsLoose(Demo, _Component2);
-
-              function Demo() {
-                var _context22;
-
-                var _this2;
-
-                for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
-                  args[_key2] = arguments[_key2];
-                }
-
-                _this2 = _Component2.call.apply(_Component2, _concatInstanceProperty(_context22 = [this]).call(_context22, args)) || this;
-                _this2.Table = Table;
-                _this2.TableColumn = TableColumn;
-                return _this2;
+      while (1) switch (_context23.prev = _context23.next) {
+        case 0:
+          Demo = /*#__PURE__*/function (_Component2) {
+            _inheritsLoose(Demo, _Component2);
+            function Demo() {
+              var _context22;
+              var _this2;
+              for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+                args[_key2] = arguments[_key2];
               }
-
-              Demo.defaults = function defaults() {
-                return {
-                  data: [{
-                    a: 1
-                  }, {
-                    a: 2
-                  }],
-                  checkedKeys: [3, 4]
-                };
+              _this2 = _Component2.call.apply(_Component2, _concatInstanceProperty(_context22 = [this]).call(_context22, args)) || this;
+              _this2.Table = Table;
+              _this2.TableColumn = TableColumn;
+              return _this2;
+            }
+            Demo.defaults = function defaults() {
+              return {
+                data: [{
+                  a: 1
+                }, {
+                  a: 2
+                }],
+                checkedKeys: [3, 4]
               };
-
-              return Demo;
-            }(Component);
-
-            Demo.template = "\n                const {Table, TableColumn} = this;\n                <Table v-model:checkedKeys=\"checkedKeys\"\n                    data={this.get('data')}\n                    rowKey={i => i.a}\n                    ref=\"table\"\n                    keepStatus={true}\n                >\n                    <TableColumn key=\"a\" />\n                </Table>\n            ";
-            _mount23 = mount(Demo), instance = _mount23[0], element = _mount23[1];
-            table = instance.refs.table;
-            checked = table.checked;
-            expect(checked.getAllCheckedStatus()).to.eql(AllCheckedStatus.None);
-            table.checkAll();
-            expect(instance.get('checkedKeys')).to.eql([3, 4, 1, 2]);
-            table.uncheckAll();
-            expect(instance.get('checkedKeys')).to.eql([3, 4]);
-            instance.set('checkedKeys', [3, 4, 1]);
-            _context23.next = 13;
-            return wait();
-
-          case 13:
-            expect(checked.getAllCheckedStatus()).to.eql(AllCheckedStatus.Indeterminate);
-            table.checkAll();
-            expect(instance.get('checkedKeys')).to.eql([3, 4, 1, 2]); // destroy one row
-
-            instance.set('data', [{
-              a: 1
-            }]);
-            _context23.next = 19;
-            return wait();
-
-          case 19:
-            expect(instance.get('checkedKeys')).to.eql([3, 4, 1, 2]);
-
-          case 20:
-          case "end":
-            return _context23.stop();
-        }
+            };
+            return Demo;
+          }(Component);
+          Demo.template = "\n                const {Table, TableColumn} = this;\n                <Table v-model:checkedKeys=\"checkedKeys\"\n                    data={this.get('data')}\n                    rowKey={i => i.a}\n                    ref=\"table\"\n                    keepStatus={true}\n                >\n                    <TableColumn key=\"a\" />\n                </Table>\n            ";
+          _mount23 = mount(Demo), instance = _mount23[0], element = _mount23[1];
+          table = instance.refs.table;
+          checked = table.checked;
+          expect(checked.getAllCheckedStatus()).to.eql(AllCheckedStatus.None);
+          table.checkAll();
+          expect(instance.get('checkedKeys')).to.eql([3, 4, 1, 2]);
+          table.uncheckAll();
+          expect(instance.get('checkedKeys')).to.eql([3, 4]);
+          instance.set('checkedKeys', [3, 4, 1]);
+          _context23.next = 13;
+          return wait();
+        case 13:
+          expect(checked.getAllCheckedStatus()).to.eql(AllCheckedStatus.Indeterminate);
+          table.checkAll();
+          expect(instance.get('checkedKeys')).to.eql([3, 4, 1, 2]);
+          // destroy one row
+          instance.set('data', [{
+            a: 1
+          }]);
+          _context23.next = 19;
+          return wait();
+        case 19:
+          expect(instance.get('checkedKeys')).to.eql([3, 4, 1, 2]);
+        case 20:
+        case "end":
+          return _context23.stop();
       }
     }, _callee21);
   })));
   it('should update children in TableCell', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee22() {
     var update, Test, Demo, _mount24, instance, element;
-
     return _regeneratorRuntime.wrap(function _callee22$(_context25) {
-      while (1) {
-        switch (_context25.prev = _context25.next) {
-          case 0:
-            update = sinon.spy();
-
-            Test = /*#__PURE__*/function (_Component3) {
-              _inheritsLoose(Test, _Component3);
-
-              function Test() {
-                return _Component3.apply(this, arguments) || this;
-              }
-
-              var _proto = Test.prototype;
-
-              _proto.beforeUpdate = function beforeUpdate() {
-                update();
-              };
-
-              return Test;
-            }(Component);
-
-            Test.template = "<div>test</div>";
-
-            Demo = /*#__PURE__*/function (_Component4) {
-              _inheritsLoose(Demo, _Component4);
-
-              function Demo() {
-                var _context24;
-
-                var _this3;
-
-                for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
-                  args[_key3] = arguments[_key3];
-                }
-
-                _this3 = _Component4.call.apply(_Component4, _concatInstanceProperty(_context24 = [this]).call(_context24, args)) || this;
-                _this3.Table = Table;
-                _this3.TableColumn = TableColumn;
-                _this3.Test = Test;
-                return _this3;
+      while (1) switch (_context25.prev = _context25.next) {
+        case 0:
+          update = sinon.spy();
+          Test = /*#__PURE__*/function (_Component3) {
+            _inheritsLoose(Test, _Component3);
+            function Test() {
+              return _Component3.apply(this, arguments) || this;
+            }
+            var _proto = Test.prototype;
+            _proto.beforeUpdate = function beforeUpdate() {
+              update();
+            };
+            return Test;
+          }(Component);
+          Test.template = "<div>test</div>";
+          Demo = /*#__PURE__*/function (_Component4) {
+            _inheritsLoose(Demo, _Component4);
+            function Demo() {
+              var _context24;
+              var _this3;
+              for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
+                args[_key3] = arguments[_key3];
               }
-
-              Demo.defaults = function defaults() {
-                return {
-                  data: [{
-                    a: 1
-                  }, {
-                    a: 2
-                  }]
-                };
+              _this3 = _Component4.call.apply(_Component4, _concatInstanceProperty(_context24 = [this]).call(_context24, args)) || this;
+              _this3.Table = Table;
+              _this3.TableColumn = TableColumn;
+              _this3.Test = Test;
+              return _this3;
+            }
+            Demo.defaults = function defaults() {
+              return {
+                data: [{
+                  a: 1
+                }, {
+                  a: 2
+                }]
               };
-
-              return Demo;
-            }(Component);
-
-            Demo.template = "\n                const {Table, TableColumn, Test} = this;\n                <Table data={this.get('data')} ref=\"table\">\n                    <TableColumn key=\"a\">\n                        <b:template>\n                            <Test />\n                        </b:template>\n                    </TableColumn>\n                </Table>\n            ";
-            _mount24 = mount(Demo), instance = _mount24[0], element = _mount24[1];
-            element.querySelector('tbody tr').click();
-            _context25.next = 9;
-            return wait();
-
-          case 9:
-            expect(update.callCount).to.eql(1);
-
-          case 10:
-          case "end":
-            return _context25.stop();
-        }
+            };
+            return Demo;
+          }(Component);
+          Demo.template = "\n                const {Table, TableColumn, Test} = this;\n                <Table data={this.get('data')} ref=\"table\">\n                    <TableColumn key=\"a\">\n                        <b:template>\n                            <Test />\n                        </b:template>\n                    </TableColumn>\n                </Table>\n            ";
+          _mount24 = mount(Demo), instance = _mount24[0], element = _mount24[1];
+          element.querySelector('tbody tr').click();
+          _context25.next = 9;
+          return wait();
+        case 9:
+          expect(update.callCount).to.eql(1);
+        case 10:
+        case "end":
+          return _context25.stop();
       }
     }, _callee22);
   })));
   it('pagination', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee23() {
     var _mount25, instance, element, table, pagination, spy;
-
     return _regeneratorRuntime.wrap(function _callee23$(_context26) {
-      while (1) {
-        switch (_context26.prev = _context26.next) {
-          case 0:
-            _mount25 = mount(PaginationDemo), instance = _mount25[0], element = _mount25[1];
-            table = instance.refs.table;
-            pagination = table.pagination.paginationRef;
-            spy = sinon.spy();
-            table.on('changePage', spy); // check all
-
-            table.checkAll();
-            expect(table.getCheckedData()).to.have.length(10); // next page
-
-            table.set('pagination', {
-              value: 2
-            });
-            table.trigger('$receive:pagination');
-            _context26.next = 11;
-            return wait();
-
-          case 11:
-            expect(table.getCheckedData()).to.have.length(0); // check all again
-
-            table.checkAll();
-            expect(table.getCheckedData()).to.have.length(10); // change limit
-
-            table.set('pagination', {
-              value: 1,
-              limit: 20
-            });
-            table.trigger('$receive:pagination');
-            _context26.next = 18;
-            return wait();
-
-          case 18:
-            expect(table.getCheckedData()).to.have.length(10); // check all again
-
-            table.checkAll();
-            expect(table.getCheckedData()).to.have.length(20); // change limit from pagination
-
-            pagination.value.set('limit', 10);
-            _context26.next = 24;
-            return wait();
-
-          case 24:
-            expect(table.getCheckedData()).to.have.length(10); // FIXME: Pagination component should no trigger change event multiple times
-            // when we set value and limit at the same time
-
-            expect(spy.callCount).to.eql(4);
-            expect(spy.lastCall.lastArg).to.eql({
-              value: 1,
-              limit: 10
-            }); // change page from pagination
-
-            _context26.next = 29;
-            return wait();
-
-          case 29:
-            pagination.value.changePage(2);
-            expect(table.getCheckedData()).to.have.length(0);
-            expect(spy.callCount).to.eql(5);
-            expect(spy.lastCall.lastArg).to.eql({
-              value: 2,
-              limit: 10
-            });
-
-          case 33:
-          case "end":
-            return _context26.stop();
-        }
+      while (1) switch (_context26.prev = _context26.next) {
+        case 0:
+          _mount25 = mount(PaginationDemo), instance = _mount25[0], element = _mount25[1];
+          table = instance.refs.table;
+          pagination = table.pagination.paginationRef;
+          spy = sinon.spy();
+          table.on('changePage', spy);
+          // check all
+          table.checkAll();
+          expect(table.getCheckedData()).to.have.length(10);
+          // next page
+          table.set('pagination', {
+            value: 2
+          });
+          table.trigger('$receive:pagination');
+          _context26.next = 11;
+          return wait();
+        case 11:
+          expect(table.getCheckedData()).to.have.length(0);
+          // check all again
+          table.checkAll();
+          expect(table.getCheckedData()).to.have.length(10);
+          // change limit
+          table.set('pagination', {
+            value: 1,
+            limit: 20
+          });
+          table.trigger('$receive:pagination');
+          _context26.next = 18;
+          return wait();
+        case 18:
+          expect(table.getCheckedData()).to.have.length(10);
+          // check all again
+          table.checkAll();
+          expect(table.getCheckedData()).to.have.length(20);
+          // change limit from pagination
+          pagination.value.set('limit', 10);
+          _context26.next = 24;
+          return wait();
+        case 24:
+          expect(table.getCheckedData()).to.have.length(10);
+          // FIXME: Pagination component should no trigger change event multiple times
+          // when we set value and limit at the same time
+          expect(spy.callCount).to.eql(4);
+          expect(spy.lastCall.lastArg).to.eql({
+            value: 1,
+            limit: 10
+          });
+          // change page from pagination
+          _context26.next = 29;
+          return wait();
+        case 29:
+          pagination.value.changePage(2);
+          expect(table.getCheckedData()).to.have.length(0);
+          expect(spy.callCount).to.eql(5);
+          expect(spy.lastCall.lastArg).to.eql({
+            value: 2,
+            limit: 10
+          });
+        case 33:
+        case "end":
+          return _context26.stop();
       }
     }, _callee23);
   })));