Resolves conflicts

client-frameworks-support/testing-utilities/test/index.html

@@ -79,13 +79,15 @@ <h3 class="fd-title fd-title--h3">
     'uxbutton4'
   ];
 
-  //Attach post message hook from MockModule
+  // Attach post message hook from MockModule
   initPostMessageMthd();
+
   const callMockModule = () => {
     let msgType = event.target.getAttribute('data-arg1');
     let LuigiClient = window.LuigiClient;
+
     switch (msgType) {
-      //Client Linkmanager features
+      // Client Linkmanager features
       case 'modal':
         LuigiClient.linkManager().openAsModal('projects/pr1/users', {
           title: 'Users',
@@ -113,7 +115,7 @@ <h3 class="fd-title fd-title--h3">
         LuigiClient.linkManager().pathExists('/');
         break;
 
-      //Client UX Manager features
+      // Client UX Manager features
       case 'alert':
         const settings = {
           text: 'This is just a test alert for external micro frontend.',
@@ -149,7 +151,7 @@ <h3 class="fd-title fd-title--h3">
     }
   };
 
-  //Attach event listeners to Buttons
+  // Attach event listeners to Buttons
   buttonArray.forEach(btn => {
     document.getElementById(btn).addEventListener('click', callMockModule);
   });

client-frameworks-support/testing-utilities/test/package.json

@@ -9,8 +9,9 @@
     "start": "live-server --port=8181 --entry-file=index.html  --mount=./node_modules:/node_modules"
   },
   "dependencies": {
-    "@luigi-project/client": "^2.14.1",
-    "@luigi-project/testing-utilities": "^2.14.1",
+    "@luigi-project/client": "^2.18.0",
+    "@luigi-project/testing-utilities": "^2.18.0",
+    "cross-spawn": "^7.0.6",
     "cypress": "^12.17.4",
     "fundamental-styles": "^0.26.5"
   }

code_quality.js

@@ -1,5 +1,5 @@
 const gitChangedFiles = require('git-changed-files');
-const prettier = require('@prettier/sync');
+const prettier = require('prettier');
 const prettierConfig = require('./prettier_config.json');
 const codeQualityConfig = require('./package.json').codeQuality || {};
 const path = require('path');
@@ -107,16 +107,23 @@ const groupFilesByExtension = (files) => {
  * @param file: absolute class path
  * @param config: configuration that will be used to prettier the file.
  */
-const prettifyFile = (file, config) => {
+const prettifyFile = async (file, config) => {
   try {
-    const text = fs.readFileSync(file).toString();
-    if (prettier.check(text, config) || config?.excludedFiles?.includes(file)) {
+    if (config?.excludedFiles?.includes(file)) {
       return;
     }
 
-    console.log('Running prettier on the file: ' + file);
-    fs.writeFileSync(file, prettier.format(text, config));
-    return true;
+    const fileContent = fs.readFileSync(file).toString();
+    const isFormatted = await prettier.check(fileContent, config);
+
+    if (!isFormatted) {
+      console.log('Running prettier on the file: ' + file);
+      const format = await prettier.format(fileContent, config);
+      fs.writeFileSync(file, format);
+      return true;
+    }
+
+    return false;
   } catch (error) {
     console.log('Error in running prettier the file ' + file + ': \n' + error);
   }
@@ -140,8 +147,9 @@ const prettifyFiles = (filesByExtension) => {
       );
       return;
     }
-    files.forEach((file) => {
-      if (prettifyFile(file, config)) {
+    files.forEach(async (file) => {
+      const action = await prettifyFile(file, config);
+      if (action) {
         filesChanged++;
       }
     });

container/cypress/e2e/test-app/compound/wc-compound-container.cy.js

@@ -164,17 +164,35 @@ describe('Compound Container Tests', () => {
         });
     });
 
-    it('LuigiClient API - pathExists', () => {
+    it('LuigiClient API - pathExists, goBack, updateTopNavigation', () => {
       cy.on('window:alert', stub);
 
+      const alertMessages = [
+        'UPDATE_TOP_NAVIGATION_REQUEST event received',
+        'some goBackValue',
+        'LuigiClient.linkManager().pathExists()=true\nthis.LuigiClient.linkManager().hasBack()=false',
+      ];
+
       cy.get(containerSelector)
         .shadow()
         .get('#linkManagerUpdateTopPathExistsBack')
         .click()
         .then(() => {
-          expect(stub.getCall(0)).to.be.calledWith(
-            'LuigiClient.linkManager().pathExists()=true\nthis.LuigiClient.linkManager().hasBack()=false'
-          );
+          alertMessages.forEach((msg, index) => {
+            expect(stub.getCall(index)).to.be.calledWith(msg);
+          });
+        });
+    });
+
+    it('LuigiClient API - showAlert', () => {
+      cy.on('window:alert', stub);
+
+      cy.get(containerSelector)
+        .shadow()
+        .get('#showAlert')
+        .click()
+        .then(() => {
+          expect(stub.getCall(0)).to.be.calledWith("uxManager().showAlert() test");
         });
     });
 

container/cypress/e2e/test-app/iframe/iframe-container.cy.js

@@ -34,6 +34,47 @@ describe('Iframe Container Test', () => {
       });
   });
 
+  it('showAlert', () => {
+    cy.on('window:alert', stub);
+
+    cy.get(containerSelector)
+      .shadow()
+      .get('iframe')
+      .then(iframe => {
+        const $body = iframe.contents().find('body');
+        cy.wrap($body)
+          .contains('test showAlert')
+          .click()
+          .then(() => {
+            cy.wrap(stub).should(
+              'have.been.calledWith',
+              'show-alert-request message received: {\"isTrusted\":true}'
+            );
+          });
+      });
+  });
+
+  it('goBack', () => {
+    cy.on('window:alert', stub);
+
+    cy.get(containerSelector)
+      .shadow()
+      .get('iframe')
+      .then(iframe => {
+        const $body = iframe.contents().find('body');
+        cy.wrap($body)
+          .contains('test goBack')
+          .click()
+          .then(() => {
+            console.log(cy.wrap(stub));
+            cy.wrap(stub).should(
+              'have.been.calledWith',
+              'navigate-back-request'
+            );
+          });
+      });
+  });
+
   it('sendCustomMessage', () => {
     cy.get('#btn-1').click();
     cy.get(containerSelector)

container/cypress/e2e/test-app/wc/wc-container.cy.js

@@ -189,17 +189,35 @@ describe('Web Container Test', () => {
         });
     });
 
-    it('pathExists', () => {
+    it('pathExists, goBack, updateTopNavigation', () => {
       cy.on('window:alert', stub);
 
+      const alertMessages = [
+        'UPDATE_TOP_NAVIGATION_REQUEST event received',
+        'some goBackValue',
+        'LuigiClient.linkManager().pathExists()=true\nthis.LuigiClient.linkManager().hasBack()=false',
+      ];
+
       cy.get(containerSelector)
         .shadow()
         .get('#linkManagerUpdateTopPathExistsBack')
         .click()
         .then(() => {
-          expect(stub.getCall(0)).to.be.calledWith(
-            'LuigiClient.linkManager().pathExists()=true\nthis.LuigiClient.linkManager().hasBack()=false'
-          );
+          alertMessages.forEach((msg, index) => {
+            expect(stub.getCall(index)).to.be.calledWith(msg);
+          });
+        });
+    });
+
+    it('showAlert', () => {
+      cy.on('window:alert', stub);
+
+      cy.get(containerSelector)
+        .shadow()
+        .get('#showAlert')
+        .click()
+        .then(() => {
+          expect(stub.getCall(0)).to.be.calledWith("uxManager().showAlert() test");
         });
     });
 

container/package.json

@@ -46,6 +46,7 @@
     "@types/jest": "^29.5.12",
     "@typescript-eslint/eslint-plugin": "^8.13.0",
     "@typescript-eslint/parser": "^8.13.0",
+    "@typescript-eslint/typescript-estree": "^8.13.0",
     "chokidar-cli": "^3.0.0",
     "cli-color": "^2.0.4",
     "concurrently": "^7.6.0",
@@ -65,7 +66,6 @@
     "svelte-preprocess": "5.0.4",
     "tslib": "2.6.1",
     "typescript": "5.1.6",
-    "@typescript-eslint/typescript-estree": "^8.13.0",
     "typescript-eslint": "^8.13.0"
   },
   "engines": {

container/src/LuigiCompoundContainer.svelte

@@ -62,11 +62,13 @@
 
 <script lang="ts">
   import { onMount } from 'svelte';
+  import { Events } from './constants/communication';
+  import type { ContainerElement } from './constants/container.model';
   import { ContainerService } from './services/container.service';
   import { WebComponentService } from './services/webcomponents.service';
-  import { Events } from './constants/communication';
   import { GenericHelperFunctions } from './utilities/helpers';
 
+  /* eslint-disable */
   export let activeFeatureToggleList: string[];
   export let anchor: string;
   export let clientPermissions: any;
@@ -86,10 +88,11 @@
   export let userSettings: any;
   export let viewurl: string;
   export let webcomponent: any;
+  /* eslint-enable */
 
   let containerInitialized = false;
-  let mainComponent: HTMLElement;
-  let eventBusElement: HTMLElement;
+  let mainComponent: ContainerElement;
+  let eventBusElement: ContainerElement;
 
   const containerService = new ContainerService();
   const webcomponentService = new WebComponentService();
@@ -114,11 +117,12 @@
     );
   };
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const initialize = (thisComponent: any) => {
     if (!compoundConfig || containerInitialized) {
       return;
     }
-    thisComponent.updateContext = (contextObj: any, internal?: any) => {
+    thisComponent.updateContext = (contextObj: object, internal?: object) => {
       const rootElement = thisComponent.getNoShadow() ? thisComponent : mainComponent;
       rootElement._luigi_mfe_webcomponent.context = contextObj;
 
@@ -149,14 +153,14 @@
     }
     webcomponentService
       .renderWebComponentCompound(node, thisComponent.getNoShadow() ? thisComponent : mainComponent, ctx)
-      .then((compCnt) => {
-        eventBusElement = compCnt as HTMLElement;
+      .then((compCnt: ContainerElement) => {
+        eventBusElement = compCnt;
         if (skipInitCheck || !node.viewUrl) {
           thisComponent.initialized = true;
           setTimeout(() => {
             webcomponentService.dispatchLuigiEvent(Events.INITIALIZED, {});
           });
-        } else if ((eventBusElement as any).LuigiClient && !(eventBusElement as any).deferLuigiClientWCInit) {
+        } else if (eventBusElement.LuigiClient && !eventBusElement.deferLuigiClientWCInit) {
           thisComponent.initialized = true;
           webcomponentService.dispatchLuigiEvent(Events.INITIALIZED, {});
         }
@@ -166,6 +170,7 @@
   };
 
   onMount(async () => {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     const thisComponent: any =
       mainComponent.getRootNode() === document
         ? mainComponent.parentNode

container/src/LuigiContainer.svelte

@@ -58,13 +58,15 @@
 
 <script lang="ts">
   import { onMount, onDestroy } from 'svelte';
-  import { containerService } from './services/container.service';
-  import { WebComponentService } from './services/webcomponents.service';
   import { ContainerAPI } from './api/container-api';
   import { Events } from './constants/communication';
-  import { GenericHelperFunctions } from './utilities/helpers';
+  import type { IframeHandle, ContainerElement } from './constants/container.model';
+  import { containerService } from './services/container.service';
   import { getAllowRules } from './services/iframe-helpers';
+  import { WebComponentService } from './services/webcomponents.service';
+  import { GenericHelperFunctions } from './utilities/helpers';
 
+  /* eslint-disable */
   export let activeFeatureToggleList: string[];
   export let allowRules: string[];
   export let anchor: string;
@@ -88,9 +90,10 @@
   export let userSettings: any;
   export let viewurl: string;
   export let webcomponent: any;
+  /* eslint-enable */
 
-  const iframeHandle: { iframe: HTMLIFrameElement } | any = {};
-  let mainComponent: HTMLElement;
+  const iframeHandle: IframeHandle = {};
+  let mainComponent: ContainerElement;
   let containerInitialized = false;
 
   const webcomponentService = new WebComponentService();
@@ -119,9 +122,10 @@
     );
   };
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const initialize = (thisComponent: any) => {
     if (!containerInitialized) {
-      thisComponent.sendCustomMessage = (id: string, data?: any) => {
+      thisComponent.sendCustomMessage = (id: string, data?: object) => {
         ContainerAPI.sendCustomMessage(
           id,
           thisComponent.getNoShadow() ? thisComponent : mainComponent,
@@ -131,15 +135,15 @@
         );
       };
 
-      thisComponent.updateContext = (contextObj: any, internal?: any) => {
+      thisComponent.updateContext = (contextObj: object, internal?: object) => {
         if (webcomponent) {
           (thisComponent.getNoShadow() ? thisComponent : mainComponent)._luigi_mfe_webcomponent.context = contextObj;
         } else {
           ContainerAPI.updateContext(contextObj, internal, iframeHandle);
         }
       };
 
-      thisComponent.closeAlert = (id: any, dismissKey: any) => {
+      thisComponent.closeAlert = (id: string, dismissKey: string) => {
         ContainerAPI.closeAlert(id, dismissKey, iframeHandle);
       };
 
@@ -179,8 +183,7 @@
       } else if (webcomponent) {
         (thisComponent.getNoShadow() ? thisComponent : mainComponent).addEventListener('wc_ready', () => {
           if (
-            !(thisComponent.getNoShadow() ? thisComponent : (mainComponent as any))._luigi_mfe_webcomponent
-              ?.deferLuigiClientWCInit
+            !(thisComponent.getNoShadow() ? thisComponent : mainComponent)._luigi_mfe_webcomponent?.deferLuigiClientWCInit
           ) {
             thisComponent.initialized = true;
             webcomponentService.dispatchLuigiEvent(Events.INITIALIZED, {});
@@ -193,6 +196,7 @@
   };
 
   onMount(async () => {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     const thisComponent: any = mainComponent.parentNode;
     thisComponent.iframeHandle = iframeHandle;
     thisComponent.init = () => {