@king-design/vue 2.1.4 → 2.1.6

package/components/table/index.spec.js

@@ -31,943 +31,1147 @@ 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];
+      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;
               }
-              _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]
+
+              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];
+      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;
               }
-              _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
-                }]
+
+              var _proto = Test.prototype;
+
+              _proto.beforeUpdate = function beforeUpdate() {
+                update();
               };
-            };
-            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 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;
+              }
+
+              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();
+        }
       }
     }, _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);
   })));