Restructure container tests (#3699)

.github/workflows/test.yml

@@ -8,6 +8,7 @@ on:
 name: Build & Test
 env:
   CYPRESS_CACHE_FOLDER: ~/cypress-binary-cache
+  CYPRESS_DASHBOARD_RECORD_KEY:  ${{ secrets.CYPRESS_DASHBOARD }}
 
 jobs:
   prepare: 
@@ -76,6 +77,9 @@ jobs:
     name: Container E2E Tests
     runs-on: ubuntu-latest
     needs: prepare
+
+    env:
+      USE_CYPRESS_DASHBOARD: false # enable when trying to debug
     steps:
       - uses: actions/checkout@v4
       - uses: actions/setup-node@v4
@@ -95,6 +99,9 @@ jobs:
     name: Integration Tests
     needs: prepare
     runs-on: ubuntu-latest
+
+    env:
+      USE_CYPRESS_DASHBOARD: false  # enable when trying to debug
     steps:
       - uses: actions/setup-node@v4
         with:

client/luigi-client.d.ts

@@ -419,7 +419,7 @@ export declare interface LinkManager {
    * @param {string} modalSettings.height lets you specify a precise height for the modal. Allowed units are 'px', '%', 'rem', 'em', 'vh' and 'vw'.
    * @param {boolean} modalSettings.keepPrevious Lets you open multiple modals. Keeps the previously opened modal and allows to open another modal on top of the previous one. By default the previous modals are discarded.
    * @param {string} modalSettings.closebtn_data_testid lets you specify a `data_testid` for the close button. Default value is `lui-modal-index-0`. If multiple modals are opened the index will be increased per modal.
-   * @returns {promise} which is resolved when closing the modal. By using LuigiClient.linkManager().goBack({ foo: 'bar' }) to close the modal you have access the `goBackContext` when the promise will be resolved.
+   * @returns {promise} which is resolved when closing the modal. By using LuigiClient.linkManager().goBack({ foo: 'bar' }) to close the modal you have access to the `goBackContext` when the promise will be resolved.
    * @example
    * LuigiClient.linkManager().openAsModal('projects/pr1/users', {title:'Users', size:'m'}).then((res) => {
    *     // Logic to execute when the modal will be closed

client/src/linkManager.js

@@ -165,7 +165,7 @@ export class linkManager extends LuigiClientBase {
    * @param {string} modalSettings.height lets you specify a precise height for the modal. Allowed units are 'px', '%', 'rem', 'em', 'vh' and 'vw'.
    * @param {boolean} modalSettings.keepPrevious Lets you open multiple modals. Keeps the previously opened modal and allows to open another modal on top of the previous one. By default the previous modals are discarded.
    * @param {string} modalSettings.closebtn_data_testid lets you specify a `data_testid` for the close button. Default value is `lui-modal-index-0`. If multiple modals are opened the index will be increased per modal.
-   * @returns {promise} which is resolved when closing the modal. By using LuigiClient.linkManager().goBack({ foo: 'bar' }) to close the modal you have access the `goBackContext` when the promise will be resolved.
+   * @returns {promise} which is resolved when closing the modal. By using LuigiClient.linkManager().goBack({ foo: 'bar' }) to close the modal you have access to the `goBackContext` when the promise will be resolved.
    * @example
    * LuigiClient.linkManager().openAsModal('projects/pr1/users', {title:'Users', size:'m'}).then((res) => {
    *     // Logic to execute when the modal will be closed

container/.gitignore

@@ -1,14 +1,14 @@
 /node_modules/
 
 /examples/bundle.js
+/examples/bundle.js.map
 /public/bundle.js
 /public/bundle.js.map
 /public/bundle.d.ts
 /public/bundle.d.ts.map
 /test-app/bundle.js
 /test-app/bundle.js.map
-/test-app/luigi-element.js
-
+/test-app/compound/luigi-element.js
 /public/**/*.ts
 
 /coverage

container/cypress.config.js

@@ -7,7 +7,6 @@ module.exports = defineConfig({
     viewportWidth: 1250,
     viewportHeight: 790,
     chromeWebSecurity: false,
-    baseUrl: 'http://localhost:8080/',
     supportFile: false
   }
 });

container/cypress/e2e/examples/README.md

@@ -0,0 +1,3 @@
+### Test Suite: `/examples`
+
+This test suite is used to add tests for our **/container/examples** application, to make sure that our provided simple examples are working and up to date.

container/cypress/e2e/examples/simple-compound-wc-setup.cy.js

@@ -0,0 +1,17 @@
+describe('Simple Examples Compound Container Test', () => {
+  beforeEach(() => {
+    cy.visit('http://localhost:2222');
+  });
+
+  it('Compound WebComponent Container loading inner text', () => {
+    cy.visit('http://localhost:2222/compound-container/index.html');
+
+    cy.get('luigi-compound-container')
+      .shadow()
+      .find('h2')
+      .should(
+        'contain.text',
+        ' Hello From Web Component 1  -- some content -- Hello From Web Component 2  Hello From Web Component 3  Hello From Web Component 4 '
+      );
+  });
+});

container/cypress/e2e/examples/simple-iframe-setup.cy.js

@@ -0,0 +1,17 @@
+describe('Simple Examples Iframe Container Test', () => {
+  beforeEach(() => {
+    cy.visit('http://localhost:2222');
+  });
+
+  it('Iframe Container Test', () => {
+    cy.visit('http://localhost:2222/container-iframe/index.html');
+
+    cy.get('luigi-container')
+      .shadow()
+      .get('iframe')
+      .then(iframe => {
+        const $body = iframe.contents().find('body');
+        cy.wrap($body).contains('This is an iframe based microfrontend container');
+      });
+  });
+});