@centreon/js-config 24.4.13 → 24.4.14

package/cypress/e2e/plugins.ts

@@ -3,34 +3,132 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
 /* eslint-disable no-param-reassign */
 
-export default (
-  on: Cypress.PluginEvents,
-  config: Cypress.PluginConfigOptions
-): Cypress.PluginConfigOptions => {
-  on('before:browser:launch', (browser, launchOptions) => {
-    const width = 1920;
-    const height = 1080;
-
-    if (browser.name === 'chrome') {
-      if (browser.isHeadless) {
-        launchOptions.args.push('--headless=new');
-      }
+import Docker from 'dockerode';
+import { addCucumberPreprocessorPlugin } from '@badeball/cypress-cucumber-preprocessor';
+import webpackPreprocessor from '@cypress/webpack-preprocessor';
 
-      // flags description : https://github.com/GoogleChrome/chrome-launcher/blob/main/docs/chrome-flags-for-tools.md
-      launchOptions.args.push('--disable-gpu');
-      launchOptions.args.push('--auto-open-devtools-for-tabs');
-      launchOptions.args.push('--disable-extensions');
-      launchOptions.args.push('--hide-scrollbars');
-      launchOptions.args.push('--mute-audio');
+const docker = new Docker();
+
+const getWebpackOptions = (config): object => {
+  return {
+    module: {
+      rules: [
+        {
+          exclude: [/node_modules/],
+          test: /\.ts?$/,
+          use: [
+            {
+              loader: 'swc-loader'
+            }
+          ]
+        },
+        {
+          test: /\.feature$/,
+          use: [
+            {
+              loader: '@badeball/cypress-cucumber-preprocessor/webpack',
+              options: config
+            }
+          ]
+        }
+      ]
+    },
+    resolve: {
+      extensions: ['.ts', '.js']
+    }
+  };
+};
+
+export default async (on, config): Promise<void> => {
+  await addCucumberPreprocessorPlugin(on, config);
 
-      launchOptions.args.push(`--window-size=${width},${height}`);
+  const webpackOptions = await getWebpackOptions(config);
+  const options = {
+    webpackOptions
+  };
 
-      // force screen to be non-retina and just use our given resolution
-      launchOptions.args.push('--force-device-scale-factor=1');
+  on('file:preprocessor', webpackPreprocessor(options));
+
+  on('before:browser:launch', (browser = {}, launchOptions) => {
+    if ((browser as { name }).name === 'chrome') {
+      launchOptions.args.push('--disable-gpu');
+      launchOptions.args = launchOptions.args.filter(
+        (element) => element !== '--disable-dev-shm-usage'
+      );
     }
 
     return launchOptions;
   });
 
+  interface PortBinding {
+    destination: number;
+    source: number;
+  }
+
+  interface StartContainerProps {
+    image: string;
+    name: string;
+    portBindings: Array<PortBinding>;
+  }
+
+  interface StopContainerProps {
+    name: string;
+  }
+
+  on('task', {
+    startContainer: async ({
+      image,
+      name,
+      portBindings = []
+    }: StartContainerProps) => {
+      const webContainers = await docker.listContainers({
+        all: true,
+        filters: { name: [name] }
+      });
+      if (webContainers.length) {
+        return webContainers[0];
+      }
+
+      const container = await docker.createContainer({
+        AttachStderr: true,
+        AttachStdin: false,
+        AttachStdout: true,
+        ExposedPorts: portBindings.reduce((accumulator, currentValue) => {
+          accumulator[`${currentValue.source}/tcp`] = {};
+
+          return accumulator;
+        }, {}),
+        HostConfig: {
+          PortBindings: portBindings.reduce((accumulator, currentValue) => {
+            accumulator[`${currentValue.source}/tcp`] = [
+              {
+                HostIP: '0.0.0.0',
+                HostPort: `${currentValue.destination}`
+              }
+            ];
+
+            return accumulator;
+          }, {})
+        },
+        Image: image,
+        OpenStdin: false,
+        StdinOnce: false,
+        Tty: true,
+        name
+      });
+
+      await container.start();
+
+      return container;
+    },
+    stopContainer: async ({ name }: StopContainerProps) => {
+      const container = await docker.getContainer(name);
+      await container.kill();
+      await container.remove();
+
+      return null;
+    }
+  });
+
   return config;
 };

package/eslint/base.typescript.eslintrc.js

@@ -21,15 +21,11 @@ module.exports = {
           }
         ],
         '@typescript-eslint/camelcase': 'off',
-        '@typescript-eslint/consistent-type-definitions': ['off', 'interface'],
-        '@typescript-eslint/explicit-function-return-type': [
+        '@typescript-eslint/consistent-type-definitions': [
           'error',
-          {
-            allowExpressions: true,
-            allowHigherOrderFunctions: true,
-            allowTypedFunctionExpressions: true
-          }
+          'interface'
         ],
+        '@typescript-eslint/explicit-function-return-type': ['error'],
         '@typescript-eslint/explicit-member-accessibility': [
           'error',
           {
@@ -80,21 +76,13 @@ module.exports = {
           }
         ],
         camelcase: 'off',
-        'import/no-cycle': 'off',
-        'import/no-named-as-default': 'warn',
         'no-shadow': 'off',
         'no-unused-expressions': 'off'
       },
       settings: {
-        'import/parsers': {
-          '@typescript-eslint/parser': ['.ts', '.tsx']
-        },
         'import/resolver': {
           alias: {
             extensions: ['.ts', '.tsx', '.js', '.jsx']
-          },
-          typescript: {
-            alwaysTryTypes: true
           }
         }
       }

package/jest/index.js

@@ -1,16 +1,12 @@
 module.exports = {
   moduleNameMapper: {
     '\\.(s?css|png|svg|jpg)$': 'identity-obj-proxy',
-    '^.+\\.(css|styl|less|sass|scss|png|jpg|ttf|woff|woff2)$':
-      'jest-transform-stub',
     '^react($|/.+)': '<rootDir>/node_modules/react$1'
   },
   setupFilesAfterEnv: ['@testing-library/jest-dom/extend-expect'],
   testEnvironment: 'jsdom',
-  testPathIgnorePatterns: ['/node_modules/', '!*.cypress.spec.tsx'],
+  testPathIgnorePatterns: ['/node_modules/'],
   transform: {
-    '.+\\.(css|styl|less|sass|scss|png|jpg|ttf|woff|woff2)$':
-      'jest-transform-stub',
     '^.+\\.[jt]sx?$': [
       '@swc/jest',
       {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@centreon/js-config",
   "description": "Centreon Frontend shared build configuration",
-  "version": "24.4.13",
+  "version": "24.4.14",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/centreon/centreon-frontend.git"
@@ -16,12 +16,13 @@
     "url": "https://github.com/centreon/centreon-frontend/issues"
   },
   "devDependencies": {
-    "@tsconfig/node16": "^16.1.1",
+    "@badeball/cypress-cucumber-preprocessor": "^14.0.0",
+    "@types/dockerode": "^3.3.16",
+    "dockerode": "^3.3.5",
     "eslint": "^8.17.0",
     "eslint-config-airbnb": "19.0.4",
     "eslint-config-prettier": "^8.5.0",
     "eslint-import-resolver-alias": "^1.1.2",
-    "eslint-import-resolver-typescript": "^3.5.5",
     "eslint-plugin-babel": "^5.3.1",
     "eslint-plugin-hooks": "^0.4.3",
     "eslint-plugin-import": "^2.26.0",
@@ -42,18 +43,5 @@
     "tsconfig",
     "webpack",
     "cypress"
-  ],
-  "dependencies": {
-    "@badeball/cypress-cucumber-preprocessor": "^19.1.0",
-    "@bahmutov/cypress-esbuild-preprocessor": "^2.2.0",
-    "@esbuild-plugins/node-globals-polyfill": "^0.2.3",
-    "@esbuild-plugins/node-modules-polyfill": "^0.2.2",
-    "@types/cypress-cucumber-preprocessor": "^4.0.5",
-    "@types/dockerode": "^3.3.23",
-    "cypress-multi-reporters": "^1.6.4",
-    "cypress-terminal-report": "^5.3.9",
-    "dockerode": "^4.0.0",
-    "esbuild": "^0.19.5",
-    "mochawesome": "^7.1.3"
-  }
+  ]
 }

package/tsconfig/index.json

@@ -1,14 +1,13 @@
 {
   "compilerOptions": {
-    "downlevelIteration": true,
-    "module": "ESNext",
     "moduleResolution": "node",
-    "target": "es2018",
+    "downlevelIteration": true,
+    "module": "es6",
+    "target": "es6",
     "jsx": "react-jsx",
     "strict": true,
     "noImplicitAny": false,
     "skipLibCheck": true,
-    "esModuleInterop": true,
-    "resolveJsonModule": true
+    "esModuleInterop": true
   }
 }

package/webpack/base/index.js

@@ -3,32 +3,74 @@ const path = require('path');
 const { CleanWebpackPlugin } = require('clean-webpack-plugin');
 const { ModuleFederationPlugin } = require('webpack').container;
 
-const {
-  getModuleConfiguration,
-  optimization,
-  output,
-  cache
-} = require('./globalConfig');
+const excludeNodeModulesExceptCentreonUi =
+  /node_modules(\\|\/)\.pnpm(\\|\/)(?!(@centreon))/;
 
 const getBaseConfiguration = ({
   moduleName,
   moduleFederationConfig,
   jscTransformConfiguration
 }) => ({
-  cache,
-  module: getModuleConfiguration(jscTransformConfiguration),
-  optimization,
+  cache: false,
+  module: {
+    rules: [
+      {
+        parser: { system: false },
+        test: /\.[cm]?(j|t)sx?$/
+      },
+      {
+        exclude: excludeNodeModulesExceptCentreonUi,
+        test: /\.[jt]sx?$/,
+        use: {
+          loader: 'swc-loader',
+          options: {
+            jsc: {
+              parser: {
+                syntax: 'typescript',
+                tsx: true
+              },
+              transform: jscTransformConfiguration
+            }
+          }
+        }
+      },
+      {
+        test: /\.icon.svg$/,
+        use: ['@svgr/webpack']
+      },
+      {
+        exclude: excludeNodeModulesExceptCentreonUi,
+        test: /\.(bmp|png|jpg|jpeg|gif|svg)$/,
+        use: [
+          {
+            loader: 'url-loader',
+            options: {
+              limit: 10000,
+              name: '[name].[hash:8].[ext]'
+            }
+          }
+        ]
+      }
+    ]
+  },
+  optimization: {
+    splitChunks: {
+      chunks: 'all',
+      maxSize: 400 * 1024
+    }
+  },
   output: {
-    ...output,
-    library: moduleName,
-    uniqueName: moduleName
+    chunkFilename: '[name].[chunkhash:8].chunk.js',
+    filename: '[name].[chunkhash:8].js',
+    libraryTarget: 'umd',
+    umdNamedDefine: true
   },
   plugins: [
     new CleanWebpackPlugin(),
     moduleName &&
       new ModuleFederationPlugin({
         filename: 'remoteEntry.[chunkhash:8].js',
-        library: { name: moduleName, type: 'umd' },
+        library: { name: moduleName, type: 'var' },
         name: moduleName,
         shared: [
           {
@@ -79,9 +121,6 @@ const getBaseConfiguration = ({
   ].filter(Boolean),
   resolve: {
     alias: {
-      '@centreon/ui/fonts': path.resolve(
-        './node_modules/@centreon/ui/public/fonts'
-      ),
       react: path.resolve('./node_modules/react')
     },
     extensions: ['.js', '.jsx', '.ts', '.tsx']

package/cypress/component/disableCssTransitions.ts

@@ -1,19 +0,0 @@
-const disableMotion = (win): void => {
-  const injectedStyleEl = win.document.getElementById('__cy_disable_motion__');
-  if (injectedStyleEl) {
-    return;
-  }
-  win.document.head.insertAdjacentHTML(
-    'beforeend',
-    `
-      <style id="__cy_disable_motion__">
-        /* Disable CSS transitions. */
-        *, *::before, *::after { -webkit-transition: none !important; -moz-transition: none !important; -o-transition: none !important; -ms-transition: none !important; transition: none !important; }
-        /* Disable CSS animations. */
-        *, *::before, *::after { -webkit-animation: none !important; -moz-animation: none !important; -o-animation: none !important; -ms-animation: none !important; animation: none !important; }
-      </style>
-    `.trim()
-  );
-};
-
-export default disableMotion;

package/cypress/e2e/commands/monitoring.ts

@@ -1,75 +0,0 @@
-/* eslint-disable @typescript-eslint/no-namespace */
-
-const apiBase = '/centreon/api';
-const apiActionV1 = `${apiBase}/index.php`;
-
-const getStatusNumberFromString = (status: string): number => {
-  const statuses = {
-    critical: '2',
-    down: '1',
-    ok: '0',
-    unknown: '3',
-    unreachable: '2',
-    up: '0',
-    warning: '1'
-  };
-
-  if (status in statuses) {
-    return statuses[status];
-  }
-
-  throw new Error(`Status ${status} does not exist`);
-};
-
-interface SubmitResult {
-  host: string;
-  output: string;
-  perfdata?: string | null;
-  service?: string | null;
-  status: string;
-}
-
-Cypress.Commands.add(
-  'submitResults',
-  (results: Array<SubmitResult>): Cypress.Chainable => {
-    results.forEach(
-      ({ host, output, perfdata = '', service = null, status }) => {
-        const timestampNow = Math.floor(Date.now() / 1000) - 15;
-        const updatetime = timestampNow.toString();
-
-        const result = {
-          host,
-          output,
-          perfdata,
-          service,
-          status: getStatusNumberFromString(status),
-          updatetime
-        };
-
-        cy.request({
-          body: {
-            results: [result]
-          },
-          headers: {
-            'Content-Type': 'application/json',
-            'centreon-auth-token': window.localStorage.getItem('userTokenApiV1')
-          },
-          method: 'POST',
-          url: `${apiActionV1}?action=submit&object=centreon_submit_results`
-        });
-      }
-    );
-
-    return cy.wrap(null);
-  }
-);
-
-declare global {
-  namespace Cypress {
-    interface Chainable {
-      submitResults: (props: Array<SubmitResult>) => Cypress.Chainable;
-    }
-  }
-}
-
-export {};

package/cypress/e2e/esbuild-preprocessor.ts

@@ -1,26 +0,0 @@
-import { NodeGlobalsPolyfillPlugin } from '@esbuild-plugins/node-globals-polyfill';
-import { NodeModulesPolyfillPlugin } from '@esbuild-plugins/node-modules-polyfill';
-import { addCucumberPreprocessorPlugin } from '@badeball/cypress-cucumber-preprocessor';
-import createBundler from '@bahmutov/cypress-esbuild-preprocessor';
-import createEsbuildPlugin from '@badeball/cypress-cucumber-preprocessor/esbuild';
-
-export default async (
-  on: Cypress.PluginEvents,
-  config: Cypress.PluginConfigOptions
-): Promise<void> => {
-  await addCucumberPreprocessorPlugin(on, config);
-
-  on(
-    'file:preprocessor',
-    createBundler({
-      plugins: [
-        createEsbuildPlugin(config),
-        NodeModulesPolyfillPlugin(),
-        NodeGlobalsPolyfillPlugin({
-          buffer: true,
-          process: true
-        })
-      ]
-    })
-  );
-};

package/cypress/e2e/reporter-config.js

@@ -1,13 +0,0 @@
-module.exports = {
-  mochawesomeReporterOptions: {
-    consoleReporter: 'none',
-    html: false,
-    json: true,
-    overwrite: true,
-    reportDir: 'results/reports',
-    reportFilename: '[name]-report.json'
-  },
-  reporterEnabled: `mochawesome,${require.resolve(
-    '@badeball/cypress-cucumber-preprocessor/pretty-reporter'
-  )}`
-};

package/cypress/e2e/tasks.ts

@@ -1,105 +0,0 @@
-import { execSync } from 'child_process';
-import { existsSync, mkdirSync } from 'fs';
-
-import Docker from 'dockerode';
-
-export default (on: Cypress.PluginEvents): void => {
-  const docker = new Docker();
-
-  interface PortBinding {
-    destination: number;
-    source: number;
-  }
-
-  interface StartContainerProps {
-    image: string;
-    name: string;
-    portBindings: Array<PortBinding>;
-  }
-
-  interface StopContainerProps {
-    name: string;
-  }
-
-  on('task', {
-    createDirectory: async (directoryPath: string) => {
-      if (!existsSync(directoryPath)) {
-        mkdirSync(directoryPath, { recursive: true });
-      }
-
-      return null;
-    },
-    startContainer: async ({
-      image,
-      name,
-      portBindings = []
-    }: StartContainerProps) => {
-      const imageList = execSync(
-        'docker image list --format "{{.Repository}}:{{.Tag}}"'
-      ).toString('utf8');
-
-      if (
-        !imageList.match(
-          new RegExp(
-            `^${image.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&')}`,
-            'm'
-          )
-        )
-      ) {
-        execSync(`docker pull ${image}`);
-      }
-
-      const webContainers = await docker.listContainers({
-        all: true,
-        filters: { name: [name] }
-      });
-      if (webContainers.length) {
-        return webContainers[0];
-      }
-
-      const container = await docker.createContainer({
-        AttachStderr: true,
-        AttachStdin: false,
-        AttachStdout: true,
-        ExposedPorts: portBindings.reduce((accumulator, currentValue) => {
-          accumulator[`${currentValue.source}/tcp`] = {};
-
-          return accumulator;
-        }, {}),
-        HostConfig: {
-          PortBindings: portBindings.reduce((accumulator, currentValue) => {
-            accumulator[`${currentValue.source}/tcp`] = [
-              {
-                HostIP: '127.0.0.1',
-                HostPort: `${currentValue.destination}`
-              }
-            ];
-
-            return accumulator;
-          }, {})
-        },
-        Image: image,
-        OpenStdin: false,
-        StdinOnce: false,
-        Tty: true,
-        name
-      });
-
-      await container.start();
-
-      return container;
-    },
-    stopContainer: async ({ name }: StopContainerProps) => {
-      const container = await docker.getContainer(name);
-      await container.kill();
-      await container.remove();
-
-      return null;
-    },
-    waitOn: async (url: string) => {
-      execSync(`npx wait-on ${url}`);
-
-      return null;
-    }
-  });
-};

package/eslint/lambda/typescript.eslintrc.js

@@ -1,48 +0,0 @@
-module.exports = {
-    extends: [ '../node/typescript.eslintrc.js'],
-    overrides: [
-      {
-        files: ["*.spec.js", "*.test.ts", "*.tests.ts"],
-        rules: {
-          "import/first": 0,
-          "import/order": 0,
-          "@typescript-eslint/ban-ts-comment": 0,
-          "@typescript-eslint/no-explicit-any": 0
-        }
-      }
-    ],
-    rules: {
-      "import/extensions": ["off"],
-      "no-console": "off",
-      "no-underscore-dangle": "off",
-      "class-methods-use-this": "off",
-      "@typescript-eslint/naming-convention": [
-        "error",
-        {
-          format: ["camelCase", "PascalCase", "UPPER_CASE"],
-          selector: "variable"
-        },
-        {
-          filter: {
-            match: false,
-            regex: "(__esModule|.+-.+)"
-          },
-          format: ["snake_case", "camelCase", "PascalCase", "UPPER_CASE"],
-          selector: "property",
-          leadingUnderscore: "allow"
-        },
-        {
-          filter: {
-            match: false,
-            regex: "^_$"
-          },
-          format: ["snake_case", "camelCase", "PascalCase"],
-          selector: "parameter"
-        }
-      ],
-      "@typescript-eslint/require-array-sort-compare": "error"
-    },
-    parserOptions: {
-      project: ["./tsconfig.json"]
-    }
-  }