@centreon/js-config 24.4.14 → 24.4.15

package/cypress/e2e/commands.ts

@@ -1,6 +1,11 @@
 /* eslint-disable @typescript-eslint/no-namespace */
 
 import './commands/configuration';
+import './commands/monitoring';
+
+import installLogsCollector from 'cypress-terminal-report/src/installLogsCollector';
+
+installLogsCollector({ enableExtendedCollector: true });
 
 const apiLoginV2 = '/centreon/authentication/providers/configurations/local';
 
@@ -23,7 +28,7 @@ Cypress.Commands.add('getWebVersion', (): Cypress.Chainable => {
 
 Cypress.Commands.add('getIframeBody', (): Cypress.Chainable => {
   return cy
-    .get('iframe#main-content')
+    .get('iframe#main-content', { timeout: 10000 })
     .its('0.contentDocument.body')
     .should('not.be.empty')
     .then(cy.wrap);
@@ -39,6 +44,13 @@ Cypress.Commands.add(
   }
 );
 
+Cypress.Commands.add(
+  'clickSubRootMenuItem',
+  (page: string): Cypress.Chainable => {
+    return cy.get('div[data-cy="collapse"]').eq(1).contains(page).click();
+  }
+);
+
 interface NavigateToProps {
   page: string;
   rootItemNumber: number;
@@ -51,8 +63,13 @@ Cypress.Commands.add(
     if (subMenu) {
       cy.hoverRootMenuItem(rootItemNumber)
         .contains(subMenu)
-        .trigger('mouseover', { force: true });
-      cy.contains(page).click({ force: true });
+        .trigger('mouseover')
+        .get('.MuiCollapse-wrapper')
+        .find('div[data-cy="collapse"]')
+        .should('be.visible')
+        .and('contain', page);
+
+      cy.clickSubRootMenuItem(page);
 
       return;
     }
@@ -85,29 +102,41 @@ Cypress.Commands.add(
 
 interface CopyFromContainerProps {
   destination: string;
+  name?: string;
   source: string;
 }
 
 Cypress.Commands.add(
   'copyFromContainer',
-  ({ source, destination }: CopyFromContainerProps) => {
-    return cy.exec(
-      `docker cp ${Cypress.env('dockerName')}:${source} "${destination}"`
-    );
+  (
+    {
+      name = Cypress.env('dockerName'),
+      source,
+      destination
+    }: CopyFromContainerProps,
+    options?: Partial<Cypress.ExecOptions>
+  ) => {
+    return cy.exec(`docker cp ${name}:${source} "${destination}"`, options);
   }
 );
 
 interface CopyToContainerProps {
   destination: string;
+  name?: string;
   source: string;
 }
 
 Cypress.Commands.add(
   'copyToContainer',
-  ({ source, destination }: CopyToContainerProps) => {
-    return cy.exec(
-      `docker cp ${source} ${Cypress.env('dockerName')}:${destination}`
-    );
+  (
+    {
+      name = Cypress.env('dockerName'),
+      source,
+      destination
+    }: CopyToContainerProps,
+    options?: Partial<Cypress.ExecOptions>
+  ) => {
+    return cy.exec(`docker cp ${source} ${name}:${destination}`, options);
   }
 );
 
@@ -118,7 +147,7 @@ interface LoginByTypeOfUserProps {
 
 Cypress.Commands.add(
   'loginByTypeOfUser',
-  ({ jsonName, loginViaApi }): Cypress.Chainable => {
+  ({ jsonName = 'admin', loginViaApi = false }): Cypress.Chainable => {
     if (loginViaApi) {
       return cy
         .fixture(`users/${jsonName}.json`)
@@ -135,24 +164,25 @@ Cypress.Commands.add(
         .visit(`${Cypress.config().baseUrl}`)
         .wait('@getNavigationList');
     }
+
     cy.visit(`${Cypress.config().baseUrl}`)
       .fixture(`users/${jsonName}.json`)
       .then((credential) => {
-        cy.getByLabel({ label: 'Alias', tag: 'input' }).type(credential.login);
+        cy.getByLabel({ label: 'Alias', tag: 'input' }).type(
+          `{selectAll}{backspace}${credential.login}`
+        );
         cy.getByLabel({ label: 'Password', tag: 'input' }).type(
-          credential.password
+          `{selectAll}{backspace}${credential.password}`
         );
       })
       .getByLabel({ label: 'Connect', tag: 'button' })
       .click();
 
-    return cy
-      .get('.SnackbarContent-root > .MuiPaper-root')
-      .then(($snackbar) => {
-        if ($snackbar.text().includes('Login succeeded')) {
-          cy.wait('@getNavigationList');
-        }
-      });
+    return cy.get('.MuiAlert-message').then(($snackbar) => {
+      if ($snackbar.text().includes('Login succeeded')) {
+        cy.wait('@getNavigationList');
+      }
+    });
   }
 );
 
@@ -210,29 +240,20 @@ interface StartContainerProps {
 Cypress.Commands.add(
   'startContainer',
   ({ name, image, portBindings }: StartContainerProps): Cypress.Chainable => {
-    return cy
-      .exec('docker image list --format "{{.Repository}}:{{.Tag}}"')
-      .then(({ stdout }) => {
-        if (
-          stdout.match(
-            new RegExp(
-              `^${image.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&')}`,
-              'm'
-            )
-          )
-        ) {
-          cy.log(`Local docker image found : ${image}`);
+    cy.log(`Starting container ${name} from image ${image}`);
 
-          return cy.wrap(image);
-        }
-
-        cy.log(`Pulling remote docker image : ${image}`);
+    return cy.task(
+      'startContainer',
+      { image, name, portBindings },
+      { timeout: 600000 } // 10 minutes because docker pull can be very slow
+    );
+  }
+);
 
-        return cy.exec(`docker pull ${image}`).then(() => cy.wrap(image));
-      })
-      .then((imageName) =>
-        cy.task('startContainer', { image: imageName, name, portBindings })
-      );
+Cypress.Commands.add(
+  'createDirectory',
+  (directoryPath: string): Cypress.Chainable => {
+    return cy.task('createDirectory', directoryPath);
   }
 );
 
@@ -247,7 +268,7 @@ Cypress.Commands.add(
   'startWebContainer',
   ({
     name = Cypress.env('dockerName'),
-    os = 'alma9',
+    os = Cypress.env('WEB_IMAGE_OS'),
     useSlim = true,
     version = Cypress.env('WEB_IMAGE_VERSION')
   }: StartWebContainerProps = {}): Cypress.Chainable => {
@@ -262,12 +283,13 @@ Cypress.Commands.add(
         portBindings: [{ destination: 4000, source: 80 }]
       })
       .then(() => {
-        const baseUrl = 'http://0.0.0.0:4000';
+        const baseUrl = 'http://127.0.0.1:4000';
 
         Cypress.config('baseUrl', baseUrl);
 
-        return cy.exec(
-          `npx wait-on ${baseUrl}/centreon/api/latest/platform/installation/status`
+        return cy.task(
+          'waitOn',
+          `${baseUrl}/centreon/api/latest/platform/installation/status`
         );
       })
       .visit('/') // this is necessary to refresh browser cause baseUrl has changed (flash appears in video)
@@ -284,7 +306,7 @@ Cypress.Commands.add(
   ({
     name = Cypress.env('dockerName')
   }: StopWebContainerProps = {}): Cypress.Chainable => {
-    const logDirectory = `cypress/results/logs/${Cypress.spec.name.replace(
+    const logDirectory = `results/logs/${Cypress.spec.name.replace(
       artifactIllegalCharactersMatcher,
       '_'
     )}/${Cypress.currentTest.title.replace(
@@ -294,25 +316,64 @@ Cypress.Commands.add(
 
     return cy
       .visitEmptyPage()
-      .exec(`mkdir -p "${logDirectory}"`)
+      .createDirectory(logDirectory)
       .copyFromContainer({
         destination: `${logDirectory}/broker`,
+        name,
         source: '/var/log/centreon-broker'
       })
       .copyFromContainer({
         destination: `${logDirectory}/engine`,
+        name,
         source: '/var/log/centreon-engine'
       })
-      .execInContainer({
-        command: `bash -e <<EOF
-        chmod 777 /var/log/centreon/centreon-web.log > /dev/null 2>&1 || :
-EOF`,
-        name
-      })
       .copyFromContainer({
         destination: `${logDirectory}/centreon`,
+        name,
         source: '/var/log/centreon'
       })
+      .copyFromContainer({
+        destination: `${logDirectory}/centreon-gorgone`,
+        name,
+        source: '/var/log/centreon-gorgone'
+      })
+      .then(() => {
+        if (Cypress.env('WEB_IMAGE_OS').includes('alma')) {
+          return cy.copyFromContainer({
+            destination: `${logDirectory}/php`,
+            name,
+            source: '/var/log/php-fpm'
+          });
+        }
+
+        return cy.copyFromContainer(
+          {
+            destination: `${logDirectory}/php8.1-fpm-centreon-error.log`,
+            name,
+            source: '/var/log/php8.1-fpm-centreon-error.log'
+          },
+          { failOnNonZeroExit: false }
+        );
+      })
+      .then(() => {
+        if (Cypress.env('WEB_IMAGE_OS').includes('alma')) {
+          return cy.copyFromContainer({
+            destination: `${logDirectory}/httpd`,
+            name,
+            source: '/var/log/httpd'
+          });
+        }
+
+        return cy.copyFromContainer(
+          {
+            destination: `${logDirectory}/apache2`,
+            name,
+            source: '/var/log/apache2'
+          },
+          { failOnNonZeroExit: false }
+        );
+      })
+      .exec(`chmod -R 755 "${logDirectory}"`)
       .stopContainer({ name });
   }
 );
@@ -324,9 +385,11 @@ interface StopContainerProps {
 Cypress.Commands.add(
   'stopContainer',
   ({ name }: StopContainerProps): Cypress.Chainable => {
+    cy.log(`Stopping container ${name}`);
+
     cy.exec(`docker logs ${name}`).then(({ stdout }) => {
       cy.writeFile(
-        `cypress/results/logs/${Cypress.spec.name.replace(
+        `results/logs/${Cypress.spec.name.replace(
           artifactIllegalCharactersMatcher,
           '_'
         )}/${Cypress.currentTest.title.replace(
@@ -341,21 +404,192 @@ Cypress.Commands.add(
   }
 );
 
+interface Dashboard {
+  description?: string;
+  name: string;
+}
+
+Cypress.Commands.add(
+  'insertDashboardList',
+  (fixtureFile: string): Cypress.Chainable => {
+    return cy.fixture(fixtureFile).then((dashboardList) => {
+      cy.wrap(
+        Promise.all(
+          dashboardList.map((dashboardBody: Dashboard) =>
+            cy.insertDashboard({ ...dashboardBody })
+          )
+        )
+      );
+    });
+  }
+);
+
+Cypress.Commands.add(
+  'insertDashboard',
+  (dashboardBody: Dashboard): Cypress.Chainable => {
+    return cy.request({
+      body: {
+        ...dashboardBody
+      },
+      method: 'POST',
+      url: '/centreon/api/latest/configuration/dashboards'
+    });
+  }
+);
+
+Cypress.Commands.add(
+  'insertDashboardWithWidget',
+  (dashboardBody, patchBody) => {
+    cy.request({
+      body: {
+        ...dashboardBody
+      },
+      method: 'POST',
+      url: '/centreon/api/latest/configuration/dashboards'
+    }).then((response) => {
+      const dashboardId = response.body.id;
+      cy.waitUntil(
+        () => {
+          return cy
+            .request({
+              method: 'GET',
+              url: `/centreon/api/latest/configuration/dashboards/${dashboardId}`
+            })
+            .then((getResponse) => {
+              return getResponse.body && getResponse.body.id === dashboardId;
+            });
+        },
+        {
+          timeout: 10000
+        }
+      );
+      cy.request({
+        body: patchBody,
+        method: 'PATCH',
+        url: `/centreon/api/latest/configuration/dashboards/${dashboardId}`
+      });
+    });
+  }
+);
+
+interface ShareDashboardToUserProps {
+  dashboardName: string;
+  role: string;
+  userName: string;
+}
+
+interface ListingRequestResult {
+  body: {
+    result: Array<{
+      id: number;
+    }>;
+  };
+}
+
+interface PatchDashboardBody {
+  panels: Array<{
+    layout: {
+      height: number;
+      min_height: number;
+      min_width: number;
+      width: number;
+      x: number;
+      y: number;
+    };
+    name: string;
+    widget_settings: {
+      options: {
+        description: {
+          content: string;
+          enabled: boolean;
+        };
+        name: string;
+      };
+    };
+    widget_type: string;
+  }>;
+}
+
+Cypress.Commands.add(
+  'shareDashboardToUser',
+  ({ dashboardName, userName, role }: ShareDashboardToUserProps): void => {
+    Promise.all([
+      cy.request({
+        method: 'GET',
+        url: `/centreon/api/latest/configuration/users?search={"name":"${userName}"}`
+      }),
+      cy.request({
+        method: 'GET',
+        url: `/centreon/api/latest/configuration/dashboards?search={"name":"${dashboardName}"}`
+      })
+    ]).then(
+      ([retrievedUser, retrievedDashboard]: [
+        ListingRequestResult,
+        ListingRequestResult
+      ]) => {
+        const userId = retrievedUser.body.result[0].id;
+        const dashboardId = retrievedDashboard.body.result[0].id;
+
+        cy.request({
+          body: {
+            id: userId,
+            role: `${role}`
+          },
+          method: 'POST',
+          url: `/centreon/api/latest/configuration/dashboards/${dashboardId}/access_rights/contacts`
+        });
+      }
+    );
+  }
+);
+
+Cypress.Commands.add('getTimeFromHeader', (): Cypress.Chainable => {
+  return cy
+    .get('header div[data-cy="clock"]', { timeout: 10000 })
+    .should('be.visible')
+    .then(($time) => {
+      const headerTime = $time.children()[1].textContent;
+      if (headerTime?.match(/\d+:\d+/)) {
+        cy.log(`header time is : ${headerTime}`);
+
+        return cy.wrap(headerTime);
+      }
+
+      throw new Error(`header time is not displayed`);
+    });
+});
+
 declare global {
   namespace Cypress {
     interface Chainable {
-      copyFromContainer: (props: CopyFromContainerProps) => Cypress.Chainable;
-      copyToContainer: (props: CopyToContainerProps) => Cypress.Chainable;
+      clickSubRootMenuItem: (page: string) => Cypress.Chainable;
+      copyFromContainer: (
+        props: CopyFromContainerProps,
+        options?: Partial<Cypress.ExecOptions>
+      ) => Cypress.Chainable;
+      copyToContainer: (
+        props: CopyToContainerProps,
+        options?: Partial<Cypress.ExecOptions>
+      ) => Cypress.Chainable;
+      createDirectory: (directoryPath: string) => Cypress.Chainable;
       execInContainer: ({
         command,
         name
       }: ExecInContainerProps) => Cypress.Chainable;
       getIframeBody: () => Cypress.Chainable;
+      getTimeFromHeader: () => Cypress.Chainable;
       getWebVersion: () => Cypress.Chainable;
       hoverRootMenuItem: (rootItemNumber: number) => Cypress.Chainable;
+      insertDashboard: (dashboard: Dashboard) => Cypress.Chainable;
+      insertDashboardList: (fixtureFile: string) => Cypress.Chainable;
+      insertDashboardWithWidget: (
+        dashboard: Dashboard,
+        patch: PatchDashboardBody
+      ) => Cypress.Chainable;
+
       loginByTypeOfUser: ({
-        jsonName = 'admin',
-        loginViaApi = false
+        jsonName,
+        loginViaApi
       }: LoginByTypeOfUserProps) => Cypress.Chainable;
       moveSortableElement: (direction: string) => Cypress.Chainable;
       navigateTo: ({
@@ -363,6 +597,11 @@ declare global {
         rootItemNumber,
         subMenu
       }: NavigateToProps) => Cypress.Chainable;
+      shareDashboardToUser: ({
+        dashboardName,
+        userName,
+        role
+      }: ShareDashboardToUserProps) => Cypress.Chainable;
       startContainer: ({
         name,
         image

package/cypress/e2e/configuration.ts

@@ -4,13 +4,18 @@
 import { execSync } from 'child_process';
 
 import { defineConfig } from 'cypress';
+import installLogsPrinter from 'cypress-terminal-report/src/installLogsPrinter';
+import { config as configDotenv } from 'dotenv';
 
-import setupNodeEvents from './plugins';
+import esbuildPreprocessor from './esbuild-preprocessor';
+import plugins from './plugins';
+import tasks from './tasks';
 
 interface ConfigurationOptions {
   cypressFolder?: string;
   dockerName?: string;
   env?: Record<string, unknown>;
+  envFile?: string;
   isDevelopment?: boolean;
   specPattern: string;
 }
@@ -20,11 +25,14 @@ export default ({
   cypressFolder,
   isDevelopment,
   dockerName,
-  env
+  env,
+  envFile
 }: ConfigurationOptions): Cypress.ConfigOptions => {
-  const resultsFolder = `${cypressFolder || 'cypress'}/results${
-    isDevelopment ? '/dev' : ''
-  }`;
+  if (envFile) {
+    configDotenv({ path: envFile });
+  }
+
+  const resultsFolder = `${cypressFolder || '.'}/results`;
 
   const webImageVersion = execSync('git rev-parse --abbrev-ref HEAD')
     .toString('utf8')
@@ -35,44 +43,34 @@ export default ({
     defaultCommandTimeout: 6000,
     e2e: {
       excludeSpecPattern: ['*.js', '*.ts', '*.md'],
-      setupNodeEvents,
-      specPattern
+      fixturesFolder: 'fixtures',
+      reporter: require.resolve('cypress-multi-reporters'),
+      reporterOptions: {
+        configFile: `${__dirname}/reporter-config.js`
+      },
+      setupNodeEvents: async (on, config) => {
+        installLogsPrinter(on);
+        await esbuildPreprocessor(on, config);
+        tasks(on);
+
+        return plugins(on, config);
+      },
+      specPattern,
+      supportFile: 'support/e2e.{js,jsx,ts,tsx}'
     },
     env: {
       ...env,
-      OPENID_IMAGE_VERSION: '23.04',
+      OPENID_IMAGE_VERSION: process.env.MAJOR || '24.04',
       WEB_IMAGE_OS: 'alma9',
       WEB_IMAGE_VERSION: webImageVersion,
       dockerName: dockerName || 'centreon-dev'
     },
-    execTimeout: 120000,
-    reporter: 'mochawesome',
-    reporterOptions: {
-      html: false,
-      json: true,
-      overwrite: true,
-      reportDir: `${resultsFolder}/reports`,
-      reportFilename: '[name]-report.json'
-    },
+    execTimeout: 60000,
     requestTimeout: 10000,
     retries: 0,
     screenshotsFolder: `${resultsFolder}/screenshots`,
-    setupNodeEvents: (on, config) => {
-      on('before:browser:launch', (browser, launchOptions) => {
-        if (browser.name === 'chrome' && browser.isHeadless) {
-          launchOptions.args = launchOptions.args.map((arg) => {
-            if (arg === '--headless') {
-              return '--headless=new';
-            }
-
-            return arg;
-          });
-        }
-
-        return launchOptions;
-      });
-    },
     video: true,
+    videoCompression: 0,
     videosFolder: `${resultsFolder}/videos`
   });
 };

package/cypress/e2e/esbuild-preprocessor.ts

@@ -0,0 +1,26 @@
+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
+        })
+      ]
+    })
+  );
+};