From 556a0d5d843ae1de4750652debffee46f884d95c Mon Sep 17 00:00:00 2001
From: Jens Langhammer <jens.langhammer@beryju.org>
Date: Sun, 21 Mar 2021 17:55:09 +0100
Subject: [PATCH] web: wrap hidden inputs in form to prevent warning

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
---
 web/src/authentik.css                                     | 8 +++-----
 .../flows/stages/identification/IdentificationStage.ts    | 8 +++++---
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/web/src/authentik.css b/web/src/authentik.css
index 68d48904f..c51fae559 100644
--- a/web/src/authentik.css
+++ b/web/src/authentik.css
@@ -5,7 +5,7 @@ html {
     --pf-c-nav__link--PaddingLeft: 0.5rem;
 }
 
-html > input {
+html > form > input {
     position: absolute;
     top: -2000px;
     left: -2000px;
@@ -21,6 +21,7 @@ html > input {
 /* Ensure card is displayed on small screens */
 .pf-c-login__main {
     display: block;
+    position: relative;
 }
 .ak-login-container {
     height: calc(100vh - var(--pf-global--spacer--lg) - var(--pf-global--spacer--lg));
@@ -32,11 +33,8 @@ html > input {
 .pf-c-login__header {
     flex-grow: 1;
 }
-.pf-c-login__main {
-    flex-shrink: 1;
-}
 .pf-c-login__footer {
-    flex-grow: 1;
+    flex-grow: 2;
 }
 .pf-c-login__footer ul.pf-c-list.pf-m-inline {
     justify-content: center;
diff --git a/web/src/flows/stages/identification/IdentificationStage.ts b/web/src/flows/stages/identification/IdentificationStage.ts
index a7425230e..816d53beb 100644
--- a/web/src/flows/stages/identification/IdentificationStage.ts
+++ b/web/src/flows/stages/identification/IdentificationStage.ts
@@ -61,6 +61,8 @@ export class IdentificationStage extends BaseStage {
     }
 
     firstUpdated(): void {
+        const wrapperForm = document.createElement("form");
+        document.documentElement.appendChild(wrapperForm);
         // This is a workaround for the fact that we're in a shadow dom
         // adapted from https://github.com/home-assistant/frontend/issues/3133
         const username = document.createElement("input");
@@ -76,7 +78,7 @@ export class IdentificationStage extends BaseStage {
                 input.focus();
             });
         };
-        document.documentElement.appendChild(username);
+        wrapperForm.appendChild(username);
         const password = document.createElement("input");
         password.setAttribute("type", "password");
         password.setAttribute("name", "password");
@@ -98,7 +100,7 @@ export class IdentificationStage extends BaseStage {
                 input.focus();
             });
         };
-        document.documentElement.appendChild(password);
+        wrapperForm.appendChild(password);
         const totp = document.createElement("input");
         totp.setAttribute("type", "text");
         totp.setAttribute("name", "code");
@@ -120,7 +122,7 @@ export class IdentificationStage extends BaseStage {
                 input.focus();
             });
         };
-        document.documentElement.appendChild(totp);
+        wrapperForm.appendChild(totp);
     }
 
     renderSource(source: UILoginButton): TemplateResult {