Test allow rules for luigi container (#3852)

* Test allowRules for LuigiContainer * Test allowRules for LuigiContainer --------- Co-authored-by: Anna Milewska <[email protected]>
SAP · Aug 12, 2024 · 18f045c · 18f045c
1 parent 90c5c2d
commit 18f045c
Show file tree

Hide file tree

Showing 3 changed files with 58 additions and 2 deletions.
diff --git a/container/cypress/e2e/test-app/iframe/iframe-settings.cy.js b/container/cypress/e2e/test-app/iframe/iframe-settings.cy.js
@@ -1,4 +1,4 @@
-describe('Iframe Container Test', () => {
+describe('Iframe Settings Test', () => {
   let stub;
 
   beforeEach(() => {
@@ -43,11 +43,32 @@ describe('Iframe Container Test', () => {
   it('set sandbox rules by attribute', () => {
     cy.get('#sandbox-rules-test')
       .shadow()
-      .get('iframe')
+      .find('iframe')
       .then(elements => {
         cy.get(elements.last())
           .invoke('attr', 'sandbox')
           .should('eq', 'allow-scripts allow-same-origin');
       });
   });
+
+  describe('Allow Rules Test', () => {
+    it('set allow rules by property', () => {
+      cy.get('#init-button').click();
+      cy.get('#set-allow-rules-button').click();
+      cy.get('#defer-init-test')
+        .find('iframe')
+        .last()
+        .invoke('attr', 'allow')
+        .should('eq', "microphone; camera 'none'; geolocation 'self' https://a.example.com https://b.example.com;");
+    });
+
+    it('set allow rules by attribute', () => {
+      cy.get('#allow-rules-test')
+        .shadow()
+        .find('iframe')
+        .last()
+        .invoke('attr', 'allow')
+        .should('eq', 'fullscreen; microphone;');
+    });
+  });
 });
diff --git a/container/test-app/iframe/iframe-settings.html b/container/test-app/iframe/iframe-settings.html
@@ -11,6 +11,7 @@ <h3>
     </h3>
     <button id="init-button">container.init() defer-init enabled</button>
     <button id="sandbox-rules">Set sandboxRules</button>
+    <button id="set-allow-rules-button">Set allowRules</button>
 
     <!-- Luigi Container to test defer-init flag-->
     <div style="border: solid 1px red; height: 100px">
@@ -31,6 +32,15 @@ <h3>
       ></luigi-container>
     </div>
 
+    <!-- Luigi Container to test allow rules  -->
+    <div style="border: solid 1px red; height: 100px">
+      <luigi-container
+        id="allow-rules-test"
+        viewURL="./microfrontend-allow-rules.html"
+        allow-rules='["fullscreen", "microphone"]'
+      ></luigi-container>
+    </div>
+
     <script type="module">
       import Events from '../bundle.js';
 
@@ -46,6 +56,17 @@ <h3>
       sandboxRulesButton.addEventListener('click', () => {
         deferInitContainer.sandboxRules = ['allow-modals', 'allow-popups'];
       });
+
+      const allowRulesContainer = document.getElementById('allow-rules-test');
+      const setAllowRulesButton = document.getElementById('set-allow-rules-button');
+
+      initButton.addEventListener('click', () => {
+        deferInitContainer.allowRules = [
+          'microphone',
+          "camera 'none'",
+          "geolocation 'self' https://a.example.com https://b.example.com"
+        ];
+      });
     </script>
   </body>
 </html>
diff --git a/container/test-app/iframe/microfrontend-allow-rules.html b/container/test-app/iframe/microfrontend-allow-rules.html
@@ -0,0 +1,14 @@
+<!-- This microfrontend HTML file is used to test allow rules functionality -->
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title></title>
+    <meta charset="utf-8" />
+  </head>
+
+  <body style="border: solid cyan 2px;">
+    <div>
+      <h1>allow rules test for iframes</h1>
+    </div>
+  </body>
+</html>