[PM-3577] Refactor Electron iframes (#6221)

apps/browser/src/auth/popup/login.component.html

@@ -44,7 +44,11 @@
           </div>
         </div>
         <div class="box-content-row" [hidden]="!showCaptcha()">
-          <iframe id="hcaptcha_iframe" height="80"></iframe>
+          <iframe
+            id="hcaptcha_iframe"
+            height="80"
+            sandbox="allow-scripts allow-same-origin"
+          ></iframe>
         </div>
       </div>
       <div class="box-footer">

apps/browser/src/auth/popup/register.component.html

@@ -120,7 +120,9 @@
         </div>
       </div>
     </div>
-    <div [hidden]="!showCaptcha()"><iframe id="hcaptcha_iframe" height="80"></iframe></div>
+    <div [hidden]="!showCaptcha()">
+      <iframe id="hcaptcha_iframe" height="80" sandbox="allow-scripts allow-same-origin"></iframe>
+    </div>
     <div class="box last" *ngIf="showTerms">
       <div class="box-content">
         <div

apps/browser/src/auth/popup/two-factor.component.html

@@ -87,7 +87,7 @@
     </ng-container>
     <ng-container *ngIf="selectedProviderType === providerType.WebAuthn && !webAuthnNewTab">
       <div id="web-authn-frame">
-        <iframe id="webauthn_iframe"></iframe>
+        <iframe id="webauthn_iframe" sandbox="allow-scripts allow-same-origin"></iframe>
       </div>
       <div class="box">
         <div class="box-content">
@@ -112,7 +112,9 @@
         selectedProviderType === providerType.OrganizationDuo
       "
     >
-      <div id="duo-frame"><iframe id="duo_iframe"></iframe></div>
+      <div id="duo-frame">
+        <iframe id="duo_iframe" sandbox="allow-scripts allow-forms allow-same-origin"></iframe>
+      </div>
       <div class="box">
         <div class="box-content">
           <div class="box-content-row box-content-row-checkbox" appBoxRow>
@@ -123,7 +125,7 @@
       </div>
     </ng-container>
     <div class="box-content-row" [hidden]="!showCaptcha()">
-      <iframe id="hcaptcha_iframe" height="80"></iframe>
+      <iframe id="hcaptcha_iframe" height="80" sandbox="allow-scripts allow-same-origin"></iframe>
     </div>
     <div class="content" *ngIf="selectedProviderType == null">
       <p class="text-center">{{ "noTwoStepProviders" | i18n }}</p>

apps/desktop/src/auth/login/login.component.html

@@ -89,7 +89,11 @@
         </div>
         <div class="box last" [hidden]="!showCaptcha()">
           <div class="box-content">
-            <iframe id="hcaptcha_iframe" style="margin-top: 20px"></iframe>
+            <iframe
+              id="hcaptcha_iframe"
+              style="margin-top: 20px"
+              sandbox="allow-scripts allow-same-origin"
+            ></iframe>
             <div class="box-content-row">
               <button
                 class="btn block"

apps/desktop/src/auth/register.component.html

@@ -100,7 +100,11 @@
         <div class="box last" [hidden]="!showCaptcha()">
           <div class="box-content">
             <div class="box-content-row">
-              <iframe id="hcaptcha_iframe" height="80"></iframe>
+              <iframe
+                id="hcaptcha_iframe"
+                height="80"
+                sandbox="allow-scripts allow-same-origin"
+              ></iframe>
               <button class="btn block" type="button" routerLink="/accessibility-cookie">
                 <i class="bwi bwi-universal-access" aria-hidden="true"></i>
                 {{ "loadAccessibilityCookie" | i18n }}

apps/desktop/src/auth/two-factor.component.html

@@ -65,7 +65,7 @@
     </ng-container>
     <ng-container *ngIf="selectedProviderType === providerType.WebAuthn">
       <div id="web-authn-frame">
-        <iframe id="webauthn_iframe"></iframe>
+        <iframe id="webauthn_iframe" sandbox="allow-scripts allow-same-origin"></iframe>
       </div>
       <div class="box first">
         <div class="box-content">
@@ -82,7 +82,9 @@
         selectedProviderType === providerType.OrganizationDuo
       "
     >
-      <div id="duo-frame"><iframe id="duo_iframe"></iframe></div>
+      <div id="duo-frame">
+        <iframe id="duo_iframe" sandbox="allow-scripts allow-forms allow-same-origin"></iframe>
+      </div>
       <div class="box last">
         <div class="box-content">
           <div class="box-content-row box-content-row-checkbox" appBoxRow>
@@ -103,7 +105,11 @@
     <div class="box last" [hidden]="!showCaptcha()">
       <div class="box-content">
         <div class="box-content-row">
-          <iframe id="hcaptcha_iframe" height="80"></iframe>
+          <iframe
+            id="hcaptcha_iframe"
+            height="80"
+            sandbox="allow-scripts allow-same-origin"
+          ></iframe>
           <button class="btn block" type="button" routerLink="/accessibility-cookie">
             <i class="bwi bwi-universal-access" aria-hidden="true"></i>
             {{ "loadAccessibilityCookie" | i18n }}

apps/web/src/app/auth/login/login.component.html

@@ -83,7 +83,11 @@
           </div>
 
           <div [hidden]="!showCaptcha()">
-            <iframe id="hcaptcha_iframe" height="80"></iframe>
+            <iframe
+              id="hcaptcha_iframe"
+              height="80"
+              sandbox="allow-scripts allow-same-origin"
+            ></iframe>
           </div>
 
           <div class="tw-mb-3 tw-flex tw-space-x-4">

apps/web/src/app/auth/register-form/register-form.component.html

@@ -89,7 +89,7 @@
     </div>
 
     <div [hidden]="!showCaptcha()">
-      <iframe id="hcaptcha_iframe" height="80"></iframe>
+      <iframe id="hcaptcha_iframe" height="80" sandbox="allow-scripts allow-same-origin"></iframe>
     </div>
     <div class="tw-mb-4 tw-flex tw-items-start">
       <input

apps/web/src/app/auth/two-factor.component.html

@@ -80,7 +80,7 @@
           </ng-container>
           <ng-container *ngIf="selectedProviderType === providerType.WebAuthn">
             <div id="web-authn-frame" class="mb-3">
-              <iframe id="webauthn_iframe"></iframe>
+              <iframe id="webauthn_iframe" sandbox="allow-scripts allow-same-origin"></iframe>
             </div>
           </ng-container>
           <ng-container
@@ -90,7 +90,10 @@
             "
           >
             <div id="duo-frame" class="mb-3">
-              <iframe id="duo_iframe"></iframe>
+              <iframe
+                id="duo_iframe"
+                sandbox="allow-scripts allow-forms allow-same-origin"
+              ></iframe>
             </div>
           </ng-container>
           <i
@@ -115,7 +118,11 @@
           </ng-container>
           <hr />
           <div [hidden]="!showCaptcha()">
-            <iframe id="hcaptcha_iframe" height="80"></iframe>
+            <iframe
+              id="hcaptcha_iframe"
+              height="80"
+              sandbox="allow-scripts allow-same-origin"
+            ></iframe>
           </div>
           <div class="d-flex mb-3">
             <button