linear-react-components-ui 0.4.75 → 0.4.76-rc.0

package/lib/treeview/treeview.spec.js

@@ -0,0 +1,261 @@
+"use strict";
+
+var _react = require("@testing-library/react");
+
+var _react2 = _interopRequireDefault(require("react"));
+
+require("@testing-library/jest-dom");
+
+require("babel-polyfill");
+
+var _ = _interopRequireDefault(require("."));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+var dataMock = {
+  id: 1,
+  titulo: 'SG Linear',
+  codigo: 'SG_Linear',
+  permissoes: [{
+    codigo: 'ACESSO'
+  }, {
+    codigo: 'GRAVAR'
+  }],
+  itens: [{
+    id: 2,
+    titulo: 'Segurança',
+    codigo: 'seguranca',
+    permissoes: [{
+      codigo: 'ACESSO'
+    }, {
+      codigo: 'GRAVAR'
+    }],
+    itens: [{
+      id: 4,
+      titulo: 'Perfis',
+      codigo: 'perfis',
+      itens: [{
+        titulo: 'Editar',
+        codigo: 'Editar',
+        itens: [{
+          titulo: 'Editar permissão ERP',
+          codigo: 'Editar permissão ERP'
+        }]
+      }]
+    }]
+  }, {
+    id: 3,
+    titulo: 'Cadastros',
+    codigo: 'cadastros',
+    permissoes: [{
+      codigo: 'ACESSO'
+    }, {
+      codigo: 'GRAVAR'
+    }],
+    itens: [{
+      id: 5,
+      titulo: 'Empresas',
+      codigo: 'empresas'
+    }]
+  }]
+};
+
+var treeviewRenderMock = function treeviewRenderMock(props) {
+  return /*#__PURE__*/_react2["default"].createElement(_["default"], _extends({
+    data: dataMock,
+    valuePropName: "id",
+    labelPropName: "titulo",
+    parentPropName: "0"
+  }, props));
+};
+
+describe('Treeview', function () {
+  describe('Default', function () {
+    it('should render', function () {
+      var _render = (0, _react.render)(treeviewRenderMock()),
+          container = _render.container;
+
+      expect(container.firstChild).toBeTruthy();
+    });
+    it('should have start node visible', function () {
+      var _render2 = (0, _react.render)(treeviewRenderMock()),
+          queryByText = _render2.queryByText;
+
+      expect(queryByText(dataMock.titulo)).toBeTruthy();
+    });
+    it('should not have second node visible', function () {
+      var _render3 = (0, _react.render)(treeviewRenderMock()),
+          queryByText = _render3.queryByText;
+
+      expect(queryByText(dataMock.itens[0].titulo)).not.toBeTruthy();
+    });
+    it('should open on click', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+      var _render4, queryByText, getByRole;
+
+      return regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              _render4 = (0, _react.render)(treeviewRenderMock()), queryByText = _render4.queryByText, getByRole = _render4.getByRole;
+
+              _react.fireEvent.click(getByRole('button'));
+
+              _context.next = 4;
+              return (0, _react.waitFor)(function () {
+                return queryByText(dataMock.itens[0].titulo);
+              });
+
+            case 4:
+              expect(queryByText(dataMock.itens[0].titulo)).toBeTruthy();
+              expect(queryByText(dataMock.itens[1].titulo)).toBeTruthy();
+
+            case 6:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    })));
+    it('should open all layers', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+      var _render5, queryByText, getByRole, queryAllByRole;
+
+      return regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              _render5 = (0, _react.render)(treeviewRenderMock()), queryByText = _render5.queryByText, getByRole = _render5.getByRole, queryAllByRole = _render5.queryAllByRole;
+
+              _react.fireEvent.click(getByRole('button'));
+
+              _context2.next = 4;
+              return (0, _react.waitFor)(function () {
+                return queryByText(dataMock.itens[0].titulo);
+              });
+
+            case 4:
+              _react.fireEvent.click(queryAllByRole('button')[1]);
+
+              _context2.next = 7;
+              return (0, _react.waitFor)(function () {
+                return queryByText(dataMock.itens[0].itens[0].titulo);
+              });
+
+            case 7:
+              _react.fireEvent.click(queryAllByRole('button')[2]);
+
+              _context2.next = 10;
+              return (0, _react.waitFor)(function () {
+                return queryByText(dataMock.itens[0].itens[0].itens[0].titulo);
+              });
+
+            case 10:
+              _react.fireEvent.click(queryAllByRole('button')[3]);
+
+              _context2.next = 13;
+              return (0, _react.waitFor)(function () {
+                return queryByText(dataMock.itens[0].itens[0].itens[0].itens[0].titulo);
+              });
+
+            case 13:
+              _react.fireEvent.click(queryAllByRole('button')[4]);
+
+              _context2.next = 16;
+              return (0, _react.waitFor)(function () {
+                return queryByText(dataMock.itens[1].itens[0].titulo);
+              });
+
+            case 16:
+              expect(queryByText(dataMock.itens[0].titulo)).toBeTruthy();
+              expect(queryByText(dataMock.itens[0].itens[0].titulo)).toBeTruthy();
+              expect(queryByText(dataMock.itens[0].itens[0].itens[0].titulo)).toBeTruthy();
+              expect(queryByText(dataMock.itens[0].itens[0].itens[0].itens[0].titulo)).toBeTruthy();
+              expect(queryByText(dataMock.itens[1].titulo)).toBeTruthy();
+              expect(queryByText(dataMock.itens[1].itens[0].titulo)).toBeTruthy();
+
+            case 22:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    })));
+    it('should render checkbox', function () {
+      var _render6 = (0, _react.render)(treeviewRenderMock({
+        showCheckBox: true
+      })),
+          container = _render6.container;
+
+      expect(container.querySelector('.checkbox-component')).toBeTruthy();
+    });
+    it('should call onSelectedIdsChange callback', function () {
+      var mockCallback = jest.fn(function (x) {
+        return x;
+      });
+
+      var _render7 = (0, _react.render)(treeviewRenderMock({
+        showCheckBox: true,
+        onSelectedIdsChange: mockCallback
+      })),
+          container = _render7.container;
+
+      _react.fireEvent.click(container.querySelector('.checkbox-component'));
+
+      expect(mockCallback.mock.calls.length).toBe(1);
+      expect(mockCallback.mock.calls[0][0]).toStrictEqual([1]);
+    });
+    it('should control checkbox by selectedIds', function () {
+      var _render8 = (0, _react.render)(treeviewRenderMock({
+        showCheckBox: true,
+        selectedIds: [1]
+      })),
+          container = _render8.container;
+
+      expect(container.querySelector('input.checkbox-component')).toBeChecked();
+    });
+    it('should start checkbox unchecked', function () {
+      var _render9 = (0, _react.render)(treeviewRenderMock({
+        showCheckBox: true
+      })),
+          container = _render9.container;
+
+      expect(container.querySelector('input.checkbox-component')).not.toBeChecked();
+    });
+    it('should start nodes open', function () {
+      var _render10 = (0, _react.render)(treeviewRenderMock({
+        startNodesOpened: true
+      })),
+          queryByText = _render10.queryByText;
+
+      expect(queryByText(dataMock.itens[0].titulo)).toBeTruthy();
+      expect(queryByText(dataMock.itens[0].itens[0].titulo)).toBeTruthy();
+      expect(queryByText(dataMock.itens[0].itens[0].itens[0].titulo)).toBeTruthy();
+      expect(queryByText(dataMock.itens[0].itens[0].itens[0].itens[0].titulo)).toBeTruthy();
+      expect(queryByText(dataMock.itens[1].titulo)).toBeTruthy();
+      expect(queryByText(dataMock.itens[1].itens[0].titulo)).toBeTruthy();
+    });
+    it('should apply customClass', function () {
+      var _render11 = (0, _react.render)(treeviewRenderMock({
+        customClass: 'customClass'
+      })),
+          container = _render11.container;
+
+      expect(container.firstChild).toHaveClass('customClass');
+    });
+    it('should apply style', function () {
+      var _render12 = (0, _react.render)(treeviewRenderMock({
+        styleForContainer: {
+          backgroundColor: '#000'
+        }
+      })),
+          container = _render12.container;
+
+      expect(container.querySelector('ul')).toHaveStyle('background-color: #000');
+    });
+  });
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "linear-react-components-ui",
-  "version": "0.4.75",
+  "version": "0.4.76-rc.0",
   "description": "Linear Sistemas ReactJs Components",
   "main": "lib/index.js",
   "scripts": {
@@ -11,15 +11,19 @@
     "check:js": "./node_modules/.bin/eslint ./src/* --ext .js, --ext .jsx",
     "deploy:heroku": "npm run demo:prod && cd demo && git commit -am 'Deploy' && git push heroku master",
     "publish:npm": "npm run lib && npm publish",
-    "prepare": "husky install"
+    "publish:npm:beta": "npm run lib && npm publish --tag beta",
+    "prepare": "husky install",
+    "test": "jest --env=jsdom",
+    "test:watch": "jest --watchAll --env=jsdom",
+    "test:coverage": "jest --coverage --colors --env=jsdom"
   },
   "keywords": [],
   "license": "MIT",
   "peerDependencies": {
-    "react": "^16.6.0",
-    "react-dom": "^16.6.0",
-    "react-router-dom": "^4.2.2",
-    "react-transition-group": "^2.2.1"
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-router-dom": "^5.2.0",
+    "react-transition-group": "^4.4.2"
   },
   "devDependencies": {
     "@babel/cli": "^7.5.5",
@@ -28,8 +32,12 @@
     "@babel/plugin-proposal-object-rest-spread": "7.0.0-beta.36",
     "@babel/preset-env": "^7.0.0-beta.36",
     "@babel/preset-react": "^7.0.0-beta.36",
+    "@testing-library/jest-dom": "^5.14.1",
+    "@testing-library/react": "^12.0.0",
     "babel-eslint": "^7.2.3",
+    "babel-jest": "^27.0.5",
     "babel-loader": "^8.0.0-beta.0",
+    "babel-polyfill": "^6.26.0",
     "css-loader": "^0.28.8",
     "eslint": "4.18.0",
     "eslint-config-airbnb": "16.1.0",
@@ -40,6 +48,8 @@
     "file-loader": "^1.1.6",
     "html-webpack-plugin": "^2.30.1",
     "husky": "^6.0.0",
+    "identity-obj-proxy": "^3.0.0",
+    "jest": "^27.0.5",
     "react": "^16.12.0",
     "react-dom": "^16.12.0",
     "react-router-dom": "^5.1.2",
@@ -56,11 +66,11 @@
   },
   "dependencies": {
     "attach-dom-events": "^1.0.0",
-    "history": "^4.10.1",
+    "history": "^5.0.0",
     "imask": "^3.1.1",
     "init": "^0.1.2",
-    "lodash": "^4.17.15",
-    "moment": "^2.24.0",
+    "lodash": "^4.17.21",
+    "moment": "^2.29.1",
     "node-sass": "^4.13.0",
     "prop-types": "^15.7.2",
     "react-syntax-highlighter": "^6.1.1",