UNPKG

@wix/design-system

Version:

@wix/design-system

356 lines (353 loc) 17.5 kB
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator"; var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/esm/SidebarNext/test/SidebarNextWrapper.spec.jsx", _this = this; function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i["return"]) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); } function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); } import React from 'react'; import SidebarNext from '../SidebarNext'; import { sidebarNextPrivateDriverFactory } from './SidebarNext.private.uni.driver'; import { createRendererWithUniDriver } from '../../utils/test-utils/unit'; import SidebarItemNext from '../../SidebarItemNext/SidebarItemNext'; import SidebarSubMenuNext from '../../SidebarSubMenuNext/SidebarSubMenuNext'; import { uniTestkitFactoryCreator } from '@wix/wix-ui-test-utils/testing-library'; import { sidebarSubMenuNextDriverFactory } from '../../SidebarSubMenuNext/SidebarSubMenuNext.uni.driver'; describe('Sidebar Wrapper', function () { var render = createRendererWithUniDriver(sidebarNextPrivateDriverFactory); var sidebarSubMenuNextTestkitFactory = uniTestkitFactoryCreator(sidebarSubMenuNextDriverFactory); var sidebarWithSelectedKey = function sidebarWithSelectedKey(selectedKey) { return /*#__PURE__*/React.createElement(SidebarNext, { selectedKey: selectedKey, isLoading: false, __self: _this, __source: { fileName: _jsxFileName, lineNumber: 18, columnNumber: 5 } }, /*#__PURE__*/React.createElement(SidebarSubMenuNext, { key: "first-sub-menu", dataHook: "first-sub-menu", itemKey: "first-sub-menu", onClick: function onClick() {}, __self: _this, __source: { fileName: _jsxFileName, lineNumber: 19, columnNumber: 7 } }, /*#__PURE__*/React.createElement(SidebarItemNext, { itemKey: "first-item", __self: _this, __source: { fileName: _jsxFileName, lineNumber: 25, columnNumber: 9 } }, /*#__PURE__*/React.createElement("div", { __self: _this, __source: { fileName: _jsxFileName, lineNumber: 26, columnNumber: 11 } }, "First")), /*#__PURE__*/React.createElement(SidebarItemNext, { dataHook: "first-item-sibling", itemKey: "first-item-sibling", __self: _this, __source: { fileName: _jsxFileName, lineNumber: 28, columnNumber: 9 } }, /*#__PURE__*/React.createElement("div", { __self: _this, __source: { fileName: _jsxFileName, lineNumber: 32, columnNumber: 11 } }, "Sibling"))), /*#__PURE__*/React.createElement(SidebarSubMenuNext, { key: "second-sub-menu", dataHook: "second-sub-menu", itemKey: "second-sub-menu", __self: _this, __source: { fileName: _jsxFileName, lineNumber: 35, columnNumber: 7 } }, /*#__PURE__*/React.createElement(SidebarItemNext, { itemKey: "second-item", __self: _this, __source: { fileName: _jsxFileName, lineNumber: 40, columnNumber: 9 } }, /*#__PURE__*/React.createElement("div", { __self: _this, __source: { fileName: _jsxFileName, lineNumber: 41, columnNumber: 11 } }, "Second"))), /*#__PURE__*/React.createElement(SidebarSubMenuNext, { key: "third-sub-menu", dataHook: "third-sub-menu", itemKey: "third-sub-menu", __self: _this, __source: { fileName: _jsxFileName, lineNumber: 44, columnNumber: 7 } }, /*#__PURE__*/React.createElement(SidebarItemNext, { itemKey: "third-item", __self: _this, __source: { fileName: _jsxFileName, lineNumber: 49, columnNumber: 9 } }, /*#__PURE__*/React.createElement("div", { __self: _this, __source: { fileName: _jsxFileName, lineNumber: 50, columnNumber: 11 } }, "Third"))), /*#__PURE__*/React.createElement(SidebarItemNext, { itemKey: "non-sub-menu-item", dataHook: "non-sub-menu-item", __self: _this, __source: { fileName: _jsxFileName, lineNumber: 53, columnNumber: 7 } }, /*#__PURE__*/React.createElement("div", { __self: _this, __source: { fileName: _jsxFileName, lineNumber: 54, columnNumber: 9 } }, "No SubMenu item"))); }; var renderWithSelectedKey = function renderWithSelectedKey(selectedKey) { return render(sidebarWithSelectedKey(selectedKey)); }; // TODO: rework delay implementation it.skip('shouldNextMenuOpenWithDelay should be false if there is no open menu', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() { var _renderWithSelectedKe, driver, _t; return _regenerator().w(function (_context) { while (1) switch (_context.n) { case 0: _renderWithSelectedKe = renderWithSelectedKey('non-sub-menu-item'), driver = _renderWithSelectedKe.driver; _t = expect; _context.n = 1; return driver.shouldNextMenuOpenWithDelay(); case 1: _t(_context.v).toBe('false'); case 2: return _context.a(2); } }, _callee); }))); it.skip('shouldNextMenuOpenWithDelay should return true if there is an open menu before selecting new menu', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2() { var _renderWithSelectedKe2, driver, rerender, _t2; return _regenerator().w(function (_context2) { while (1) switch (_context2.n) { case 0: _renderWithSelectedKe2 = renderWithSelectedKey('first-sub-menu'), driver = _renderWithSelectedKe2.driver, rerender = _renderWithSelectedKe2.rerender; rerender(sidebarWithSelectedKey('second-sub-menu')); _t2 = expect; _context2.n = 1; return driver.shouldNextMenuOpenWithDelay(); case 1: _t2(_context2.v).toBe('true'); case 2: return _context2.a(2); } }, _callee2); }))); it.skip('shouldNextMenuOpenWithDelay should return false if there is an item (non sub menu) selected before selecting new menu', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee3() { var _renderWithSelectedKe3, driver, rerender, _t3; return _regenerator().w(function (_context3) { while (1) switch (_context3.n) { case 0: _renderWithSelectedKe3 = renderWithSelectedKey('non-sub-menu-item'), driver = _renderWithSelectedKe3.driver, rerender = _renderWithSelectedKe3.rerender; rerender(sidebarWithSelectedKey('second-sub-menu')); _t3 = expect; _context3.n = 1; return driver.shouldNextMenuOpenWithDelay(); case 1: _t3(_context3.v).toBe('false'); case 2: return _context3.a(2); } }, _callee3); }))); it.skip('shouldNextMenuOpenWithDelay should return true if there is an subMenu-item selected before selecting new menu', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee4() { var _renderWithSelectedKe4, driver, rerender, _t4; return _regenerator().w(function (_context4) { while (1) switch (_context4.n) { case 0: _renderWithSelectedKe4 = renderWithSelectedKey('first-item'), driver = _renderWithSelectedKe4.driver, rerender = _renderWithSelectedKe4.rerender; rerender(sidebarWithSelectedKey('second-sub-menu')); _t4 = expect; _context4.n = 1; return driver.shouldNextMenuOpenWithDelay(); case 1: _t4(_context4.v).toBe('true'); case 2: return _context4.a(2); } }, _callee4); }))); it.skip('shouldNextMenuOpenWithDelay should return false if there is an menu/subMenu-item selected before selecting new item', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee5() { var _renderWithSelectedKe5, driver, rerender, _t5; return _regenerator().w(function (_context5) { while (1) switch (_context5.n) { case 0: _renderWithSelectedKe5 = renderWithSelectedKey('first-item'), driver = _renderWithSelectedKe5.driver, rerender = _renderWithSelectedKe5.rerender; rerender(sidebarWithSelectedKey('non-sub-menu-item')); _t5 = expect; _context5.n = 1; return driver.shouldNextMenuOpenWithDelay(); case 1: _t5(_context5.v).toBe('false'); case 2: return _context5.a(2); } }, _callee5); }))); it.skip('shouldNextMenuOpenWithDelay should return false if there is a selected menu that is collapsed', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee6() { var selectedKey, _renderWithSelectedKe6, driver, container, firstSubMenuTestKit, _t6; return _regenerator().w(function (_context6) { while (1) switch (_context6.n) { case 0: selectedKey = 'first-sub-menu'; _renderWithSelectedKe6 = renderWithSelectedKey(selectedKey), driver = _renderWithSelectedKe6.driver, container = _renderWithSelectedKe6.container; firstSubMenuTestKit = sidebarSubMenuNextTestkitFactory({ wrapper: container, dataHook: selectedKey }); _context6.n = 1; return firstSubMenuTestKit.click(); case 1: _t6 = expect; _context6.n = 2; return driver.shouldNextMenuOpenWithDelay(); case 2: _t6(_context6.v).toBe('false'); case 3: return _context6.a(2); } }, _callee6); }))); // TODO: move to SidebarNext spec it('is state.selectedKey equals to props.selectedKey on mount', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee7() { var selectedKey, _renderWithSelectedKe7, driver, _t7; return _regenerator().w(function (_context7) { while (1) switch (_context7.n) { case 0: selectedKey = 'non-sub-menu-item'; _renderWithSelectedKe7 = renderWithSelectedKey(selectedKey), driver = _renderWithSelectedKe7.driver; _t7 = expect; _context7.n = 1; return driver.getSelectedKey(); case 1: _t7(_context7.v).toBe(selectedKey); case 2: return _context7.a(2); } }, _callee7); }))); it('is state.selectedKey equals to props.selectedKey on change of props.selectedKey', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee8() { var finalSelectedKey, _renderWithSelectedKe8, driver, rerender, _t8; return _regenerator().w(function (_context8) { while (1) switch (_context8.n) { case 0: finalSelectedKey = 'first-sub-menu'; _renderWithSelectedKe8 = renderWithSelectedKey('non-sub-menu-item'), driver = _renderWithSelectedKe8.driver, rerender = _renderWithSelectedKe8.rerender; rerender(sidebarWithSelectedKey(finalSelectedKey)); _t8 = expect; _context8.n = 1; return driver.getSelectedKey(); case 1: _t8(_context8.v).toBe(finalSelectedKey); case 2: return _context8.a(2); } }, _callee8); }))); // TODO: move to sidebar state hook tests it('isSelectedExpanded should be true when menu is selected', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee9() { var _renderWithSelectedKe9, driver, _t9; return _regenerator().w(function (_context9) { while (1) switch (_context9.n) { case 0: _renderWithSelectedKe9 = renderWithSelectedKey('first-sub-menu'), driver = _renderWithSelectedKe9.driver; _t9 = expect; _context9.n = 1; return driver.isSelectedExpanded(); case 1: _t9(_context9.v).toBe('true'); case 2: return _context9.a(2); } }, _callee9); }))); it('isSelectedExpanded should be false when menu is selected and clicked to toggle', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee0() { var selectedKey, _renderWithSelectedKe0, driver, container, firstSubMenuTestKit, _t0; return _regenerator().w(function (_context0) { while (1) switch (_context0.n) { case 0: selectedKey = 'first-sub-menu'; _renderWithSelectedKe0 = renderWithSelectedKey(selectedKey), driver = _renderWithSelectedKe0.driver, container = _renderWithSelectedKe0.container; firstSubMenuTestKit = sidebarSubMenuNextTestkitFactory({ wrapper: container, dataHook: selectedKey }); _context0.n = 1; return firstSubMenuTestKit.click(); case 1: _t0 = expect; _context0.n = 2; return driver.isSelectedExpanded(); case 2: _t0(_context0.v).toBe('false'); case 3: return _context0.a(2); } }, _callee0); }))); it('isSelectedExpanded should be true when menu is selected and clicked to collapse and then clicked to expand again', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee1() { var selectedKey, _renderWithSelectedKe1, driver, container, firstSubMenuTestKit, _t1; return _regenerator().w(function (_context1) { while (1) switch (_context1.n) { case 0: selectedKey = 'first-sub-menu'; _renderWithSelectedKe1 = renderWithSelectedKey(selectedKey), driver = _renderWithSelectedKe1.driver, container = _renderWithSelectedKe1.container; firstSubMenuTestKit = sidebarSubMenuNextTestkitFactory({ wrapper: container, dataHook: selectedKey }); _context1.n = 1; return firstSubMenuTestKit.click(); case 1: _context1.n = 2; return firstSubMenuTestKit.click(); case 2: _t1 = expect; _context1.n = 3; return driver.isSelectedExpanded(); case 3: _t1(_context1.v).toBe('true'); case 4: return _context1.a(2); } }, _callee1); }))); });