Added some tests for control page

README.md

@@ -71,9 +71,10 @@ cd static/main/js/control_page
 3. Выполнить установку модулей для js
 ```bash
 npm install
+npm -g install npx
 npx webpack
 ```
-4. Тестирование запускается с помощью команды в той же папке
+4. Тестирование в той же папке
 ```bash
 npm test
 ```

static/main/js/control_page/.babelrc

@@ -3,6 +3,6 @@
     "plugins": [
         ["@babel/plugin-transform-runtime", {
           "regenerator": true
-        }]
+        }], "@babel/plugin-syntax-jsx"
       ]
 }

static/main/js/control_page/__tests__/control.test.js

@@ -0,0 +1,95 @@
+import React from "react";
+import {render, unmountComponentAtNode} from "react-dom";
+import {act} from "react-dom/test-utils";
+import {TableBody} from "../src/control";
+import * as test_data from "./test_users.json"
+import axios from "axios";
+
+let container = null
+let table = null
+let load = null
+let engineer_count = null
+let agents_count = null
+let licences_remaining = null
+jest.mock("axios", () => {
+  return {
+    get: jest.fn(() => Promise.resolve())
+  };
+});
+beforeEach(() => {
+  table = document.createElement("table");
+  container = document.createElement("tbody");
+  container.id = "tbody";
+  table.appendChild(container);
+  load = document.createElement("p");
+  load.id = "loading"
+  load.innerHTML = "Данные загружаются";
+  licences_remaining = document.createElement('p')
+  licences_remaining.id = "licences_remaining"
+  engineer_count = document.createElement("p")
+  agents_count = document.createElement("p")
+  engineer_count.className = "info-quantity-value"
+  agents_count.className = "info-quantity-value"
+  document.body.appendChild(table)
+  document.body.appendChild(engineer_count)
+  document.body.appendChild(agents_count)
+  document.body.appendChild(licences_remaining)
+  document.body.appendChild(load)
+});
+
+afterEach(() => {
+  unmountComponentAtNode(container);
+  container.remove();
+  table.remove();
+  engineer_count.remove()
+  agents_count.remove()
+  licences_remaining.remove()
+  container = null;
+  table = null;
+  load = null;
+  engineer_count = null
+  agents_count = null
+  licences_remaining = null
+});
+describe("testing table", (done) => {
+  it("has only main table row without axios request", () => {
+    act(() => {
+      render(<TableBody/>, container);
+    });
+    expect(container.getElementsByTagName("tr").length).toBe(1);
+  });
+
+  it("shows valid number of free workplaces", async () => {
+    axios.get.mockImplementation(() => Promise.resolve({data: test_data}));
+    await act(async () => {
+      render(<TableBody/>, container)
+    })
+    let licences = Number(licences_remaining.textContent.replace(/Свободных мест: /, ''))
+    expect(licences).toEqual(1)
+  });
+
+  it("Pretext must be deleted on render", () => {
+    act(() => {
+      render(<TableBody/>, container)
+    })
+    expect(document.body).not.toContain(load)
+  });
+
+  it("has valid number of table rows with axios request", async () => {
+    axios.get.mockImplementation(() => Promise.resolve({data: test_data}));
+    await act(async () => {
+      render(<TableBody/>, container)
+    })
+    expect(container.getElementsByTagName("tr").length)
+      .toEqual(test_data.users.length + test_data.zendesk_users.length + 1)
+  });
+
+  it("show valid number for engineers and light agents", async () => {
+    axios.get.mockImplementation(() => Promise.resolve({data: test_data}));
+    await act(async () => {
+      render(<TableBody/>, container)
+    })
+    expect(Number(engineer_count.textContent)).toEqual(test_data.engineers)
+    expect(Number(agents_count.textContent)).toEqual(test_data.light_agents)
+  });
+})

static/main/js/control_page/control.test.js

@@ -1,77 +0,0 @@
-import React from "react";
-import {render, unmountComponentAtNode} from "react-dom";
-import {act} from "react-dom/test-utils";
-import {TableBody} from "./src/control";
-import * as test_data from "./test_users.json"
-import axios from "axios";
-import MockAdapter from 'axios-mock-adapter'
-
-let container = null;
-let table = null;
-let load = null;
-let engineer_count = null
-let agents_count = null
-let licences_remaining = null
-beforeEach(() => {
-  table = document.createElement("table");
-  container = document.createElement("tbody");
-  container.id = "tbody";
-  table.appendChild(container);
-  load = document.createElement("p");
-  load.id = "loading"
-  load.innerHTML = "Данные загружаются";
-  licences_remaining = document.createElement('p')
-  licences_remaining.id = "licences_remaining"
-  engineer_count = document.createElement("p")
-  agents_count = document.createElement("p")
-  engineer_count.className = "info-quantity-value"
-  agents_count.className = "info-quantity-value"
-  document.body.appendChild(table);
-  document.body.appendChild(engineer_count)
-  document.body.appendChild(agents_count)
-  document.body.appendChild(licences_remaining)
-  document.body.appendChild(load);
-  jest.useFakeTimers();
-});
-
-afterEach(() => {
-  unmountComponentAtNode(container);
-  container.remove();
-  table.remove();
-  load.remove();
-  engineer_count.remove()
-  agents_count.remove()
-  licences_remaining.remove()
-  container = null;
-  table = null;
-  load = null;
-  engineer_count = null
-  agents_count = null
-  licences_remaining = null
-  jest.useRealTimers();
-});
-
-it("has rows no on mount", () => {
-  act(() => {
-    let container = document.createElement("tbody");
-    render(<TableBody/>, container);
-  });
-  expect(container.getElementsByTagName("tr").length).toBe(0);
-});
-
-it("has valid number of workplaces",async () => {
-  let mock = new MockAdapter(axios)
-  mock.onGet("/api/users").reply(200, test_data)
-
-  await act(async () => {
-    render(<TableBody/>, container)
-  })
-
-  let licences = Number(licences_remaining.textContent.replace(/Свободных мест: /, ''))
-  expect(licences).toEqual(1)
-  mock.restore()
-})
-
-it ("Pretext must be deleted on render", async () => {
-
-})

static/main/js/control_page/jest.config.js

@@ -0,0 +1,12 @@
+module.exports = {
+  verbose: true,
+  testPathIgnorePatterns: [
+    "./node_modules/"
+  ],
+  unmockedModulePathPatterns: [
+    "./node_modules/react"
+  ],
+  roots: [
+    "./__tests__"
+  ],
+}

static/main/js/control_page/package.json

@@ -2,30 +2,26 @@
   "name": "control_page",
   "version": "1.0.0",
   "description": "",
-  "main": "src/control.js",
+  "main": "dist/index_bundle.js",
   "scripts": {
     "test": "jest"
   },
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@babel/plugin-transform-runtime": "^7.13.15",
-    "@babel/preset-react": "^7.13.13",
-    "babel": "^6.23.0",
-    "jsx": "^0.9.89",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "save-dev": "0.0.1-security"
-  },
-  "devDependencies": {
     "@babel/cli": "^7.13.16",
     "@babel/core": "^7.13.16",
+    "@babel/plugin-transform-runtime": "^7.13.15",
     "@babel/preset-env": "^7.13.15",
+    "@babel/preset-react": "^7.13.13",
     "axios": "^0.21.1",
     "axios-mock-adapter": "^1.19.0",
     "babel-loader": "^8.2.2",
     "jest": "^26.6.3",
-    "npx": "^10.2.2",
+    "jsx": "^0.9.89",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "save-dev": "0.0.1-security",
     "webpack": "^5.36.2",
     "webpack-cli": "^4.6.0"
   }