@centreon/js-config 23.10.62 → 23.10.64

package/cypress/component/commands.tsx

@@ -4,15 +4,13 @@ import React from 'react';
 import { mount } from 'cypress/react18';
 import { equals, isNil } from 'ramda';
 
-import { Box, CssBaseline } from '@mui/material';
+import { Box } from '@mui/material';
 
 import { ThemeProvider } from '@centreon/ui';
 
 import '@testing-library/cypress/add-commands';
 import 'cypress-msw-interceptor';
 
-import disableMotion from './disableCssTransitions';
-
 interface MountProps {
   Component: React.ReactNode;
   options?: object;
@@ -26,7 +24,7 @@ export enum Method {
   PUT = 'PUT'
 }
 
-Cypress.Commands.add('mount', ({ Component, options = {} }) => {
+Cypress.Commands.add('mount', ({ Component, options }) => {
   const wrapped = (
     <ThemeProvider>
       <Box
@@ -38,10 +36,11 @@ Cypress.Commands.add('mount', ({ Component, options = {} }) => {
       >
         {Component}
       </Box>
-      <CssBaseline />
     </ThemeProvider>
   );
 
+  document.getElementsByTagName('body')[0].setAttribute('style', 'margin:0px');
+
   return mount(wrapped, options);
 });
 
@@ -96,32 +95,20 @@ Cypress.Commands.add(
   }
 );
 
-interface MoveSortableElementProps {
-  direction: 'up' | 'down' | 'left' | 'right';
-  element: Cypress.Chainable<JQuery<HTMLElement>>;
-  times?: number;
-}
-
-Cypress.Commands.add(
-  'moveSortableElement',
-  ({ element, direction, times = 1 }: MoveSortableElementProps): void => {
-    const key = `{${direction}arrow}`;
-
-    element.type(' ', {
-      force: true,
-      scrollBehavior: false
-    });
+Cypress.Commands.add('moveSortableElement', ({ element, direction }): void => {
+  const key = `{${direction}arrow}`;
 
-    Array.from({ length: times }).forEach(() => {
-      element.eq(-1).type(key, {
-        scrollBehavior: false
-      });
-    });
-    element.eq(-1).type(' ', {
-      scrollBehavior: false
-    });
-  }
-);
+  element.type(' ', {
+    force: true,
+    scrollBehavior: false
+  });
+  element.eq(-1).type(key, {
+    scrollBehavior: false
+  });
+  element.eq(-1).type(' ', {
+    scrollBehavior: false
+  });
+});
 
 Cypress.Commands.add(
   'moveSortableElementUsingAriaLabel',
@@ -141,32 +128,15 @@ Cypress.Commands.add(
   }
 );
 
-Cypress.Commands.add('makeSnapshot', (title?: string) => {
-  cy.viewport(1280, 590);
-  cy.matchImageSnapshot(title);
-});
-
-Cypress.Commands.add('cssDisableMotion', (): void => {
-  Cypress.on('window:before:load', (cyWindow) => {
-    disableMotion(cyWindow);
-  });
-});
-
 declare global {
   namespace Cypress {
     interface Chainable {
-      cssDisableMotion: () => Cypress.Chainable;
       interceptAPIRequest: <T extends object>(
         props: InterceptAPIRequestProps<T>
       ) => Cypress.Chainable;
       interceptRequest: (method, path, mock, alias) => Cypress.Chainable;
-      makeSnapshot: (title?: string) => void;
-      mount: ({ Component, options }: MountProps) => Cypress.Chainable;
-      moveSortableElement: ({
-        element,
-        direction,
-        times
-      }: MoveSortableElementProps) => void;
+      mount: ({ Component, options = {} }: MountProps) => Cypress.Chainable;
+      moveSortableElement: ({ ariaLabel, direction }) => void;
       moveSortableElementUsingAriaLabel: ({ ariaLabel, direction }) => void;
       waitForRequest: (alias) => Cypress.Chainable;
     }

package/cypress/component/configuration.js

@@ -4,30 +4,28 @@ const {
   addMatchImageSnapshotPlugin
 } = require('@simonsmith/cypress-image-snapshot/plugin');
 
-module.exports = ({
-  webpackConfig,
-  cypressFolder,
-  specPattern,
-  env,
-  useVite = false,
-  excludeSpecPattern
-}) => {
+module.exports = ({ webpackConfig, cypressFolder, specPattern, env }) => {
   const mainCypressFolder = cypressFolder || 'cypress';
 
   return defineConfig({
     component: {
       devServer: {
-        bundler: useVite ? 'vite' : 'webpack',
+        bundler: 'webpack',
         framework: 'react',
         webpackConfig
       },
-      excludeSpecPattern,
       setupNodeEvents: (on, config) => {
         addMatchImageSnapshotPlugin(on, config);
 
         on('before:browser:launch', (browser, launchOptions) => {
           if (browser.name === 'chrome' && browser.isHeadless) {
-            launchOptions.args.push('--headless=new');
+            launchOptions.args = launchOptions.args.map((arg) => {
+              if (arg === '--headless') {
+                return '--headless=new';
+              }
+
+              return arg;
+            });
           }
 
           return launchOptions;

package/cypress/component/enableVisualTesting.ts

@@ -13,7 +13,7 @@ const enableVisualTesting = (cypressFolder = 'cypress'): void => {
     capture: 'viewport',
     customDiffConfig: { threshold: 0.01 },
     customSnapshotsDir: `${cypressFolder}/visual-testing-snapshots`,
-    failureThreshold: 0.07,
+    failureThreshold: 0.06,
     failureThresholdType: 'percent'
   });
 };

package/cypress/e2e/commands.ts

@@ -1,11 +1,6 @@
 /* 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';
 
@@ -28,7 +23,7 @@ Cypress.Commands.add('getWebVersion', (): Cypress.Chainable => {
 
 Cypress.Commands.add('getIframeBody', (): Cypress.Chainable => {
   return cy
-    .get('iframe#main-content', { timeout: 10000 })
+    .get('iframe#main-content')
     .its('0.contentDocument.body')
     .should('not.be.empty')
     .then(cy.wrap);
@@ -44,13 +39,6 @@ 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;
@@ -63,13 +51,8 @@ Cypress.Commands.add(
     if (subMenu) {
       cy.hoverRootMenuItem(rootItemNumber)
         .contains(subMenu)
-        .trigger('mouseover')
-        .get('.MuiCollapse-wrapper')
-        .find('div[data-cy="collapse"]')
-        .should('be.visible')
-        .and('contain', page);
-
-      cy.clickSubRootMenuItem(page);
+        .trigger('mouseover', { force: true });
+      cy.contains(page).click({ force: true });
 
       return;
     }
@@ -102,41 +85,29 @@ Cypress.Commands.add(
 
 interface CopyFromContainerProps {
   destination: string;
-  name?: string;
   source: string;
 }
 
 Cypress.Commands.add(
   'copyFromContainer',
-  (
-    {
-      name = Cypress.env('dockerName'),
-      source,
-      destination
-    }: CopyFromContainerProps,
-    options?: Partial<Cypress.ExecOptions>
-  ) => {
-    return cy.exec(`docker cp ${name}:${source} "${destination}"`, options);
+  ({ source, destination }: CopyFromContainerProps) => {
+    return cy.exec(
+      `docker cp ${Cypress.env('dockerName')}:${source} "${destination}"`
+    );
   }
 );
 
 interface CopyToContainerProps {
   destination: string;
-  name?: string;
   source: string;
 }
 
 Cypress.Commands.add(
   'copyToContainer',
-  (
-    {
-      name = Cypress.env('dockerName'),
-      source,
-      destination
-    }: CopyToContainerProps,
-    options?: Partial<Cypress.ExecOptions>
-  ) => {
-    return cy.exec(`docker cp ${source} ${name}:${destination}`, options);
+  ({ source, destination }: CopyToContainerProps) => {
+    return cy.exec(
+      `docker cp ${source} ${Cypress.env('dockerName')}:${destination}`
+    );
   }
 );
 
@@ -147,7 +118,7 @@ interface LoginByTypeOfUserProps {
 
 Cypress.Commands.add(
   'loginByTypeOfUser',
-  ({ jsonName = 'admin', loginViaApi = false }): Cypress.Chainable => {
+  ({ jsonName, loginViaApi }): Cypress.Chainable => {
     if (loginViaApi) {
       return cy
         .fixture(`users/${jsonName}.json`)
@@ -164,25 +135,24 @@ 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(
-          `{selectAll}{backspace}${credential.login}`
-        );
+        cy.getByLabel({ label: 'Alias', tag: 'input' }).type(credential.login);
         cy.getByLabel({ label: 'Password', tag: 'input' }).type(
-          `{selectAll}{backspace}${credential.password}`
+          credential.password
         );
       })
       .getByLabel({ label: 'Connect', tag: 'button' })
       .click();
 
-    return cy.get('.MuiAlert-message').then(($snackbar) => {
-      if ($snackbar.text().includes('Login succeeded')) {
-        cy.wait('@getNavigationList');
-      }
-    });
+    return cy
+      .get('.SnackbarContent-root > .MuiPaper-root')
+      .then(($snackbar) => {
+        if ($snackbar.text().includes('Login succeeded')) {
+          cy.wait('@getNavigationList');
+        }
+      });
   }
 );
 
@@ -240,20 +210,9 @@ interface StartContainerProps {
 Cypress.Commands.add(
   'startContainer',
   ({ name, image, portBindings }: StartContainerProps): Cypress.Chainable => {
-    cy.log(`Starting container ${name} from image ${image}`);
-
-    return cy.task(
-      'startContainer',
-      { image, name, portBindings },
-      { timeout: 600000 } // 10 minutes because docker pull can be very slow
-    );
-  }
-);
-
-Cypress.Commands.add(
-  'createDirectory',
-  (directoryPath: string): Cypress.Chainable => {
-    return cy.task('createDirectory', directoryPath);
+    return cy
+      .exec(`docker image inspect ${image} || docker pull ${image}`)
+      .task('startContainer', { image, name, portBindings });
   }
 );
 
@@ -268,7 +227,7 @@ Cypress.Commands.add(
   'startWebContainer',
   ({
     name = Cypress.env('dockerName'),
-    os = Cypress.env('WEB_IMAGE_OS'),
+    os = 'alma9',
     useSlim = true,
     version = Cypress.env('WEB_IMAGE_VERSION')
   }: StartWebContainerProps = {}): Cypress.Chainable => {
@@ -283,13 +242,12 @@ Cypress.Commands.add(
         portBindings: [{ destination: 4000, source: 80 }]
       })
       .then(() => {
-        const baseUrl = 'http://127.0.0.1:4000';
+        const baseUrl = 'http://0.0.0.0:4000';
 
         Cypress.config('baseUrl', baseUrl);
 
-        return cy.task(
-          'waitOn',
-          `${baseUrl}/centreon/api/latest/platform/installation/status`
+        return cy.exec(
+          `npx wait-on ${baseUrl}/centreon/api/latest/platform/installation/status`
         );
       })
       .visit('/') // this is necessary to refresh browser cause baseUrl has changed (flash appears in video)
@@ -306,7 +264,7 @@ Cypress.Commands.add(
   ({
     name = Cypress.env('dockerName')
   }: StopWebContainerProps = {}): Cypress.Chainable => {
-    const logDirectory = `results/logs/${Cypress.spec.name.replace(
+    const logDirectory = `cypress/results/logs/${Cypress.spec.name.replace(
       artifactIllegalCharactersMatcher,
       '_'
     )}/${Cypress.currentTest.title.replace(
@@ -316,64 +274,25 @@ Cypress.Commands.add(
 
     return cy
       .visitEmptyPage()
-      .createDirectory(logDirectory)
+      .exec(`mkdir -p "${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 });
   }
 );
@@ -385,11 +304,9 @@ interface StopContainerProps {
 Cypress.Commands.add(
   'stopContainer',
   ({ name }: StopContainerProps): Cypress.Chainable => {
-    cy.log(`Stopping container ${name}`);
-
     cy.exec(`docker logs ${name}`).then(({ stdout }) => {
       cy.writeFile(
-        `results/logs/${Cypress.spec.name.replace(
+        `cypress/results/logs/${Cypress.spec.name.replace(
           artifactIllegalCharactersMatcher,
           '_'
         )}/${Cypress.currentTest.title.replace(
@@ -404,192 +321,21 @@ 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 {
-      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;
+      copyFromContainer: (props: CopyFromContainerProps) => Cypress.Chainable;
+      copyToContainer: (props: CopyToContainerProps) => 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,
-        loginViaApi
+        jsonName = 'admin',
+        loginViaApi = false
       }: LoginByTypeOfUserProps) => Cypress.Chainable;
       moveSortableElement: (direction: string) => Cypress.Chainable;
       navigateTo: ({
@@ -597,11 +343,6 @@ declare global {
         rootItemNumber,
         subMenu
       }: NavigateToProps) => Cypress.Chainable;
-      shareDashboardToUser: ({
-        dashboardName,
-        userName,
-        role
-      }: ShareDashboardToUserProps) => Cypress.Chainable;
       startContainer: ({
         name,
         image