HM-48. Внедрена система тестирования jest (#17)

.eslintrc.json

@@ -2,13 +2,11 @@
     "parser": "babel-eslint",
     "env": {
         "browser": true,
-        "es2020": true
+        "es2020": true,
+        "jest/globals": true
     },
-    "extends": [
+    "extends": ["eslint:recommended", "plugin:import/errors", "plugin:import/warnings", "plugin:jest/recommended"],
-        "eslint:recommended",
+    "plugins": ["jest"],
-        "plugin:import/errors",
-        "plugin:import/warnings"
-    ],
     "parserOptions": {
         "ecmaVersion": 11,
         "sourceType": "module"

jest.config.js

@@ -0,0 +1,190 @@
+/* eslint-disable */
+
+// For a detailed explanation regarding each configuration property, visit:
+// https://jestjs.io/docs/en/configuration.html
+
+module.exports = {
+  // All imported modules in your tests should be mocked automatically
+  // automock: false,
+
+  // Stop running tests after `n` failures
+  // bail: 0,
+
+  // The directory where Jest should store its cached dependency information
+  // cacheDirectory: "/private/var/folders/95/rl6ym4qj7vg7y7myqqlvjzzn4q2cvt/T/jest_kdlda2",
+
+  // Automatically clear mock calls and instances between every test
+  clearMocks: true,
+
+  // Indicates whether the coverage information should be collected while executing the test
+  // collectCoverage: false,
+
+  // An array of glob patterns indicating a set of files for which coverage information should be collected
+  // collectCoverageFrom: undefined,
+
+  // The directory where Jest should output its coverage files
+  // coverageDirectory: undefined,
+
+  // An array of regexp pattern strings used to skip coverage collection
+  // coveragePathIgnorePatterns: [
+  //   "/node_modules/"
+  // ],
+
+  // Indicates which provider should be used to instrument code for coverage
+  // coverageProvider: "babel",
+
+  // A list of reporter names that Jest uses when writing coverage reports
+  // coverageReporters: [
+  //   "json",
+  //   "text",
+  //   "lcov",
+  //   "clover"
+  // ],
+
+  // An object that configures minimum threshold enforcement for coverage results
+  // coverageThreshold: undefined,
+
+  // A path to a custom dependency extractor
+  // dependencyExtractor: undefined,
+
+  // Make calling deprecated APIs throw helpful error messages
+  // errorOnDeprecated: false,
+
+  // Force coverage collection from ignored files using an array of glob patterns
+  // forceCoverageMatch: [],
+
+  // A path to a module which exports an async function that is triggered once before all test suites
+  // globalSetup: undefined,
+
+  // A path to a module which exports an async function that is triggered once after all test suites
+  // globalTeardown: undefined,
+
+  // A set of global variables that need to be available in all test environments
+  // globals: {},
+
+  // The maximum amount of workers used to run your tests. Can be specified as % or a number. E.g. maxWorkers: 10% will use 10% of your CPU amount + 1 as the maximum worker number. maxWorkers: 2 will use a maximum of 2 workers.
+  // maxWorkers: "50%",
+
+  // An array of directory names to be searched recursively up from the requiring module's location
+  // moduleDirectories: [
+  //   "node_modules"
+  // ],
+
+  // An array of file extensions your modules use
+  // moduleFileExtensions: [
+  //   "js",
+  //   "json",
+  //   "jsx",
+  //   "ts",
+  //   "tsx",
+  //   "node"
+  // ],
+
+  // A map from regular expressions to module names or to arrays of module names that allow to stub out resources with a single module
+  // moduleNameMapper: {},
+
+  // An array of regexp pattern strings, matched against all module paths before considered 'visible' to the module loader
+  // modulePathIgnorePatterns: [],
+
+  // Activates notifications for test results
+  // notify: false,
+
+  // An enum that specifies notification mode. Requires { notify: true }
+  // notifyMode: "failure-change",
+
+  // A preset that is used as a base for Jest's configuration
+  // preset: undefined,
+
+  // Run tests from one or more projects
+  // projects: undefined,
+
+  // Use this configuration option to add custom reporters to Jest
+  // reporters: undefined,
+
+  // Automatically reset mock state between every test
+  // resetMocks: false,
+
+  // Reset the module registry before running each individual test
+  // resetModules: false,
+
+  // A path to a custom resolver
+  // resolver: undefined,
+
+  // Automatically restore mock state between every test
+  // restoreMocks: false,
+
+  // The root directory that Jest should scan for tests and modules within
+  // rootDir: undefined,
+
+  // A list of paths to directories that Jest should use to search for files in
+  // roots: [
+  //   "<rootDir>"
+  // ],
+
+  // Allows you to use a custom runner instead of Jest's default test runner
+  // runner: "jest-runner",
+
+  // The paths to modules that run some code to configure or set up the testing environment before each test
+  // setupFiles: [],
+
+  // A list of paths to modules that run some code to configure or set up the testing framework before each test
+  // setupFilesAfterEnv: [],
+
+  // A list of paths to snapshot serializer modules Jest should use for snapshot testing
+  // snapshotSerializers: [],
+
+  // The test environment that will be used for testing
+  // testEnvironment: "jest-environment-jsdom",
+
+  // Options that will be passed to the testEnvironment
+  // testEnvironmentOptions: {},
+
+  // Adds a location field to test results
+  // testLocationInResults: false,
+
+  // The glob patterns Jest uses to detect test files
+  // testMatch: [
+  //   "**/__tests__/**/*.[jt]s?(x)",
+  //   "**/?(*.)+(spec|test).[tj]s?(x)"
+  // ],
+
+  // An array of regexp pattern strings that are matched against all test paths, matched tests are skipped
+  // testPathIgnorePatterns: [
+  //   "/node_modules/"
+  // ],
+
+  // The regexp pattern or array of patterns that Jest uses to detect test files
+  // testRegex: [],
+
+  // This option allows the use of a custom results processor
+  // testResultsProcessor: undefined,
+
+  // This option allows use of a custom test runner
+  // testRunner: "jasmine2",
+
+  // This option sets the URL for the jsdom environment. It is reflected in properties such as location.href
+  // testURL: "http://localhost",
+
+  // Setting this value to "fake" allows the use of fake timers for functions such as "setTimeout"
+  // timers: "real",
+
+  // A map from regular expressions to paths to transformers
+  // transform: undefined,
+
+  // An array of regexp pattern strings that are matched against all source file paths, matched files will skip transformation
+  // transformIgnorePatterns: [
+  //   "/node_modules/"
+  // ],
+
+  // An array of regexp pattern strings that are matched against all modules before the module loader will automatically return a mock for them
+  // unmockedModulePathPatterns: undefined,
+
+  // Indicates whether each individual test should be reported during the run
+  // verbose: undefined,
+
+  // An array of regexp patterns that are matched against all source file paths before re-running tests in watch mode
+  // watchPathIgnorePatterns: [],
+
+  // Whether to use watchman for file crawling
+  // watchman: true,
+};

package.json

@@ -4,12 +4,13 @@
   "description": "",
   "main": "index.js",
   "scripts": {
-    "build": "webpack --mode=production",
+    "build": "npm run test && webpack --mode=production",
     "start": "webpack-dev-server --open",
     "dev": "webpack-dev-server",
     "docs": "rm -rf out && documentation build src/** -f html -o out",
     "show:docs": "lite-server --baseDir=\"out\"",
-    "lint": "eslint -c .eslintrc.json src --fix"
+    "lint": "eslint -c .eslintrc.json src --fix",
+    "test": "jest"
   },
   "repository": {
     "type": "git",
@@ -37,10 +38,12 @@
     "eslint": "^7.4.0",
     "eslint-loader": "^4.0.2",
     "eslint-plugin-import": "^2.22.0",
+    "eslint-plugin-jest": "^23.18.0",
     "file-loader": "^6.0.0",
     "html-loader": "^1.1.0",
     "html-webpack-plugin": "^4.3.0",
     "image-webpack-loader": "^6.0.0",
+    "jest": "^26.1.0",
     "mini-css-extract-plugin": "^0.9.0",
     "postcss-import": "^12.0.1",
     "postcss-loader": "^3.0.0",

src/services/RouteService.js

@@ -1,5 +1,6 @@
 import EmitService from './EmitService';
-import {parse, stringify} from 'querystring';
+import {parse} from 'querystring';
+import {makeUrlWithQuery} from '../utils/urlUtils';
 
 /**
  * @function RouterListener
@@ -73,8 +74,7 @@ class RouteService extends EmitService {
      * // Это создаст строку в url - site.ru/users?key=testApi&author=Petrov
      */
     goTo = (url, query) => {
-        const stringQuery = stringify(query);
+        const urlWithQuery = makeUrlWithQuery(url, query);
-        const urlWithQuery = url + (stringQuery ? `?${stringQuery}` : '');
         this.history.pushState({}, '', urlWithQuery);
         this.generateNext();
     }

src/utils/__test__/urlUtils.test.js

@@ -0,0 +1,56 @@
+import {makeUrlWithQuery} from '../urlUtils';
+
+describe('Проверка функции makeUrlWithQuery', () => {
+    it('Передача корректного маршрута без query', () => {
+        const url = '/store';
+        const result = makeUrlWithQuery(url);
+        expect(result)
+            .toBe('/store');
+    });
+
+    it('Передача корректного маршрута с query', () => {
+        const url = '/store';
+        const query = {
+            string: 'string',
+            number: 45,
+            boolean: false,
+            emptyString: '',
+            object: {arg1: 'arg1', arg2: 2},
+            emptyObject: {},
+            array: ['toy', 67],
+            emptyArray: [],
+            undefined: undefined,
+            null: null,
+            nan: NaN,
+            infinity: Infinity,
+            zero: 0,
+        };
+        const result = makeUrlWithQuery(url, query);
+        expect(result)
+            .toBe('/store?string=string&number=45&boolean=false&emptyString=&object=&emptyObject=&array=toy&array=67&undefined=&null=&nan=&infinity=&zero=0');
+    });
+
+    it('Передача корректного маршрута с пустым query', () => {
+        const url = '/store';
+        const query = {};
+        const result = makeUrlWithQuery(url, query);
+        expect(result)
+            .toBe('/store');
+    });
+
+    it('Передача корректного маршрута с query равным undefined', () => {
+        const url = '/store';
+        const result = makeUrlWithQuery(url, undefined);
+        expect(result)
+            .toBe('/store');
+    });
+
+    it('Передача маршрута undefined с query', () => {
+        const query = {
+            key: 'string'
+        };
+        const result = makeUrlWithQuery(undefined, query);
+        expect(result)
+            .toBe('?key=string');
+    });
+});

src/utils/urlUtils.js

@@ -0,0 +1,11 @@
+import {stringify} from 'querystring';
+
+/**
+ * Из маршрута и объекта query создает строку для url
+ * @param {string} url - маршрут
+ * @param {Object<string, string>} query - объект с данными
+ */
+export const makeUrlWithQuery = (url = '', query = {}) => {
+    const stringQuery = stringify(query);
+    return url + (stringQuery ? `?${stringQuery}` : '');
+};