@king-design/vue 3.1.4-beta.2 → 3.1.4

package/components/dropdown/index.spec.js

@@ -13,7 +13,8 @@ describe('Dropdown', function () {
   afterEach(function (done) {
     unmount();
     setTimeout(done, 500);
-  }); // it('demos test', () => {
+  });
+  // it('demos test', () => {
   // const req = require.context('~/components/dropdown/demos', true, /^((?!async).)*index\.js$/i);
   // req.keys().forEach(item => {
   // if (item.includes('contextmenu')) return;
@@ -28,399 +29,326 @@ describe('Dropdown', function () {
   // unmount(i);
   // });
   // });
-
   it('should save original events', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
     var _click, Demo, _mount, instance, element;
-
     return _regeneratorRuntime.wrap(function _callee$(_context2) {
-      while (1) {
-        switch (_context2.prev = _context2.next) {
-          case 0:
-            _click = sinon.spy();
-
-            Demo = /*#__PURE__*/function (_Component) {
-              _inheritsLoose(Demo, _Component);
-
-              function Demo() {
-                var _context;
-
-                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(_context = [this]).call(_context, args)) || this;
-                _this.Dropdown = Dropdown;
-                _this.DropdownItem = DropdownItem;
-                _this.DropdownMenu = DropdownMenu;
-                return _this;
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          _click = sinon.spy();
+          Demo = /*#__PURE__*/function (_Component) {
+            _inheritsLoose(Demo, _Component);
+            function Demo() {
+              var _context;
+              var _this;
+              for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+                args[_key] = arguments[_key];
               }
-
-              var _proto = Demo.prototype;
-
-              _proto.click = function click() {
-                _click();
-              };
-
-              return Demo;
-            }(Component);
-
-            Demo.template = "\n                const {Dropdown, DropdownItem, DropdownMenu} = this;\n                <div>\n                    <Dropdown>\n                        <div ref=\"test\" ev-click={this.click}>click</div>\n                        <DropdownMenu>\n                            <DropdownItem>test</DropdownItem>\n                        </DropdownMenu>\n                    </Dropdown>\n                </div>\n            ";
-            _mount = mount(Demo), instance = _mount[0], element = _mount[1];
-            instance.refs.test.click();
-            expect(_click.callCount).to.eql(1);
-            _context2.next = 8;
-            return wait();
-
-          case 8:
-            expect(getElement('.k-dropdown-menu').innerHTML).to.matchSnapshot();
-
-          case 9:
-          case "end":
-            return _context2.stop();
-        }
+              _this = _Component.call.apply(_Component, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
+              _this.Dropdown = Dropdown;
+              _this.DropdownItem = DropdownItem;
+              _this.DropdownMenu = DropdownMenu;
+              return _this;
+            }
+            var _proto = Demo.prototype;
+            _proto.click = function click() {
+              _click();
+            };
+            return Demo;
+          }(Component);
+          Demo.template = "\n                const {Dropdown, DropdownItem, DropdownMenu} = this;\n                <div>\n                    <Dropdown>\n                        <div ref=\"test\" ev-click={this.click}>click</div>\n                        <DropdownMenu>\n                            <DropdownItem>test</DropdownItem>\n                        </DropdownMenu>\n                    </Dropdown>\n                </div>\n            ";
+          _mount = mount(Demo), instance = _mount[0], element = _mount[1];
+          instance.refs.test.click();
+          expect(_click.callCount).to.eql(1);
+          _context2.next = 8;
+          return wait();
+        case 8:
+          expect(getElement('.k-dropdown-menu').innerHTML).to.matchSnapshot();
+        case 9:
+        case "end":
+          return _context2.stop();
       }
     }, _callee);
   })));
   it('should move mouse to dropdown menu', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
     var _mount2, instance, element, dropdown;
-
     return _regeneratorRuntime.wrap(function _callee2$(_context3) {
-      while (1) {
-        switch (_context3.prev = _context3.next) {
-          case 0:
-            _mount2 = mount(BasicDemo), instance = _mount2[0], element = _mount2[1];
-            dispatchEvent(element.firstElementChild, 'mouseenter');
-            _context3.next = 4;
-            return wait();
-
-          case 4:
-            dropdown = getElement('.k-dropdown-menu');
-            expect(dropdown.innerHTML).to.matchSnapshot();
-            dispatchEvent(element.firstElementChild, 'mouseleave');
-            dispatchEvent(dropdown, 'mouseenter');
-            _context3.next = 10;
-            return wait(500);
-
-          case 10:
-            expect(dropdown.parentNode).to.exist;
-
-          case 11:
-          case "end":
-            return _context3.stop();
-        }
+      while (1) switch (_context3.prev = _context3.next) {
+        case 0:
+          _mount2 = mount(BasicDemo), instance = _mount2[0], element = _mount2[1];
+          dispatchEvent(element.firstElementChild, 'mouseenter');
+          _context3.next = 4;
+          return wait();
+        case 4:
+          dropdown = getElement('.k-dropdown-menu');
+          expect(dropdown.innerHTML).to.matchSnapshot();
+          dispatchEvent(element.firstElementChild, 'mouseleave');
+          dispatchEvent(dropdown, 'mouseenter');
+          _context3.next = 10;
+          return wait(500);
+        case 10:
+          expect(dropdown.parentNode).to.exist;
+        case 11:
+        case "end":
+          return _context3.stop();
       }
     }, _callee2);
   })));
   it('nested dropdown', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
     var _mount3, instance, element, dropdown, _dropdown$querySelect, hoverItem, clickItem, clickSubDropdown, hoverSubDropdown, _hoverSubDropdown$que, hoverItem1, hoverSubDropdown1, _hoverSubDropdown1$qu, hoverItem2, hoverSubDropdown2;
-
     return _regeneratorRuntime.wrap(function _callee3$(_context4) {
-      while (1) {
-        switch (_context4.prev = _context4.next) {
-          case 0:
-            this.timeout(0);
-            _mount3 = mount(NestedDemo), instance = _mount3[0], element = _mount3[1];
-            element.firstElementChild.click();
-            _context4.next = 5;
-            return wait();
-
-          case 5:
-            dropdown = getElement('.k-dropdown-menu');
-            _dropdown$querySelect = dropdown.querySelectorAll(':scope > .k-dropdown-item'), hoverItem = _dropdown$querySelect[3], clickItem = _dropdown$querySelect[4];
-            clickItem.click();
-            _context4.next = 10;
-            return wait(500);
-
-          case 10:
-            clickSubDropdown = getElement('.k-dropdown-menu');
-            expect(clickSubDropdown.innerHTML).to.matchSnapshot(); // should hide last sub-dropdown and show next
-
-            dispatchEvent(hoverItem, 'mouseenter');
-            _context4.next = 15;
-            return wait(500);
-
-          case 15:
-            hoverSubDropdown = getElement('.k-dropdown-menu');
-            expect(hoverSubDropdown.innerHTML).to.matchSnapshot();
-            _hoverSubDropdown$que = hoverSubDropdown.querySelectorAll('.k-dropdown-item'), hoverItem1 = _hoverSubDropdown$que[0];
-            dispatchEvent(hoverItem, 'mouseleave');
-            dispatchEvent(hoverItem1, 'mouseenter');
-            _context4.next = 22;
-            return wait(500);
-
-          case 22:
-            hoverSubDropdown1 = getElement('.k-dropdown-menu');
-            expect(hoverSubDropdown1.textContent).to.eql('item 1item 2');
-            _hoverSubDropdown1$qu = hoverSubDropdown1.querySelectorAll('.k-dropdown-item'), hoverItem2 = _hoverSubDropdown1$qu[0];
-            dispatchEvent(hoverItem1, 'mouseleave');
-            dispatchEvent(hoverItem2, 'mouseenter');
-            _context4.next = 29;
-            return wait(1000);
-
-          case 29:
-            hoverSubDropdown2 = getElement('.k-dropdown-menu');
-            expect(hoverSubDropdown2 === hoverSubDropdown1).to.be.true;
-
-          case 31:
-          case "end":
-            return _context4.stop();
-        }
+      while (1) switch (_context4.prev = _context4.next) {
+        case 0:
+          this.timeout(0);
+          _mount3 = mount(NestedDemo), instance = _mount3[0], element = _mount3[1];
+          element.firstElementChild.click();
+          _context4.next = 5;
+          return wait();
+        case 5:
+          dropdown = getElement('.k-dropdown-menu');
+          _dropdown$querySelect = dropdown.querySelectorAll(':scope > .k-dropdown-item'), hoverItem = _dropdown$querySelect[3], clickItem = _dropdown$querySelect[4];
+          clickItem.click();
+          _context4.next = 10;
+          return wait(500);
+        case 10:
+          clickSubDropdown = getElement('.k-dropdown-menu');
+          expect(clickSubDropdown.innerHTML).to.matchSnapshot();
+          // should hide last sub-dropdown and show next
+          dispatchEvent(hoverItem, 'mouseenter');
+          _context4.next = 15;
+          return wait(500);
+        case 15:
+          hoverSubDropdown = getElement('.k-dropdown-menu');
+          expect(hoverSubDropdown.innerHTML).to.matchSnapshot();
+          _hoverSubDropdown$que = hoverSubDropdown.querySelectorAll('.k-dropdown-item'), hoverItem1 = _hoverSubDropdown$que[0];
+          dispatchEvent(hoverItem, 'mouseleave');
+          dispatchEvent(hoverItem1, 'mouseenter');
+          _context4.next = 22;
+          return wait(500);
+        case 22:
+          hoverSubDropdown1 = getElement('.k-dropdown-menu');
+          expect(hoverSubDropdown1.textContent).to.eql('item 1item 2');
+          _hoverSubDropdown1$qu = hoverSubDropdown1.querySelectorAll('.k-dropdown-item'), hoverItem2 = _hoverSubDropdown1$qu[0];
+          dispatchEvent(hoverItem1, 'mouseleave');
+          dispatchEvent(hoverItem2, 'mouseenter');
+          _context4.next = 29;
+          return wait(1000);
+        case 29:
+          hoverSubDropdown2 = getElement('.k-dropdown-menu');
+          expect(hoverSubDropdown2 === hoverSubDropdown1).to.be.true;
+        case 31:
+        case "end":
+          return _context4.stop();
       }
     }, _callee3, this);
   })));
   it('hide on click document', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
     var _mount4, instance, element;
-
     return _regeneratorRuntime.wrap(function _callee4$(_context5) {
-      while (1) {
-        switch (_context5.prev = _context5.next) {
-          case 0:
-            _mount4 = mount(BasicDemo), instance = _mount4[0], element = _mount4[1];
-            dispatchEvent(element.firstElementChild, 'mouseenter');
-            _context5.next = 4;
-            return wait();
-
-          case 4:
-            dispatchEvent(document, 'click');
-            _context5.next = 7;
-            return wait(500);
-
-          case 7:
-            expect(getElement('.k-dropdown-menu')).not.exist;
-
-          case 8:
-          case "end":
-            return _context5.stop();
-        }
+      while (1) switch (_context5.prev = _context5.next) {
+        case 0:
+          _mount4 = mount(BasicDemo), instance = _mount4[0], element = _mount4[1];
+          dispatchEvent(element.firstElementChild, 'mouseenter');
+          _context5.next = 4;
+          return wait();
+        case 4:
+          dispatchEvent(document, 'click');
+          _context5.next = 7;
+          return wait(500);
+        case 7:
+          expect(getElement('.k-dropdown-menu')).not.exist;
+        case 8:
+        case "end":
+          return _context5.stop();
       }
     }, _callee4);
   })));
   it('operate by keyboard', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
     var _mount5, instance, element, dropdown, subDropdown, subDropdown1;
-
     return _regeneratorRuntime.wrap(function _callee5$(_context6) {
-      while (1) {
-        switch (_context6.prev = _context6.next) {
-          case 0:
-            _mount5 = mount(NestedDemo), instance = _mount5[0], element = _mount5[1];
-            dispatchEvent(element.firstElementChild, 'click');
-            _context6.next = 4;
-            return wait();
-
-          case 4:
-            dropdown = getElement('.k-dropdown-menu'); // down
-
-            dispatchEvent(document, 'keydown', {
-              keyCode: 40
-            });
-            _context6.next = 8;
-            return wait();
-
-          case 8:
-            expect(dropdown.innerHTML).to.matchSnapshot(); // up
-
-            dispatchEvent(document, 'keydown', {
-              keyCode: 38
-            });
-            _context6.next = 12;
-            return wait();
-
-          case 12:
-            expect(dropdown.innerHTML).to.matchSnapshot(); // up and enter
-
-            dispatchEvent(document, 'keydown', {
-              keyCode: 38
-            });
-            dispatchEvent(document, 'keydown', {
-              keyCode: 13
-            });
-            _context6.next = 17;
-            return wait();
-
-          case 17:
-            subDropdown = getElement('.k-dropdown-menu');
-            expect(subDropdown.innerHTML).to.matchSnapshot(); // right
-
-            dispatchEvent(document, 'keydown', {
-              keyCode: 39
-            });
-            _context6.next = 22;
-            return wait();
-
-          case 22:
-            subDropdown1 = getElement('.k-dropdown-menu');
-            expect(subDropdown1.innerHTML).to.matchSnapshot(); // left
-
-            dispatchEvent(document, 'keydown', {
-              keyCode: 37
-            });
-            _context6.next = 27;
-            return wait(500);
-
-          case 27:
-            expect(subDropdown1.style.display).to.eql('none'); // down in sub-menu
-
-            dispatchEvent(document, 'keydown', {
-              keyCode: 40
-            });
-            _context6.next = 31;
-            return wait();
-
-          case 31:
-            expect(subDropdown.innerHTML).to.matchSnapshot(); // select and hide
-
-            dispatchEvent(document, 'keydown', {
-              keyCode: 13
-            });
-            _context6.next = 35;
-            return wait(500);
-
-          case 35:
-            expect(getElement('.k-dropdown-menu')).not.exist;
-
-          case 36:
-          case "end":
-            return _context6.stop();
-        }
+      while (1) switch (_context6.prev = _context6.next) {
+        case 0:
+          _mount5 = mount(NestedDemo), instance = _mount5[0], element = _mount5[1];
+          dispatchEvent(element.firstElementChild, 'click');
+          _context6.next = 4;
+          return wait();
+        case 4:
+          dropdown = getElement('.k-dropdown-menu'); // down
+          dispatchEvent(document, 'keydown', {
+            keyCode: 40
+          });
+          _context6.next = 8;
+          return wait();
+        case 8:
+          expect(dropdown.innerHTML).to.matchSnapshot();
+          // up
+          dispatchEvent(document, 'keydown', {
+            keyCode: 38
+          });
+          _context6.next = 12;
+          return wait();
+        case 12:
+          expect(dropdown.innerHTML).to.matchSnapshot();
+          // up and enter
+          dispatchEvent(document, 'keydown', {
+            keyCode: 38
+          });
+          dispatchEvent(document, 'keydown', {
+            keyCode: 13
+          });
+          _context6.next = 17;
+          return wait();
+        case 17:
+          subDropdown = getElement('.k-dropdown-menu');
+          expect(subDropdown.innerHTML).to.matchSnapshot();
+          // right
+          dispatchEvent(document, 'keydown', {
+            keyCode: 39
+          });
+          _context6.next = 22;
+          return wait();
+        case 22:
+          subDropdown1 = getElement('.k-dropdown-menu');
+          expect(subDropdown1.innerHTML).to.matchSnapshot();
+          // left
+          dispatchEvent(document, 'keydown', {
+            keyCode: 37
+          });
+          _context6.next = 27;
+          return wait(500);
+        case 27:
+          expect(subDropdown1.style.display).to.eql('none');
+          // down in sub-menu
+          dispatchEvent(document, 'keydown', {
+            keyCode: 40
+          });
+          _context6.next = 31;
+          return wait();
+        case 31:
+          expect(subDropdown.innerHTML).to.matchSnapshot();
+          // select and hide
+          dispatchEvent(document, 'keydown', {
+            keyCode: 13
+          });
+          _context6.next = 35;
+          return wait(500);
+        case 35:
+          expect(getElement('.k-dropdown-menu')).not.exist;
+        case 36:
+        case "end":
+          return _context6.stop();
       }
     }, _callee5);
   })));
   it('context menu', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee6() {
     var _mount6, instance, element, dropdown;
-
     return _regeneratorRuntime.wrap(function _callee6$(_context7) {
-      while (1) {
-        switch (_context7.prev = _context7.next) {
-          case 0:
-            _mount6 = mount(ContextMenuDemo), instance = _mount6[0], element = _mount6[1];
-            dispatchEvent(element, 'contextmenu', {
-              pageX: 10,
-              pageY: 10
-            });
-            _context7.next = 4;
-            return wait();
-
-          case 4:
-            dropdown = getElement('.k-dropdown-menu');
-            expect(dropdown.style.left).to.eql('10px');
-            dispatchEvent(element, 'contextmenu', {
-              pageX: 11,
-              pageY: 11
-            });
-            _context7.next = 9;
-            return wait();
-
-          case 9:
-            expect(dropdown.style.left).to.eql('11px');
-            _context7.next = 12;
-            return wait(500);
-
-          case 12:
-            expect(dropdown.style.display).to.eql('');
-
-          case 13:
-          case "end":
-            return _context7.stop();
-        }
+      while (1) switch (_context7.prev = _context7.next) {
+        case 0:
+          _mount6 = mount(ContextMenuDemo), instance = _mount6[0], element = _mount6[1];
+          dispatchEvent(element, 'contextmenu', {
+            pageX: 10,
+            pageY: 10
+          });
+          _context7.next = 4;
+          return wait();
+        case 4:
+          dropdown = getElement('.k-dropdown-menu');
+          expect(dropdown.style.left).to.eql('10px');
+          dispatchEvent(element, 'contextmenu', {
+            pageX: 11,
+            pageY: 11
+          });
+          _context7.next = 9;
+          return wait();
+        case 9:
+          expect(dropdown.style.left).to.eql('11px');
+          _context7.next = 12;
+          return wait(500);
+        case 12:
+          expect(dropdown.style.display).to.eql('');
+        case 13:
+        case "end":
+          return _context7.stop();
       }
     }, _callee6);
   })));
   it('click mouse and move outside should not hide menu', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee7() {
     var _mount7, instance, element, dropdown, _dropdown$querySelect2, hoverItem, clickItem, clickSubDropdown;
-
     return _regeneratorRuntime.wrap(function _callee7$(_context8) {
-      while (1) {
-        switch (_context8.prev = _context8.next) {
-          case 0:
-            _mount7 = mount(NestedDemo), instance = _mount7[0], element = _mount7[1];
-            element.firstChild.click();
-            _context8.next = 4;
-            return wait();
-
-          case 4:
-            dropdown = getElement('.k-dropdown-menu');
-            dispatchEvent(dropdown, 'mousedown');
-            dispatchEvent(document, 'mouseup');
-            dispatchEvent(document, 'click');
-            _context8.next = 10;
-            return wait(500);
-
-          case 10:
-            expect(dropdown.style.display).to.eql(''); // on submenu
-
-            _dropdown$querySelect2 = dropdown.querySelectorAll(':scope > .k-dropdown-item'), hoverItem = _dropdown$querySelect2[3], clickItem = _dropdown$querySelect2[4];
-            clickItem.click();
-            _context8.next = 15;
-            return wait();
-
-          case 15:
-            clickSubDropdown = getElement('.k-dropdown-menu');
-            dispatchEvent(clickSubDropdown, 'mousedown');
-            dispatchEvent(document, 'mouseup');
-            dispatchEvent(document, 'click');
-            _context8.next = 21;
-            return wait(500);
-
-          case 21:
-            expect(dropdown.style.display).to.eql('');
-            expect(clickSubDropdown.style.display).to.eql(''); // should hide on click document directly
-
-            dispatchEvent(document, 'click');
-            _context8.next = 26;
-            return wait(500);
-
-          case 26:
-            expect(getElement('.k-dropdown-menu')).to.be.undefined;
-
-          case 27:
-          case "end":
-            return _context8.stop();
-        }
+      while (1) switch (_context8.prev = _context8.next) {
+        case 0:
+          _mount7 = mount(NestedDemo), instance = _mount7[0], element = _mount7[1];
+          element.firstChild.click();
+          _context8.next = 4;
+          return wait();
+        case 4:
+          dropdown = getElement('.k-dropdown-menu');
+          dispatchEvent(dropdown, 'mousedown');
+          dispatchEvent(document, 'mouseup');
+          dispatchEvent(document, 'click');
+          _context8.next = 10;
+          return wait(500);
+        case 10:
+          expect(dropdown.style.display).to.eql('');
+          // on submenu
+          _dropdown$querySelect2 = dropdown.querySelectorAll(':scope > .k-dropdown-item'), hoverItem = _dropdown$querySelect2[3], clickItem = _dropdown$querySelect2[4];
+          clickItem.click();
+          _context8.next = 15;
+          return wait();
+        case 15:
+          clickSubDropdown = getElement('.k-dropdown-menu');
+          dispatchEvent(clickSubDropdown, 'mousedown');
+          dispatchEvent(document, 'mouseup');
+          dispatchEvent(document, 'click');
+          _context8.next = 21;
+          return wait(500);
+        case 21:
+          expect(dropdown.style.display).to.eql('');
+          expect(clickSubDropdown.style.display).to.eql('');
+          // should hide on click document directly
+          dispatchEvent(document, 'click');
+          _context8.next = 26;
+          return wait(500);
+        case 26:
+          expect(getElement('.k-dropdown-menu')).to.be.undefined;
+        case 27:
+        case "end":
+          return _context8.stop();
       }
     }, _callee7);
   })));
   it('should throw error if has whitespace between real elements', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee8() {
     var Demo;
     return _regeneratorRuntime.wrap(function _callee8$(_context10) {
-      while (1) {
-        switch (_context10.prev = _context10.next) {
-          case 0:
-            Demo = /*#__PURE__*/function (_Component2) {
-              _inheritsLoose(Demo, _Component2);
-
-              function Demo() {
-                var _context9;
-
-                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(_context9 = [this]).call(_context9, args)) || this;
-                _this2.Dropdown = Dropdown;
-                _this2.DropdownItem = DropdownItem;
-                _this2.DropdownMenu = DropdownMenu;
-                return _this2;
+      while (1) switch (_context10.prev = _context10.next) {
+        case 0:
+          Demo = /*#__PURE__*/function (_Component2) {
+            _inheritsLoose(Demo, _Component2);
+            function Demo() {
+              var _context9;
+              var _this2;
+              for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+                args[_key2] = arguments[_key2];
               }
-
-              return Demo;
-            }(Component);
-
-            Demo.template = "\n                const {Dropdown, DropdownMenu, DropdownItem} = this;\n                <div>\n                    <Dropdown>\n                        {''}\n                        <div ref=\"trigger\">hover</div>\n                        {''}\n                        <DropdownMenu>\n                            <DropdownItem>test</DropdownItem>\n                        </DropdownMenu>\n                    </Dropdown>\n                </div>\n            ";
-            expect(function () {
-              return mount(Demo);
-            }).to.throw;
-
-          case 3:
-          case "end":
-            return _context10.stop();
-        }
+              _this2 = _Component2.call.apply(_Component2, _concatInstanceProperty(_context9 = [this]).call(_context9, args)) || this;
+              _this2.Dropdown = Dropdown;
+              _this2.DropdownItem = DropdownItem;
+              _this2.DropdownMenu = DropdownMenu;
+              return _this2;
+            }
+            return Demo;
+          }(Component);
+          Demo.template = "\n                const {Dropdown, DropdownMenu, DropdownItem} = this;\n                <div>\n                    <Dropdown>\n                        {''}\n                        <div ref=\"trigger\">hover</div>\n                        {''}\n                        <DropdownMenu>\n                            <DropdownItem>test</DropdownItem>\n                        </DropdownMenu>\n                    </Dropdown>\n                </div>\n            ";
+          expect(function () {
+            return mount(Demo);
+          }).to.throw;
+        case 3:
+        case "end":
+          return _context10.stop();
       }
     }, _callee8);
-  }))); // it('should hydrate dropdown correctly', () => {
+  })));
+  // it('should hydrate dropdown correctly', () => {
   // class Demo extends Component {
   // static template = `
   // const {Dropdown, DropdownMenu, DropdownItem} = this;
@@ -449,174 +377,138 @@ describe('Dropdown', function () {
   // demo.destroy();
   // document.body.removeChild(container);
   // });
-
   it('should scroll to view when we focus on DropdownItem', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee9() {
     var Demo, _mount8, instance, element, dropdown, _dropdown$querySelect3, item, parent;
-
     return _regeneratorRuntime.wrap(function _callee9$(_context12) {
-      while (1) {
-        switch (_context12.prev = _context12.next) {
-          case 0:
-            Demo = /*#__PURE__*/function (_Component3) {
-              _inheritsLoose(Demo, _Component3);
-
-              function Demo() {
-                var _context11;
-
-                var _this3;
-
-                for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
-                  args[_key3] = arguments[_key3];
-                }
-
-                _this3 = _Component3.call.apply(_Component3, _concatInstanceProperty(_context11 = [this]).call(_context11, args)) || this;
-                _this3.Dropdown = Dropdown;
-                _this3.DropdownItem = DropdownItem;
-                _this3.DropdownMenu = DropdownMenu;
-                return _this3;
+      while (1) switch (_context12.prev = _context12.next) {
+        case 0:
+          Demo = /*#__PURE__*/function (_Component3) {
+            _inheritsLoose(Demo, _Component3);
+            function Demo() {
+              var _context11;
+              var _this3;
+              for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
+                args[_key3] = arguments[_key3];
               }
-
-              return Demo;
-            }(Component);
-
-            Demo.template = "\n                const {Dropdown, DropdownMenu, DropdownItem} = this;\n                <div>\n                    <Dropdown>\n                        <div ref=\"trigger\">hover</div>\n                        <DropdownMenu>\n                            <div style=\"height: 40px; overflow: auto;\">\n                                <DropdownItem>test1</DropdownItem>\n                                <DropdownItem>test2</DropdownItem>\n                            </div>\n                        </DropdownMenu>\n                    </Dropdown>\n                </div>\n            ";
-            _mount8 = mount(Demo), instance = _mount8[0], element = _mount8[1];
-            dispatchEvent(instance.refs.trigger, 'mouseenter');
-            _context12.next = 6;
-            return wait(500);
-
-          case 6:
-            dropdown = getElement('.k-dropdown-menu');
-            _dropdown$querySelect3 = dropdown.querySelectorAll('.k-dropdown-item'), item = _dropdown$querySelect3[1];
-            parent = item.parentNode;
-            dispatchEvent(item, 'mouseenter');
-            _context12.next = 12;
-            return wait();
-
-          case 12:
-            expect(parent.scrollTop).to.eql(item.offsetHeight * 2 - 40);
-
-          case 13:
-          case "end":
-            return _context12.stop();
-        }
+              _this3 = _Component3.call.apply(_Component3, _concatInstanceProperty(_context11 = [this]).call(_context11, args)) || this;
+              _this3.Dropdown = Dropdown;
+              _this3.DropdownItem = DropdownItem;
+              _this3.DropdownMenu = DropdownMenu;
+              return _this3;
+            }
+            return Demo;
+          }(Component);
+          Demo.template = "\n                const {Dropdown, DropdownMenu, DropdownItem} = this;\n                <div>\n                    <Dropdown>\n                        <div ref=\"trigger\">hover</div>\n                        <DropdownMenu>\n                            <div style=\"height: 40px; overflow: auto;\">\n                                <DropdownItem>test1</DropdownItem>\n                                <DropdownItem>test2</DropdownItem>\n                            </div>\n                        </DropdownMenu>\n                    </Dropdown>\n                </div>\n            ";
+          _mount8 = mount(Demo), instance = _mount8[0], element = _mount8[1];
+          dispatchEvent(instance.refs.trigger, 'mouseenter');
+          _context12.next = 6;
+          return wait(500);
+        case 6:
+          dropdown = getElement('.k-dropdown-menu');
+          _dropdown$querySelect3 = dropdown.querySelectorAll('.k-dropdown-item'), item = _dropdown$querySelect3[1];
+          parent = item.parentNode;
+          dispatchEvent(item, 'mouseenter');
+          _context12.next = 12;
+          return wait();
+        case 12:
+          expect(parent.scrollTop).to.eql(item.offsetHeight * 2 - 40);
+        case 13:
+        case "end":
+          return _context12.stop();
       }
     }, _callee9);
   })));
   it('focus trigger type', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee10() {
     var Demo, _mount9, instance;
-
     return _regeneratorRuntime.wrap(function _callee10$(_context14) {
-      while (1) {
-        switch (_context14.prev = _context14.next) {
-          case 0:
-            Demo = /*#__PURE__*/function (_Component4) {
-              _inheritsLoose(Demo, _Component4);
-
-              function Demo() {
-                var _context13;
-
-                var _this4;
-
-                for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
-                  args[_key4] = arguments[_key4];
-                }
-
-                _this4 = _Component4.call.apply(_Component4, _concatInstanceProperty(_context13 = [this]).call(_context13, args)) || this;
-                _this4.Dropdown = Dropdown;
-                _this4.DropdownItem = DropdownItem;
-                _this4.DropdownMenu = DropdownMenu;
-                _this4.onFocus = sinon.spy(function (e) {
-                  return console.log(e);
-                });
-                return _this4;
+      while (1) switch (_context14.prev = _context14.next) {
+        case 0:
+          Demo = /*#__PURE__*/function (_Component4) {
+            _inheritsLoose(Demo, _Component4);
+            function Demo() {
+              var _context13;
+              var _this4;
+              for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
+                args[_key4] = arguments[_key4];
               }
-
-              return Demo;
-            }(Component);
-
-            Demo.template = "\n                const {Dropdown, DropdownMenu, DropdownItem} = this;\n                <div>\n                    <Dropdown trigger=\"focus\">\n                        <input ref=\"trigger\" ev-focusin={this.onFocus} />\n                        <DropdownMenu>\n                            <DropdownItem>test1</DropdownItem>\n                            <DropdownItem>test2</DropdownItem>\n                        </DropdownMenu>\n                    </Dropdown>\n                </div>\n            ";
-            _mount9 = mount(Demo), instance = _mount9[0];
-            dispatchEvent(instance.refs.trigger, 'focusin');
-            _context14.next = 6;
-            return wait(500);
-
-          case 6:
-            expect(getElement('.k-dropdown-menu')).to.be.exist;
-            expect(instance.onFocus.callCount).to.eql(1); // clicking anywhere should not hide menu
-
-            dispatchEvent(document, 'click');
-            _context14.next = 11;
-            return wait(500);
-
-          case 11:
-            expect(getElement('.k-dropdown-menu')).to.be.exist;
-            dispatchEvent(instance.refs.trigger, 'focusout');
-            _context14.next = 15;
-            return wait(700);
-
-          case 15:
-            expect(getElement('.k-dropdown-menu')).to.not.be.exist;
-
-          case 16:
-          case "end":
-            return _context14.stop();
-        }
+              _this4 = _Component4.call.apply(_Component4, _concatInstanceProperty(_context13 = [this]).call(_context13, args)) || this;
+              _this4.Dropdown = Dropdown;
+              _this4.DropdownItem = DropdownItem;
+              _this4.DropdownMenu = DropdownMenu;
+              _this4.onFocus = sinon.spy(function (e) {
+                return console.log(e);
+              });
+              return _this4;
+            }
+            return Demo;
+          }(Component);
+          Demo.template = "\n                const {Dropdown, DropdownMenu, DropdownItem} = this;\n                <div>\n                    <Dropdown trigger=\"focus\">\n                        <input ref=\"trigger\" ev-focusin={this.onFocus} />\n                        <DropdownMenu>\n                            <DropdownItem>test1</DropdownItem>\n                            <DropdownItem>test2</DropdownItem>\n                        </DropdownMenu>\n                    </Dropdown>\n                </div>\n            ";
+          _mount9 = mount(Demo), instance = _mount9[0];
+          dispatchEvent(instance.refs.trigger, 'focusin');
+          _context14.next = 6;
+          return wait(500);
+        case 6:
+          expect(getElement('.k-dropdown-menu')).to.be.exist;
+          expect(instance.onFocus.callCount).to.eql(1);
+          // clicking anywhere should not hide menu
+          dispatchEvent(document, 'click');
+          _context14.next = 11;
+          return wait(500);
+        case 11:
+          expect(getElement('.k-dropdown-menu')).to.be.exist;
+          dispatchEvent(instance.refs.trigger, 'focusout');
+          _context14.next = 15;
+          return wait(700);
+        case 15:
+          expect(getElement('.k-dropdown-menu')).to.not.be.exist;
+        case 16:
+        case "end":
+          return _context14.stop();
       }
     }, _callee10);
   })));
   it('wrap by tooltip', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee11() {
     var _mount10, instance, element, dropdown, _dropdown$querySelect4, item1, item2, item3, item4;
-
     return _regeneratorRuntime.wrap(function _callee11$(_context15) {
-      while (1) {
-        switch (_context15.prev = _context15.next) {
-          case 0:
-            _mount10 = mount(TooltipDemo), instance = _mount10[0], element = _mount10[1];
-            dispatchEvent(element.firstChild, 'mouseenter');
-            _context15.next = 4;
-            return wait();
-
-          case 4:
-            dropdown = getElement('.k-dropdown-menu');
-            _dropdown$querySelect4 = dropdown.querySelectorAll('.k-dropdown-item'), item1 = _dropdown$querySelect4[0], item2 = _dropdown$querySelect4[1], item3 = _dropdown$querySelect4[2], item4 = _dropdown$querySelect4[3];
-            dispatchEvent(item1, 'mouseenter');
-            _context15.next = 9;
-            return wait();
-
-          case 9:
-            expect(getElement('.k-tooltip-content').textContent).to.eql('item 1');
-            dispatchEvent(item1, 'mouseleave');
-            dispatchEvent(item3, 'mouseenter');
-            _context15.next = 14;
-            return wait();
-
-          case 14:
-            expect(getElement('.k-tooltip-content').textContent).to.eql('disabled');
-            dispatchEvent(item3, 'mouseleave');
-            dispatchEvent(item4, 'mouseenter');
-            _context15.next = 19;
-            return wait();
-
-          case 19:
-            expect(getElement('.k-tooltip-content').textContent).to.eql('This is a nested Dropdown.');
-            dispatchEvent(item4, 'click');
-            _context15.next = 23;
-            return wait();
-
-          case 23:
-            expect(getElement('.k-dropdown-menu').textContent).to.eql('item 1item 2');
-            dispatchEvent(item4, 'mouseleave');
-            _context15.next = 27;
-            return wait(800);
-
-          case 27:
-            expect(getElement('.k-dropdown-menu')).to.not.be.exist;
-
-          case 28:
-          case "end":
-            return _context15.stop();
-        }
+      while (1) switch (_context15.prev = _context15.next) {
+        case 0:
+          _mount10 = mount(TooltipDemo), instance = _mount10[0], element = _mount10[1];
+          dispatchEvent(element.firstChild, 'mouseenter');
+          _context15.next = 4;
+          return wait();
+        case 4:
+          dropdown = getElement('.k-dropdown-menu');
+          _dropdown$querySelect4 = dropdown.querySelectorAll('.k-dropdown-item'), item1 = _dropdown$querySelect4[0], item2 = _dropdown$querySelect4[1], item3 = _dropdown$querySelect4[2], item4 = _dropdown$querySelect4[3];
+          dispatchEvent(item1, 'mouseenter');
+          _context15.next = 9;
+          return wait();
+        case 9:
+          expect(getElement('.k-tooltip-content').textContent).to.eql('item 1');
+          dispatchEvent(item1, 'mouseleave');
+          dispatchEvent(item3, 'mouseenter');
+          _context15.next = 14;
+          return wait();
+        case 14:
+          expect(getElement('.k-tooltip-content').textContent).to.eql('disabled');
+          dispatchEvent(item3, 'mouseleave');
+          dispatchEvent(item4, 'mouseenter');
+          _context15.next = 19;
+          return wait();
+        case 19:
+          expect(getElement('.k-tooltip-content').textContent).to.eql('This is a nested Dropdown.');
+          dispatchEvent(item4, 'click');
+          _context15.next = 23;
+          return wait();
+        case 23:
+          expect(getElement('.k-dropdown-menu').textContent).to.eql('item 1item 2');
+          dispatchEvent(item4, 'mouseleave');
+          _context15.next = 27;
+          return wait(800);
+        case 27:
+          expect(getElement('.k-dropdown-menu')).to.not.be.exist;
+        case 28:
+        case "end":
+          return _context15.stop();
       }
     }, _callee11);
   })));