@centreon/js-config 24.10.2 → 24.10.3

package/cypress/component/commands.tsx

@@ -4,29 +4,17 @@ 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 'cypress-real-events';
-
-import disableMotion from './disableCssTransitions';
 
 interface MountProps {
   Component: React.ReactNode;
   options?: object;
 }
-interface Resolution {
-  height: number;
-  width: number;
-}
-
-interface MakeSnapshotWithCustomResolution {
-  resolution: Resolution;
-  title: string;
-}
 
 export enum Method {
   DELETE = 'DELETE',
@@ -36,7 +24,7 @@ export enum Method {
   PUT = 'PUT'
 }
 
-Cypress.Commands.add('mount', ({ Component, options = {} }) => {
+Cypress.Commands.add('mount', ({ Component, options }) => {
   const wrapped = (
     <ThemeProvider>
       <Box
@@ -48,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);
 });
 
@@ -62,7 +51,6 @@ interface Query {
 
 export interface InterceptAPIRequestProps<T> {
   alias: string;
-  delay?: number;
   method: Method;
   path: string;
   query?: Query;
@@ -78,25 +66,23 @@ Cypress.Commands.add(
     response,
     alias,
     query,
-    statusCode = 200,
-    delay = 500
+    statusCode = 200
   }: InterceptAPIRequestProps<T>): void => {
     cy.interceptRequest(
       method,
       path.replace('./', '**'),
       (req, res, ctx) => {
         const getQuery = req?.url?.searchParams?.get(query?.name);
-
         if (query && equals(query.value, getQuery)) {
           return res(
-            ctx.delay(delay),
+            ctx.delay(500),
             ctx.json(response),
             ctx.status(statusCode)
           );
         }
         if (!getQuery && isNil(query)) {
           return res(
-            ctx.delay(delay),
+            ctx.delay(500),
             ctx.json(response),
             ctx.status(statusCode)
           );
@@ -109,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 }): void => {
+  const key = `{${direction}arrow}`;
 
-Cypress.Commands.add(
-  'moveSortableElement',
-  ({ element, direction, times = 1 }: MoveSortableElementProps): void => {
-    const key = `{${direction}arrow}`;
-
-    element.type(' ', {
-      force: true,
-      scrollBehavior: false
-    });
-
-    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',
@@ -154,49 +128,15 @@ Cypress.Commands.add(
   }
 );
 
-Cypress.Commands.add('adjustViewport', () => cy.viewport(1280, 590));
-
-Cypress.Commands.add('makeSnapshot', (title?: string) => {
-  cy.adjustViewport();
-  cy.matchImageSnapshot(title);
-});
-
-Cypress.Commands.add(
-  'makeSnapshotWithCustomResolution',
-  ({ title, resolution }: MakeSnapshotWithCustomResolution) => {
-    const { width, height } = resolution;
-    cy.viewport(width, height);
-    cy.matchImageSnapshot(title);
-  }
-);
-
-Cypress.Commands.add('cssDisableMotion', (): void => {
-  Cypress.on('window:before:load', (cyWindow) => {
-    disableMotion(cyWindow);
-  });
-});
-
 declare global {
   namespace Cypress {
     interface Chainable {
-      adjustViewport: () => Cypress.Chainable;
-      cssDisableMotion: () => Cypress.Chainable;
-      getRequestCalls: (alias) => Cypress.Chainable;
       interceptAPIRequest: <T extends object>(
         props: InterceptAPIRequestProps<T>
       ) => Cypress.Chainable;
       interceptRequest: (method, path, mock, alias) => Cypress.Chainable;
-      makeSnapshot: (title?: string) => void;
-      makeSnapshotWithCustomResolution: ({
-        title,
-        resolution
-      }: MakeSnapshotWithCustomResolution) => Cypress.Chainable;
-      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

@@ -1,44 +1,32 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
-const { devServer } = require('cypress-rspack-dev-server');
 const { defineConfig } = require('cypress');
 const {
   addMatchImageSnapshotPlugin
 } = require('@simonsmith/cypress-image-snapshot/plugin');
-const cypressCodeCoverageTask = require('@cypress/code-coverage/task');
 
-module.exports = ({
-  rspackConfig,
-  cypressFolder,
-  specPattern,
-  env,
-  excludeSpecPattern
-}) => {
+module.exports = ({ webpackConfig, cypressFolder, specPattern, env }) => {
   const mainCypressFolder = cypressFolder || 'cypress';
 
   return defineConfig({
     component: {
-      devServer: (devServerConfig) =>
-        devServer({
-          ...devServerConfig,
-          framework: 'react',
-          rspackConfig
-        }),
-      excludeSpecPattern,
+      devServer: {
+        bundler: 'webpack',
+        framework: 'react',
+        webpackConfig
+      },
       setupNodeEvents: (on, config) => {
         addMatchImageSnapshotPlugin(on, config);
 
-        cypressCodeCoverageTask(on, config);
-        on('task', {
-          coverageReport: () => {
-            return null;
-          }
-        });
-
         on('before:browser:launch', (browser, launchOptions) => {
           if (browser.name === 'chrome' && browser.isHeadless) {
-            launchOptions.args.push('--headless=new');
-            launchOptions.args.push('--force-color-profile=srgb');
             launchOptions.args.push('--window-size=1400,1200');
+            launchOptions.args = launchOptions.args.map((arg) => {
+              if (arg === '--headless') {
+                return '--headless=new';
+              }
+
+              return arg;
+            });
           }
 
           return launchOptions;
@@ -48,17 +36,8 @@ module.exports = ({
       supportFile: `${mainCypressFolder}/support/component.tsx`
     },
     env: {
-      baseUrl: 'http://localhost:9092',
-      codeCoverage: {
-        exclude: [
-          'cypress/**/*.*',
-          'packages/**',
-          'node_modules',
-          '**/*.js',
-          '**/*.spec.tsx'
-        ]
-      },
-      ...env
+      ...env,
+      baseUrl: 'http://localhost:9092'
     },
     reporter: 'mochawesome',
     reporterOptions: {
@@ -69,8 +48,6 @@ module.exports = ({
       reportFilename: '[name]-report.json'
     },
     video: true,
-    videosFolder: `${mainCypressFolder}/results/videos`,
-    viewportHeight: 590,
-    viewportWidth: 1280
+    videosFolder: `${mainCypressFolder}/results/videos`
   });
 };

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: Cypress.env('updateSnapshots') === true ? 0 : 0.07,
+    failureThreshold: 0.06,
     failureThresholdType: 'percent'
   });
 };

package/cypress/e2e/commands/configuration.ts

@@ -1,7 +1,5 @@
 /* eslint-disable @typescript-eslint/no-namespace */
 
-import { Action } from 'e2e/features/ACLs/commands';
-
 const apiBase = '/centreon/api';
 const apiActionV1 = `${apiBase}/index.php`;
 
@@ -140,109 +138,12 @@ Cypress.Commands.add(
   }
 );
 
-interface Contact {
-  GUIAccess?: boolean;
-  admin?: boolean;
-  alias?: string | null;
-  authenticationType?: 'local' | 'ldap';
-  email: string;
-  enableNotifications?: boolean;
-  language?: string;
-  name: string;
-  password: string;
-}
-
-Cypress.Commands.add(
-  'addContact',
-  ({
-    admin = true,
-    alias = null,
-    authenticationType = 'local',
-    email,
-    enableNotifications = true,
-    GUIAccess = true,
-    language = 'en_US',
-    name,
-    password
-  }: Contact): Cypress.Chainable => {
-    const contactAdmin = admin ? 1 : 0;
-    const contactAlias = alias === null ? name : alias;
-    const contactEnableNotifications = enableNotifications ? 1 : 0;
-    const contactGUIAccess = GUIAccess ? 1 : 0;
-
-    return cy
-      .executeActionViaClapi({
-        bodyContent: {
-          action: 'ADD',
-          object: 'CONTACT',
-          values: `${name};${contactAlias};${email};${password};${contactAdmin};${contactGUIAccess};${language};${authenticationType}`
-        }
-      })
-      .then(() => {
-        const contactParams = {
-          enable_notifications: contactEnableNotifications
-        };
-        Object.entries(contactParams).map(([paramName, paramValue]) => {
-          if (paramValue === null) {
-            return null;
-          }
-
-          return cy.executeActionViaClapi({
-            bodyContent: {
-              action: 'SETPARAM',
-              object: 'CONTACT',
-              values: `${name};${paramName};${paramValue}`
-            }
-          });
-        });
-
-        return cy.wrap(null);
-      });
-  }
-);
-
-interface ContactGroup {
-  alias?: string | null;
-  contacts: Array<string>;
-  name: string;
-}
-
-Cypress.Commands.add(
-  'addContactGroup',
-  ({ alias = null, contacts, name }: ContactGroup): Cypress.Chainable => {
-    const contactGroupAlias = alias === null ? name : alias;
-
-    return cy
-      .executeActionViaClapi({
-        bodyContent: {
-          action: 'ADD',
-          object: 'CG',
-          values: `${name};${contactGroupAlias}`
-        }
-      })
-      .then(() => {
-        contacts.map((contact) => {
-          return cy.executeActionViaClapi({
-            bodyContent: {
-              action: 'ADDCONTACT',
-              object: 'CG',
-              values: `${name};${contact}`
-            }
-          });
-        });
-
-        return cy.wrap(null);
-      });
-  }
-);
-
 interface Host {
   activeCheckEnabled?: boolean;
   address?: string;
   alias?: string | null;
   checkCommand?: string | null;
   checkPeriod?: string | null;
-  hostGroup?: string;
   maxCheckAttempts?: number | null;
   name: string;
   passiveCheckEnabled?: boolean;
@@ -258,7 +159,6 @@ Cypress.Commands.add(
     alias = null,
     checkCommand = null,
     checkPeriod = null,
-    hostGroup = '',
     maxCheckAttempts = 1,
     name,
     passiveCheckEnabled = true,
@@ -276,7 +176,7 @@ Cypress.Commands.add(
         bodyContent: {
           action: 'ADD',
           object: 'HOST',
-          values: `${name};${hostAlias};${address};${template};${poller};${hostGroup}`
+          values: `${name};${hostAlias};${address};${template};${poller};`
         }
       })
       .then(() => {
@@ -306,26 +206,6 @@ Cypress.Commands.add(
   }
 );
 
-interface HostGroup {
-  alias?: string | null;
-  name: string;
-}
-
-Cypress.Commands.add(
-  'addHostGroup',
-  ({ alias = null, name }: HostGroup): Cypress.Chainable => {
-    const hostGroupAlias = alias === null ? name : alias;
-
-    return cy.executeActionViaClapi({
-      bodyContent: {
-        action: 'ADD',
-        object: 'HG',
-        values: `${name};${hostGroupAlias}`
-      }
-    });
-  }
-);
-
 interface ServiceTemplate {
   activeCheckEnabled?: boolean;
   checkCommand?: string | null;
@@ -447,45 +327,6 @@ Cypress.Commands.add(
   }
 );
 
-interface ServiceGroup {
-  alias?: string | null;
-  hostsAndServices: Array<Array<string>>;
-  name: string;
-}
-
-Cypress.Commands.add(
-  'addServiceGroup',
-  ({
-    alias = null,
-    hostsAndServices,
-    name
-  }: ServiceGroup): Cypress.Chainable => {
-    const serviceGroupAlias = alias === null ? name : alias;
-
-    return cy
-      .executeActionViaClapi({
-        bodyContent: {
-          action: 'ADD',
-          object: 'SG',
-          values: `${name};${serviceGroupAlias}`
-        }
-      })
-      .then(() => {
-        hostsAndServices.map((hostAndService) => {
-          return cy.executeActionViaClapi({
-            bodyContent: {
-              action: 'ADDSERVICE',
-              object: 'SG',
-              values: `${name};${hostAndService[0]},${hostAndService[1]}`
-            }
-          });
-        });
-
-        return cy.wrap(null);
-      });
-  }
-);
-
 Cypress.Commands.add(
   'applyPollerConfiguration',
   (pollerName = 'Central'): Cypress.Chainable => {
@@ -498,182 +339,12 @@ Cypress.Commands.add(
   }
 );
 
-interface ACLGroup {
-  alias?: string | null;
-  contactGroups?: Array<string>;
-  contacts?: Array<string>;
-  name: string;
-}
-
-Cypress.Commands.add(
-  'addACLGroup',
-  ({
-    alias = null,
-    contacts = [],
-    contactGroups = [],
-    name
-  }: ACLGroup): Cypress.Chainable => {
-    const ACLGroupALias = alias === null ? name : alias;
-
-    return cy
-      .executeActionViaClapi({
-        bodyContent: {
-          action: 'ADD',
-          object: 'ACLGROUP',
-          values: `${name};${ACLGroupALias}`
-        }
-      })
-      .then(() => {
-        if (contacts) {
-          contacts.forEach((contact) => {
-            cy.executeActionViaClapi({
-              bodyContent: {
-                action: 'ADDCONTACT',
-                object: 'ACLGROUP',
-                values: `${name};${contact}`
-              }
-            });
-          });
-        }
-        if (contactGroups) {
-          contactGroups.forEach((contactGroup) => {
-            cy.executeActionViaClapi({
-              bodyContent: {
-                action: 'ADDCONTACTGROUP',
-                object: 'ACLGROUP',
-                values: `${name};${contactGroup}`
-              }
-            });
-          });
-        }
-      });
-  }
-);
-
-interface ACLMenu {
-  alias?: string | null;
-  includeChildren?: boolean;
-  name: string;
-  readOnly?: boolean;
-  rule?: Array<string>;
-}
-
-Cypress.Commands.add(
-  'addACLMenu',
-  ({
-    name,
-    rule = [],
-    alias = null,
-    includeChildren = true,
-    readOnly = false
-  }: ACLMenu): Cypress.Chainable => {
-    const ACLMenuAlias = alias === null ? name : alias;
-    const action = readOnly ? 'GRANTRO' : 'GRANTRW';
-    const children = includeChildren ? '1' : '0';
-
-    return cy
-      .executeActionViaClapi({
-        bodyContent: {
-          action: 'ADD',
-          object: 'ACLMENU',
-          values: `${name};${ACLMenuAlias}`
-        }
-      })
-      .then(() => {
-        if (rule.length === 0) {
-          return cy.wrap(null);
-        }
-
-        let ruleCommand = '';
-        rule.forEach((rulePage, index) => {
-          ruleCommand += rulePage + (index == rule.length - 1 ? '' : ';');
-        });
-        cy.executeActionViaClapi({
-          bodyContent: {
-            action,
-            object: 'ACLMENU',
-            values: `${name};${children};${ruleCommand}`
-          }
-        });
-
-        return cy.wrap(null);
-      });
-  }
-);
-
-interface ACLAction {
-  actions?: Array<Action>;
-  description: string;
-  name: string;
-}
-
-Cypress.Commands.add(
-  'addACLAction',
-  ({ name, description, actions = [] }: ACLAction): Cypress.Chainable => {
-    return cy
-      .executeActionViaClapi({
-        bodyContent: {
-          action: 'ADD',
-          object: 'ACLACTION',
-          values: `${name};${description}`
-        }
-      })
-      .then(() => {
-        if (actions.length === 0) {
-          return cy.wrap(null);
-        }
-
-        let actionCommand = '';
-        actions.forEach((action, index) => {
-          actionCommand += action + (index == actions.length - 1 ? '' : '|');
-        });
-        cy.executeActionViaClapi({
-          bodyContent: {
-            action: 'GRANT',
-            object: 'ACLACTION',
-            values: `${name};${actionCommand}`
-          }
-        });
-
-        return cy.wrap(null);
-      });
-  }
-);
-
-interface ACLResource {
-  alias?: string | null;
-  name: string;
-}
-
-Cypress.Commands.add(
-  'addACLResource',
-  ({ name, alias = null }: ACLResource): Cypress.Chainable => {
-    const ACLResourcesAlias = alias === null ? name : alias;
-
-    return cy.executeActionViaClapi({
-      bodyContent: {
-        action: 'ADD',
-        object: 'ACLRESOURCE',
-        values: `${name};${ACLResourcesAlias}`
-      }
-    });
-  }
-);
-
 declare global {
   namespace Cypress {
     interface Chainable {
-      addACLAction: (props: ACLAction) => Cypress.Chainable;
-      addACLGroup: (props: ACLGroup) => Cypress.Chainable;
-      addACLMenu: (props: ACLMenu) => Cypress.Chainable;
-      addACLResource: (props: ACLResource) => Cypress.Chainable;
       addCheckCommand: (props: CheckCommand) => Cypress.Chainable;
-      addContact: (props: Contact) => Cypress.Chainable;
-      addContactGroup: (props: ContactGroup) => Cypress.Chainable;
       addHost: (props: Host) => Cypress.Chainable;
-      addHostGroup: (props: HostGroup) => Cypress.Chainable;
       addService: (props: Service) => Cypress.Chainable;
-      addServiceGroup: (props: ServiceGroup) => Cypress.Chainable;
       addServiceTemplate: (props: ServiceTemplate) => Cypress.Chainable;
       addTimePeriod: (props: TimePeriod) => Cypress.Chainable;
       applyPollerConfiguration: (props?: string) => Cypress.Chainable;