web: components: Fixed run rests with inline svg components

web/ASC.Web.Components/jest.config.js

@@ -1,19 +1,19 @@
 module.exports = {
+  setupFiles: [
+    '<rootDir>/test/setup-tests.js'
+  ],
   setupFilesAfterEnv: [
-    /* Enables jest-enzyme assertions
-      https://github.com/FormidableLabs/enzyme-matchers/tree/master/packages/jest-enzyme#readme
-    */
-    '<rootDir>/node_modules/jest-enzyme/lib/index.js',
-    '<rootDir>/config/setupTest.js',
+    '<rootDir>/scripts/setup-test-framework.js'
   ],
   transform: {
-    '^.+\\.js$': 'babel-jest',
+    '^.+\\.js$': '<rootDir>/test/transform-babel-jest.js',
   },
   /* It solves css/less/scss import issues.
     You might have similar issues with different file extensions (e.g. md).
     Just search for "<file type> jest loader"
   */
   moduleNameMapper: {
-    '^.+\\.(css|less|scss)$': 'babel-jest',
+    '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$':
+      '<rootDir>/test/transform-file.js'
   },
 };

web/ASC.Web.Components/package.json

@@ -61,6 +61,7 @@
     "babel-jest": "^24.8.0",
     "babel-loader": "^8.0.6",
     "babel-plugin-inline-react-svg": "^1.1.0",
+    "babel-plugin-transform-dynamic-import": "^2.1.0",
     "babel-plugin-transform-rename-import": "^2.3.0",
     "cross-env": "^5.2.0",
     "enzyme": "^3.10.0",

web/ASC.Web.Components/scripts/setup-test-framework.js

@@ -0,0 +1,6 @@
+// enzyme setup
+import 'jest-enzyme';
+import Enzyme from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
+
+Enzyme.configure({ adapter: new Adapter(), disableLifecycleMethods: true });

web/ASC.Web.Components/src/components/advanced-selector/advanced-selector.test.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import { mount } from 'enzyme';
+import AdvancedSelector from '.';
+
+describe('<AdvancedSelector />', () => {
+  it('renders without error', () => {
+    const wrapper = mount(
+      <AdvancedSelector 
+        placeholder="Search users"
+        onSearchChanged={(e) => console.log(e.target.value)}
+        options={[]}
+        isMultiSelect={false}
+        buttonLabel="Add members"
+        onSelect={(selectedOptions) => console.log("onSelect", selectedOptions)}
+        />
+    );
+
+    expect(wrapper).toExist();
+  });
+});

web/ASC.Web.Components/test/replace-module-paths.js

@@ -0,0 +1,17 @@
+const path = require('path');
+
+module.exports = function replaceImport(originalPath, callingFileName) {
+  // This replacement rewrites imports of ui-kit to an import using a relative
+  // path pointing at the root folder.
+  // This allows to import from the bundled ui-kit using
+  //   import { PrimaryButton } from 'ui-kit'
+  // instead of
+  //   import { PrimaryButton } from '../../..'
+  if (originalPath === 'ui-kit' && callingFileName.endsWith('.bundlespec.js')) {
+    const fromPath = path.dirname(callingFileName);
+    const toPath = process.cwd();
+    const relativePath = path.relative(fromPath, toPath);
+    return relativePath;
+  }
+  return originalPath;
+};

web/ASC.Web.Components/test/setup-tests.js

@@ -0,0 +1,76 @@
+import fs from 'fs';
+import path from 'path';
+import colors from 'colors/safe';
+
+const shouldSilenceWarnings = (...messages) =>
+  [/Warning: componentWillReceiveProps has been renamed/].some(msgRegex =>
+    messages.some(msg => msgRegex.test(msg))
+  );
+
+global.window.app = {
+  mcApiUrl: 'http://localhost:8080',
+};
+
+// setup file
+const logOrThrow = (log, method, messages) => {
+  const warning = `console.${method} calls not allowed in tests`;
+  if (process.env.CI) {
+    if (shouldSilenceWarnings(messages)) {
+      return;
+    }
+
+    log(warning, '\n', ...messages);
+    throw new Error(warning);
+  } else {
+    log(colors.bgYellow.black(' WARN '), warning, '\n', ...messages);
+  }
+};
+
+// eslint-disable-next-line no-console
+const logMessage = console.log;
+global.console.log = (...messages) => {
+  logOrThrow(logMessage, 'log', messages);
+};
+
+// eslint-disable-next-line no-console
+const logInfo = console.info;
+global.console.info = (...messages) => {
+  logOrThrow(logInfo, 'info', messages);
+};
+
+// eslint-disable-next-line no-console
+const logWarning = console.warn;
+global.console.warn = (...messages) => {
+  logOrThrow(logWarning, 'warn', messages);
+};
+
+// eslint-disable-next-line no-console
+const logError = console.error;
+global.console.error = (...messages) => {
+  logOrThrow(logError, 'error', messages);
+};
+
+// Avoid unhandled promise rejections from going unnoticed
+// https://github.com/facebook/jest/issues/3251#issuecomment-299183885
+// In Node v7 unhandled promise rejections will terminate the process
+if (!process.env.LISTENING_TO_UNHANDLED_REJECTION) {
+  process.on('unhandledRejection', reason => {
+    logMessage('UNHANDLED REJECTION', reason);
+
+    // We create a file in case there is an unhandled rejection
+    // We later check for the existence of this file to fail CI
+    if (process.env.CI && !process.env.HAS_CREATED_UNHANDLED_REJECTION_FILE) {
+      const rootPath = process.cwd();
+      fs.writeFileSync(
+        path.join(
+          rootPath,
+          './fail-tests-because-there-was-an-unhandled-rejection.lock'
+        ),
+        ''
+      );
+      process.env.HAS_CREATED_UNHANDLED_REJECTION_FILE = true;
+    }
+  });
+  // Avoid memory leak by adding too many listeners
+  process.env.LISTENING_TO_UNHANDLED_REJECTION = true;
+}

web/ASC.Web.Components/test/transform-babel-jest.js

@@ -0,0 +1,15 @@
+const babelPresetJest = require('babel-preset-jest');
+const getBabelPreset = require('../scripts/get-babel-preset');
+
+const babelOptions = getBabelPreset();
+
+const jestBabelConfig = {
+  ...babelOptions,
+  plugins: [
+    ...babelOptions.plugins,
+    ...babelPresetJest().plugins/*,
+    ['module-rewrite', { replaceFunc: './test/replace-module-paths.js' }],*/
+  ],
+};
+
+module.exports = require('babel-jest').createTransformer(jestBabelConfig);

web/ASC.Web.Components/test/transform-file.js

@@ -0,0 +1 @@
+module.exports = 'test-file-stub';

web/ASC.Web.Components/yarn.lock

@@ -360,7 +360,7 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-syntax-dynamic-import@7.2.0", "@babel/plugin-syntax-dynamic-import@^7.2.0":
+"@babel/plugin-syntax-dynamic-import@7.2.0", "@babel/plugin-syntax-dynamic-import@^7.0.0", "@babel/plugin-syntax-dynamic-import@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-dynamic-import/-/plugin-syntax-dynamic-import-7.2.0.tgz#69c159ffaf4998122161ad8ebc5e6d1f55df8612"
   integrity sha512-mVxuJ0YroI/h/tbFTPGZR8cv6ai+STMKNBq0f8hFxsxWjl94qqhsb+wXbpNMDPU3cfR1TIsVFzU3nXyZMqyK4w==
@@ -2815,6 +2815,13 @@ babel-plugin-syntax-jsx@^6.18.0:
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946"
   integrity sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY=
 
+babel-plugin-transform-dynamic-import@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-dynamic-import/-/babel-plugin-transform-dynamic-import-2.1.0.tgz#3ce618dd983c072b6e2135f527d46092fb45d80e"
+  integrity sha512-ja4NWc37+7bV6/uJKCERJEGHEyK1DXgXp8teHvjKC4Jsj3Ib484dJdamFIBtSb40JFniyWZo6ML46usVvfdsSg==
+  dependencies:
+    "@babel/plugin-syntax-dynamic-import" "^7.0.0"
+
 babel-plugin-transform-inline-consecutive-adds@^0.4.3:
   version "0.4.3"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-inline-consecutive-adds/-/babel-plugin-transform-inline-consecutive-adds-0.4.3.tgz#323d47a3ea63a83a7ac3c811ae8e6941faf2b0d1"