@centreon/js-config 25.3.1 → 25.4.0-MON-191119-npm-develop.0

package/cypress/component/commands.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-namespace */
 import React from 'react';
 
-import { mount } from 'cypress/react18';
+import { mount } from 'cypress/react';
 import { equals, isNil } from 'ramda';
 
 import { Box, CssBaseline } from '@mui/material';

package/cypress/component/configuration.js

@@ -6,6 +6,9 @@ const {
 } = require('@simonsmith/cypress-image-snapshot/plugin');
 const cypressCodeCoverageTask = require('@cypress/code-coverage/task');
 
+const fs = require('fs');
+const path = require('path');
+
 module.exports = ({
   rspackConfig,
   cypressFolder,
@@ -28,21 +31,52 @@ module.exports = ({
         addMatchImageSnapshotPlugin(on, config);
 
         cypressCodeCoverageTask(on, config);
-        on('task', {
-          coverageReport: () => {
-            return null;
-          }
-        });
 
         on('before:browser:launch', (browser, launchOptions) => {
-          if (browser.name === 'chrome' && browser.isHeadless) {
+          if (
+            ['chrome', 'chromium'].includes(browser.name) &&
+            browser.isHeadless
+          ) {
             launchOptions.args.push('--headless=new');
             launchOptions.args.push('--force-color-profile=srgb');
             launchOptions.args.push('--window-size=1400,1200');
+            launchOptions.args.push('--max-old-space-size=4096');
+            launchOptions.args.push('--disable-dev-shm-usage');
+            launchOptions.args.push('--disable-gpu');
+            launchOptions.args.push('--no-sandbox');
           }
 
           return launchOptions;
         });
+
+        on('after:run', (results) => {
+          const testRetries = {};
+          if ('runs' in results) {
+            results.runs.forEach((run) => {
+              run.tests.forEach((test) => {
+                if (test.attempts && test.attempts.length > 1 && test.state === 'passed') {
+                  const testTitle = test.title.join(' > '); // Convert the array to a string
+                  testRetries[testTitle] = test.attempts.length - 1;
+                }
+              });
+            });
+          }
+
+          // Save the testRetries object to a file in the e2e/results directory
+          const resultFilePath = path.join(
+            mainCypressFolder,
+            'results',
+            'retries.json'
+          );
+
+          fs.writeFileSync(resultFilePath, JSON.stringify(testRetries, null, 2));
+        });
+
+        on('after:spec', () => {
+          if (global.__coverage__) {
+            delete global.__coverage__;
+          }
+        });
       },
       specPattern,
       supportFile: `${mainCypressFolder}/support/component.tsx`
@@ -60,6 +94,7 @@ module.exports = ({
       },
       ...env
     },
+    numTestsKeptInMemory: 1,
     reporter: 'mochawesome',
     reporterOptions: {
       html: false,
@@ -68,6 +103,10 @@ module.exports = ({
       reportDir: `${mainCypressFolder}/results`,
       reportFilename: '[name]-report.json'
     },
+    retries: {
+      openMode: 0,
+      runMode: 2
+    },
     video: true,
     videosFolder: `${mainCypressFolder}/results/videos`,
     viewportHeight: 590,

package/cypress/e2e/commands.ts

@@ -166,6 +166,12 @@ Cypress.Commands.add('getContainersLogs', () => {
   return cy.task('getContainersLogs');
 });
 
+Cypress.Commands.add('getContainerMappedPort', (containerName: string, containerPort: number) => {
+  cy.log(`Getting mapped port ${containerPort} of container ${containerName}`);
+
+  return cy.task('getContainerMappedPort', { containerName, containerPort });
+});
+
 interface CopyFromContainerProps {
   destination: string;
   name?: string;
@@ -280,7 +286,16 @@ Cypress.Commands.add('logout', (): void => {
 
   cy.contains(/^Logout$/).click();
 
-  cy.wait('@logout').its('response.statusCode').should('eq', 302);
+  cy.waitUntil(() =>
+    cy.wait('@logout').then((interception) => {
+      return interception?.response?.statusCode === 302;
+    }),
+    {
+      errorMsg: 'Logout did not complete successfully',
+      timeout: 30000,
+      interval: 2000
+    }
+  );
 
   // https://github.com/cypress-io/cypress/issues/25841
   cy.clearAllCookies();
@@ -539,8 +554,8 @@ Cypress.Commands.add(
     cy.log(`Getting logs from container ${name} ...`);
 
     return cy.getLogDirectory().then((logDirectory) => {
-      let sourcePhpLogs = '/var/log/php8.1-fpm-centreon-error.log';
-      let targetPhpLogs = `${logDirectory}/php8.1-fpm-centreon-error.log`;
+      let sourcePhpLogs = '/var/log/php8.2-fpm-centreon-error.log';
+      let targetPhpLogs = `${logDirectory}/php8.2-fpm-centreon-error.log`;
       let sourceApacheLogs = '/var/log/apache2';
       let targetApacheLogs = `${logDirectory}/apache2`;
       if (Cypress.env('WEB_IMAGE_OS').includes('alma')) {
@@ -907,6 +922,7 @@ declare global {
       getContainerId: (containerName: string) => Cypress.Chainable;
       getContainerIpAddress: (containerName: string) => Cypress.Chainable;
       getContainersLogs: () => Cypress.Chainable;
+      getContainerMappedPort: (containerName: string, containerPort: number) => Cypress.Chainable;
       getIframeBody: () => Cypress.Chainable;
       getLogDirectory: () => Cypress.Chainable;
       getTimeFromHeader: () => Cypress.Chainable;

package/cypress/e2e/configuration.ts

@@ -50,13 +50,16 @@ export default ({
       },
       setupNodeEvents: async (cypressOn, config) => {
         const on = require('cypress-on-fix')(cypressOn)
-        installLogsPrinter(
-          on,
-          {
-            commandTrimLength: 5000,
-            defaultTrimLength: 5000,
-          }
-      );
+        installLogsPrinter(on, {
+          commandTrimLength: 5000,
+          defaultTrimLength: 5000,
+        });
+        on("task", {
+          logVersion(message) {
+            console.log(`[LOG]: ${message}`);
+            return null;
+          },
+        });
         await esbuildPreprocessor(on, config);
         tasks(on);
 
@@ -68,7 +71,7 @@ export default ({
     },
     env: {
       ...env,
-      DATABASE_IMAGE: 'bitnami/mariadb:10.11',
+      DATABASE_IMAGE: 'bitnamilegacy/mariadb:10.11',
       OPENID_IMAGE_VERSION: process.env.MAJOR || '24.04',
       SAML_IMAGE_VERSION: process.env.MAJOR || '24.04',
       STABILITY: 'unstable',

package/cypress/e2e/tasks.ts

@@ -2,6 +2,7 @@
 import { execSync } from 'child_process';
 import { existsSync, mkdirSync } from 'fs';
 import path from 'path';
+import fs from "fs";
 
 import tar from 'tar-fs';
 import {
@@ -18,6 +19,13 @@ interface Containers {
   [key: string]: StartedTestContainer;
 }
 
+class NotFoundContainerError extends Error {
+  constructor(message) {
+    super(message);
+    this.name = 'NotFoundContainerError';
+  }
+}
+
 export default (on: Cypress.PluginEvents): void => {
   let dockerEnvironment: StartedDockerComposeEnvironment | null = null;
   const containers: Containers = {};
@@ -30,7 +38,7 @@ export default (on: Cypress.PluginEvents): void => {
     } else if (containers[containerName]) {
       container = containers[containerName];
     } else {
-      throw new Error(`Cannot get container ${containerName}`);
+      throw new NotFoundContainerError(`Cannot get container ${containerName}`);
     }
 
     return container;
@@ -52,7 +60,7 @@ export default (on: Cypress.PluginEvents): void => {
     name: string;
   }
 
-  on('task', {
+  on("task", {
     copyFromContainer: async ({ destination, serviceName, source }) => {
       try {
         const container = getContainer(serviceName);
@@ -63,11 +71,15 @@ export default (on: Cypress.PluginEvents): void => {
             return new Promise<void>((resolve) => {
               const dest = tar.extract(destination);
               archiveStream.pipe(dest);
-              dest.on('finish', resolve);
+              dest.on("finish", resolve);
             });
           });
       } catch (error) {
-        console.error(error);
+        if (error instanceof NotFoundContainerError) {
+          console.log(`Cannot get ${source} from container ${serviceName} because it doesn't exist.`);
+        } else {
+          console.error(error);
+        }
       }
 
       return null;
@@ -75,19 +87,19 @@ export default (on: Cypress.PluginEvents): void => {
     copyToContainer: async ({ destination, serviceName, source, type }) => {
       const container = getContainer(serviceName);
 
-      if (type === 'directory') {
+      if (type === "directory") {
         await container.copyDirectoriesToContainer([
           {
             source,
-            target: destination
-          }
+            target: destination,
+          },
         ]);
-      } else if (type === 'file') {
+      } else if (type === "file") {
         await container.copyFilesToContainer([
           {
             source,
-            target: destination
-          }
+            target: destination,
+          },
         ]);
       }
 
@@ -102,9 +114,9 @@ export default (on: Cypress.PluginEvents): void => {
     },
     execInContainer: async ({ command, name }) => {
       const { exitCode, output } = await getContainer(name).exec([
-        'bash',
-        '-c',
-        `${command}${command.match(/[\n\r]/) ? '' : ' 2>&1'}`
+        "bash",
+        "-c",
+        `${command}${command.match(/[\n\r]/) ? "" : " 2>&1"}`,
       ]);
 
       return { exitCode, output };
@@ -124,35 +136,40 @@ export default (on: Cypress.PluginEvents): void => {
         const loggedContainers = await dockerode.listContainers();
 
         return loggedContainers.reduce((acc, container) => {
-          const containerName = container.Names[0].replace('/', '');
+          const containerName = container.Names[0].replace("/", "");
           acc[containerName] = execSync(`docker logs -t ${container.Id}`, {
-            stdio: 'pipe'
-          }).toString('utf8');
+            stdio: "pipe",
+          }).toString("utf8");
 
           return acc;
         }, {});
       } catch (error) {
-        console.warn('Cannot get containers logs');
+        console.warn("Cannot get containers logs");
         console.warn(error);
 
         return null;
       }
     },
+    getContainerMappedPort: async ({ containerName, containerPort }) => {
+      const container = getContainer(containerName);
+
+      return container.getMappedPort(containerPort);
+    },
     requestOnDatabase: async ({ database, query }) => {
       let container: StartedTestContainer | null = null;
 
       if (dockerEnvironment !== null) {
-        container = dockerEnvironment.getContainer('db-1');
+        container = dockerEnvironment.getContainer("db-1");
       } else {
-        container = getContainer('web');
+        container = getContainer("web");
       }
 
       const client = await createConnection({
         database,
         host: container.getHost(),
-        password: 'centreon',
+        password: "centreon",
         port: container.getMappedPort(3306),
-        user: 'centreon'
+        user: "centreon",
       });
 
       const [rows, fields] = await client.query(query);
@@ -165,21 +182,21 @@ export default (on: Cypress.PluginEvents): void => {
       command,
       image,
       name,
-      portBindings = []
+      portBindings = [],
     }: StartContainerProps) => {
       let container = await new GenericContainer(image).withName(name);
 
       portBindings.forEach(({ source, destination }) => {
         container = container.withExposedPorts({
           container: source,
-          host: destination
+          host: destination,
         });
       });
 
       if (command) {
         container
-          .withCommand(['bash', '-c', command])
-          .withWaitStrategy(Wait.forSuccessfulCommand('ls'));
+          .withCommand(["bash", "-c", command])
+          .withWaitStrategy(Wait.forSuccessfulCommand("ls"));
       }
 
       containers[name] = await container.start();
@@ -192,7 +209,7 @@ export default (on: Cypress.PluginEvents): void => {
       openidImage,
       profiles,
       samlImage,
-      webImage
+      webImage,
     }) => {
       try {
         const composeFileDir = path.dirname(composeFile);
@@ -200,22 +217,22 @@ export default (on: Cypress.PluginEvents): void => {
 
         dockerEnvironment = await new DockerComposeEnvironment(
           composeFileDir,
-          composeFileName
+          composeFileName,
         )
           .withEnvironment({
             MYSQL_IMAGE: databaseImage,
             OPENID_IMAGE: openidImage,
             SAML_IMAGE: samlImage,
-            WEB_IMAGE: webImage
+            WEB_IMAGE: webImage,
           })
           .withProfiles(...profiles)
           .withStartupTimeout(120000)
           .withWaitStrategy(
-            'web-1',
+            "web-1",
             Wait.forAll([
               Wait.forHealthCheck(),
-              Wait.forLogMessage('Centreon is ready')
-            ])
+              Wait.forLogMessage("Centreon is ready"),
+            ]),
           )
           .up();
 
@@ -252,6 +269,68 @@ export default (on: Cypress.PluginEvents): void => {
       execSync(`npx wait-on ${url}`);
 
       return null;
-    }
+    },
+    listFilesInDirectory: async ( directoryPath ) => {
+      return new Promise((resolve, reject) => {
+        fs.readdir(directoryPath, (err, files) => {
+          if (err) {
+            reject(err);
+          } else {
+            resolve(files);
+          }
+        });
+      });
+    },
+    fileExists: async ( filePath ) => {
+      return fs.existsSync(filePath);
+    },
+    getExportedFile({ downloadsFolder }: { downloadsFolder: string }): string {
+      const files = fs
+        .readdirSync(downloadsFolder)
+        .filter((name) => name.startsWith("ResourceStatusExport_all") && name.endsWith(".csv"))
+        .map((name) => ({
+          name,
+          time: fs.statSync(path.join(downloadsFolder, name)).mtime.getTime()
+        }))
+        .sort((a, b) => b.time - a.time);
+
+      if (files.length === 0) {
+        throw new Error("No exported file found");
+      }
+
+      return path.join(downloadsFolder, files[0].name);
+    },
+    readCsvFile({ filePath }: { filePath: string }): Promise<string> {
+      return new Promise((resolve, reject) => {
+        fs.readFile(filePath, "utf8", (err, data) => {
+          if (err) return reject(err);
+          resolve(data);
+        });
+      });
+    },
+    clearDownloadsFolder({ downloadsFolder }: { downloadsFolder: string }): null {
+      if (!fs.existsSync(downloadsFolder)) {
+        return null;
+      }
+
+      const files = fs.readdirSync(downloadsFolder);
+      for (const file of files) {
+        const filePath = path.join(downloadsFolder, file);
+        fs.unlinkSync(filePath);
+      }
+
+      return null;
+    },
+    isDownloadComplete({ downloadsFolder }: { downloadsFolder: string }): boolean {
+      if (!fs.existsSync(downloadsFolder)) return false;
+
+      const files = fs
+        .readdirSync(downloadsFolder)
+        .filter(
+          (name) => !name.endsWith(".crdownload") && !name.endsWith(".tmp")
+        );
+
+      return files.length > 0;
+    },
   });
 };

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@centreon/js-config",
     "description": "Centreon Frontend shared build configuration",
-    "version": "25.3.1",
+    "version": "25.4.0-MON-191119-npm-develop.0",
     "repository": {
         "type": "git",
         "url": "git+https://github.com/centreon/centreon-frontend.git"
@@ -21,16 +21,16 @@
         "prettier": "^3.0.0"
     },
     "dependencies": {
-        "@badeball/cypress-cucumber-preprocessor": "^20.1.2",
-        "@bahmutov/cypress-esbuild-preprocessor": "^2.2.2",
+        "@badeball/cypress-cucumber-preprocessor": "^23.2.1",
+        "@bahmutov/cypress-esbuild-preprocessor": "^2.2.7",
         "@esbuild-plugins/node-globals-polyfill": "^0.2.3",
         "@esbuild-plugins/node-modules-polyfill": "^0.2.2",
         "@tsconfig/node16": "^16.1.3",
         "@tsconfig/node20": "^20.1.4",
         "@types/cypress-cucumber-preprocessor": "^4.0.5",
-        "cypress": "^13.13.3",
-        "cypress-multi-reporters": "^1.6.4",
-        "cypress-terminal-report": "^6.1.2",
+        "cypress": "^15.5.0",
+        "cypress-multi-reporters": "^2.0.5",
+        "cypress-terminal-report": "^7.3.3",
         "cypress-wait-until": "^3.0.2",
         "dotenv": "^16.4.5",
         "esbuild": "^0.21.5",

package/rspack/base/globalConfig.js

@@ -6,7 +6,7 @@ const excludeNodeModulesExceptCentreonUi =
 module.exports = {
   cache: false,
   excludeNodeModulesExceptCentreonUi,
-  getModuleConfiguration: (enableCoverage) => ({
+  getModuleConfiguration: (enableCoverage, postCssBase = './') => ({
     rules: [
       {
         exclude: [excludeNodeModulesExceptCentreonUi],
@@ -51,8 +51,22 @@ module.exports = {
         type: 'asset/resource'
       },
       {
-        test: /\.css$/i,
-        use: ['style-loader', 'css-loader']
+        test: /\.css$/,
+        type: 'css/auto',
+        use: [
+          {
+            loader: 'postcss-loader',
+            options: {
+              postcssOptions: {
+                plugins: {
+                  '@tailwindcss/postcss': {
+                    base: postCssBase
+                  }
+                }
+              }
+            }
+          }
+        ]
       }
     ]
   }),
@@ -64,10 +78,10 @@ module.exports = {
   },
   output: {
     chunkFilename: isDev
-      ? '[name].[chunkhash:8].chunk.js'
+      ? '[name].[contenthash:8].[chunkhash:8].chunk.js'
       : '[name].[contenthash].[chunkhash].[hash].js',
     filename: isDev
-      ? '[name].[chunkhash:8].js'
+      ? '[name].[contenthash:8].js'
       : '[name].[contenthash].[hash].js',
     libraryTarget: 'umd',
     umdNamedDefine: true

package/rspack/base/index.js

@@ -12,10 +12,11 @@ const {
 const getBaseConfiguration = ({
   moduleName,
   moduleFederationConfig,
-  enableCoverage
+  enableCoverage,
+  postCssBase
 }) => ({
   cache,
-  module: getModuleConfiguration(enableCoverage),
+  module: getModuleConfiguration(enableCoverage, postCssBase),
   optimization,
   output: {
     ...output,
@@ -23,51 +24,55 @@ const getBaseConfiguration = ({
     library: moduleName,
     uniqueName: moduleName
   },
+  experiments: {
+    css: true
+  },
   plugins: [
     moduleName &&
-      new rspack.container.ModuleFederationPlugin({
-        filename: 'remoteEntry.[chunkhash:8].js',
-        library: { name: moduleName, type: 'umd' },
-        name: moduleName,
-        shared: [
-          {
-            '@centreon/ui-context': {
-              requiredVersion: '1.x',
-              singleton: true
-            }
-          },
-          {
-            jotai: {
-              requiredVersion: '2.x',
-              singleton: true
-            }
-          },
-          {
-            'jotai-suspense': {
-              singleton: true
-            }
-          },
-          {
-            react: {
-              requiredVersion: '19.x',
-              singleton: true
-            }
-          },
-          {
-            'react-i18next': {
-              requiredVersion: '15.x',
-              singleton: true
-            }
-          },
-          {
-            'react-router': {
-              requiredVersion: '7.x',
-              singleton: true
-            }
+    new rspack.container.ModuleFederationPlugin({
+      filename: 'remoteEntry.[chunkhash:8].js',
+      library: { name: moduleName, type: 'umd' },
+      name: moduleName,
+      shared: [
+        {
+          '@centreon/ui-context': {
+            requiredVersion: '1.x',
+            singleton: true
+          }
+        },
+        {
+          jotai: {
+            requiredVersion: '2.x',
+            singleton: true
+          }
+        },
+        {
+          'jotai-suspense': {
+            singleton: true
+          }
+        },
+        {
+          react: {
+            requiredVersion: '19.x',
+            singleton: true
+          }
+        },
+        {
+          'react-i18next': {
+            requiredVersion: '15.x',
+            singleton: true
+          }
+        },
+        {
+          'react-router': {
+            requiredVersion: '7.x',
+            singleton: true
           }
-        ],
-        ...moduleFederationConfig
-      })
+        },
+        { tailwindcss: { singleton: true, requiredVersion: '4.x' } }
+      ],
+      ...moduleFederationConfig
+    })
   ].filter(Boolean),
   resolve: {
     alias: {

package/rspack/patch/dev.js

@@ -1,12 +1,9 @@
 module.exports = {
-  getDevConfiguration: () => ({
-    cache: true,
-    devtool: 'eval-cheap-module-source-map',
-    optimization: {
-      splitChunks: false
-    },
-    output: {
-      filename: '[name].js'
-    }
-  })
+	getDevConfiguration: () => ({
+		cache: true,
+		devtool: "eval-cheap-module-source-map",
+		optimization: {
+			splitChunks: false,
+		},
+	}),
 };

package/cypress/component/excludeNodeModulesFromCoverage.js

@@ -1,36 +0,0 @@
-const fs = require('fs');
-const path = require('path');
-
-const filePath = process.argv[2];
-
-const { error: logError } = console;
-
-try {
-  const outFile = fs.readFileSync(path.resolve(filePath)).toString();
-  const outFileJson = JSON.parse(outFile);
-
-  const coveragesWithoutNodeModules = Object.entries(outFileJson)
-    .map(([key, value]) => {
-      if (key.includes('node_modules')) {
-        return undefined;
-      }
-
-      return [key, value];
-    })
-    .filter((v) => v);
-
-  const finalOutJson = coveragesWithoutNodeModules.reduce(
-    (acc, [key, value]) => ({
-      ...acc,
-      [key]: value
-    }),
-    {}
-  );
-
-  fs.writeFileSync(
-    path.resolve(filePath),
-    JSON.stringify(finalOutJson, null, 2)
-  );
-} catch (error) {
-  logError(error.message);
-}