UI/Init: Add autocomplete="off" for password fields (#6149)

ILIAS-eLearning · Aug 18, 2023 · d47d3d6 · d47d3d6
1 parent 335e461
commit d47d3d6
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 16 deletions.
diff --git a/Services/Init/classes/class.ilStartUpGUI.php b/Services/Init/classes/class.ilStartUpGUI.php
@@ -529,7 +529,7 @@ protected function initStandardLoginForm(): ilPropertyFormGUI
         $pi->setRetype(false);
         $pi->setSkipSyntaxCheck(true);
         $pi->setSize(20);
-        $pi->setDisableHtmlAutoComplete(false);
+        $pi->setDisableHtmlAutoComplete(true);
         $pi->setRequired(true);
         $form->addItem($pi);
 

diff --git a/src/UI/Component/Input/Field/Factory.php b/src/UI/Component/Input/Field/Factory.php
@@ -320,6 +320,12 @@ public function tag(string $label, array $tags, ?string $byline = null): Tag;
      * rules:
      *   usage:
      *     1: Password Input MUST be used for passwords.
+     *   composition:
+     *     1: >
+     *        The input MUST always be rendered with the attribute autocomplete="off".
+     *        This advises browsers to NOT autofill the input field with cached passwords
+     *        and avoids potential exposure of confidential data, especially in
+     *        shared environments.
      *   interaction:
      *     1: >
      *         Password Input SHOULD NOT limit the number of characters.

diff --git a/src/UI/templates/default/Input/tpl.password.html b/src/UI/templates/default/Input/tpl.password.html
@@ -1,5 +1,5 @@
 <div class="il-input-password" id="{ID_CONTAINER}">
-	<input id="{ID}" type="password" name="{NAME}"<!-- BEGIN value --> value="{VALUE}"<!-- END value --><!-- BEGIN disabled --> {DISABLED}<!-- END disabled --> class="form-control form-control-sm" />
+	<input id="{ID}" type="password" name="{NAME}"<!-- BEGIN value --> value="{VALUE}"<!-- END value --><!-- BEGIN disabled --> {DISABLED}<!-- END disabled --> class="form-control form-control-sm" autocomplete="off" />
 	<!-- BEGIN revelation -->
 	<span class="revelation-glyph revelation-reveal">
 		{PASSWORD_REVEAL}

diff --git a/tests/UI/Component/Input/Field/PasswordInputTest.php b/tests/UI/Component/Input/Field/PasswordInputTest.php
@@ -1,7 +1,5 @@
 <?php
 
-declare(strict_types=1);
-
 /**
  * This file is part of ILIAS, a powerful learning management system
  * published by ILIAS open source e-Learning e.V.
@@ -17,6 +15,7 @@
  * https://github.com/ILIAS-eLearning
  *
  *********************************************************************/
+declare(strict_types=1);
 
 require_once(__DIR__ . "/../../../../../libs/composer/vendor/autoload.php");
 require_once(__DIR__ . "/../../../Base.php");
@@ -90,12 +89,12 @@ public function test_render(): void
         $r = $this->getDefaultRenderer();
         $expected = '
             <div class="form-group row">
-                <label for="id_1" class="control-label col-sm-4 col-md-3 col-lg-2">'.$label.'</label>
+                <label for="id_1" class="control-label col-sm-4 col-md-3 col-lg-2">' . $label . '</label>
                 <div class="col-sm-8 col-md-9 col-lg-10">
                     <div class="il-input-password" id="id_1_container">
-                        <input id="id_1" type="password" name="'.$name.'" class="form-control form-control-sm" />
+                        <input id="id_1" type="password" name="' . $name . '" class="form-control form-control-sm" autocomplete="off" />
                     </div>
-                    <div class="help-block">'.$byline.'</div>
+                    <div class="help-block">' . $byline . '</div>
                 </div>
             </div>';
         $this->assertHTMLEquals($expected, $r->render($pwd));
@@ -116,7 +115,7 @@ public function test_render_error(): void
    <label for="id_1" class="control-label col-sm-4 col-md-3 col-lg-2">label</label>
    <div class="col-sm-8 col-md-9 col-lg-10">
       <div class="help-block alert alert-danger" aria-describedby="id_1" role="alert">an_error</div>
-      <div class="il-input-password" id="id_1_container"><input id="id_1" type="password" name="name_0" class="form-control form-control-sm" /></div>
+      <div class="il-input-password" id="id_1_container"><input id="id_1" type="password" name="name_0" class="form-control form-control-sm" autocomplete="off" /></div>
       <div class="help-block">byline</div>
    </div>
 </div>');
@@ -134,10 +133,10 @@ public function test_render_no_byline(): void
         $r = $this->getDefaultRenderer();
         $expected = '
             <div class="form-group row">
-                <label for="id_1" class="control-label col-sm-4 col-md-3 col-lg-2">'.$label.'</label>
+                <label for="id_1" class="control-label col-sm-4 col-md-3 col-lg-2">' . $label . '</label>
                 <div class="col-sm-8 col-md-9 col-lg-10">
                     <div class="il-input-password" id="id_1_container">
-                        <input id="id_1" type="password" name="'.$name.'" class="form-control form-control-sm" />
+                        <input id="id_1" type="password" name="' . $name . '" class="form-control form-control-sm" autocomplete="off" />
                     </div>
                 </div>
             </div>';
@@ -155,10 +154,10 @@ public function test_render_value(): void
         $r = $this->getDefaultRenderer();
         $expected = '
             <div class="form-group row">
-                <label for="id_1" class="control-label col-sm-4 col-md-3 col-lg-2">'.$label.'</label>
+                <label for="id_1" class="control-label col-sm-4 col-md-3 col-lg-2">' . $label . '</label>
                 <div class="col-sm-8 col-md-9 col-lg-10">
                     <div class="il-input-password" id="id_1_container">
-                        <input id="id_1" type="password" name="'.$name.'" value="'.$value.'" class="form-control form-control-sm" />
+                        <input id="id_1" type="password" name="' . $name . '" value="' . $value . '" class="form-control form-control-sm" autocomplete="off" />
                     </div>
                 </div>
             </div>';
@@ -177,10 +176,10 @@ public function test_render_required(): void
 
         $expected = '
         <div class="form-group row">
-            <label for="id_1" class="control-label col-sm-4 col-md-3 col-lg-2">'.$label.'<span class="asterisk">*</span></label>
+            <label for="id_1" class="control-label col-sm-4 col-md-3 col-lg-2">' . $label . '<span class="asterisk">*</span></label>
             <div class="col-sm-8 col-md-9 col-lg-10">
                 <div class="il-input-password" id="id_1_container">
-                    <input id="id_1" type="password" name="'.$name.'" class="form-control form-control-sm" />
+                    <input id="id_1" type="password" name="' . $name . '" class="form-control form-control-sm" autocomplete="off" />
                 </div>
             </div>
         </div>';
@@ -199,10 +198,10 @@ public function test_render_disabled(): void
 
         $expected = '
         <div class="form-group row">
-            <label for="id_1" class="control-label col-sm-4 col-md-3 col-lg-2">'.$label.'</label>
+            <label for="id_1" class="control-label col-sm-4 col-md-3 col-lg-2">' . $label . '</label>
             <div class="col-sm-8 col-md-9 col-lg-10">
                 <div class="il-input-password" id="id_1_container">
-                    <input id="id_1" type="password" name="'.$name.'" disabled="disabled" class="form-control form-control-sm" />
+                    <input id="id_1" type="password" name="' . $name . '" disabled="disabled" class="form-control form-control-sm" autocomplete="off" />
                 </div>
             </div>
         </div>';