@centreon/js-config 24.4.21 → 24.4.22

package/cypress/component/commands.tsx

@@ -18,6 +18,15 @@ interface MountProps {
   Component: React.ReactNode;
   options?: object;
 }
+interface Resolution {
+  height: number;
+  width: number;
+}
+
+interface MakeSnapshotWithCustomResolution {
+  resolution: Resolution;
+  title: string;
+}
 
 export enum Method {
   DELETE = 'DELETE',
@@ -97,20 +106,32 @@ Cypress.Commands.add(
   }
 );
 
-Cypress.Commands.add('moveSortableElement', ({ element, direction }): void => {
-  const key = `{${direction}arrow}`;
+interface MoveSortableElementProps {
+  direction: 'up' | 'down' | 'left' | 'right';
+  element: Cypress.Chainable<JQuery<HTMLElement>>;
+  times?: number;
+}
 
-  element.type(' ', {
-    force: true,
-    scrollBehavior: false
-  });
-  element.eq(-1).type(key, {
-    scrollBehavior: false
-  });
-  element.eq(-1).type(' ', {
-    scrollBehavior: false
-  });
-});
+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
+    });
+  }
+);
 
 Cypress.Commands.add(
   'moveSortableElementUsingAriaLabel',
@@ -137,6 +158,15 @@ Cypress.Commands.add('makeSnapshot', (title?: string) => {
   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);
@@ -148,13 +178,22 @@ declare global {
     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 }) => void;
+      moveSortableElement: ({
+        element,
+        direction,
+        times
+      }: MoveSortableElementProps) => void;
       moveSortableElementUsingAriaLabel: ({ ariaLabel, direction }) => void;
       waitForRequest: (alias) => Cypress.Chainable;
     }

package/cypress/component/configuration.js

@@ -3,6 +3,7 @@ const { defineConfig } = require('cypress');
 const {
   addMatchImageSnapshotPlugin
 } = require('@simonsmith/cypress-image-snapshot/plugin');
+const cypressCodeCoverageTask = require('@cypress/code-coverage/task');
 
 module.exports = ({
   webpackConfig,
@@ -25,9 +26,12 @@ module.exports = ({
       setupNodeEvents: (on, config) => {
         addMatchImageSnapshotPlugin(on, config);
 
+        cypressCodeCoverageTask(on, config);
+
         on('before:browser:launch', (browser, launchOptions) => {
           if (browser.name === 'chrome' && browser.isHeadless) {
             launchOptions.args.push('--headless=new');
+            launchOptions.args.push('--force-color-profile=srgb');
           }
 
           return launchOptions;
@@ -37,8 +41,17 @@ module.exports = ({
       supportFile: `${mainCypressFolder}/support/component.tsx`
     },
     env: {
-      ...env,
-      baseUrl: 'http://localhost:9092'
+      baseUrl: 'http://localhost:9092',
+      codeCoverage: {
+        exclude: [
+          'cypress/**/*.*',
+          'packages/**',
+          'node_modules',
+          '**/*.js',
+          '**/*.spec.tsx'
+        ]
+      },
+      ...env
     },
     reporter: 'mochawesome',
     reporterOptions: {

package/cypress/component/excludeNodeModulesFromCoverage.js

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