Fix: prevent config autocomplete craziness (#13808)

src-ui/src/app/components/admin/config/config.component.html

@@ -6,7 +6,7 @@
     infoLink="configuration">
 </pngx-page-header>
 
-<form [formGroup]="configForm" (ngSubmit)="saveConfig()" class="pb-4">
+<form [formGroup]="configForm" (ngSubmit)="saveConfig()" class="pb-4" autocomplete="off">
 
     <ul ngbNav #nav="ngbNav" class="nav-tabs">
         @for (category of optionCategories; track category) {
@@ -44,7 +44,7 @@
                                                         @case (ConfigOptionType.String) { <pngx-input-text [formControlName]="option.key" [error]="errors[option.key]"></pngx-input-text> }
                                                         @case (ConfigOptionType.JSON) { <pngx-input-text [formControlName]="option.key" [error]="errors[option.key]"></pngx-input-text> }
                                                         @case (ConfigOptionType.File) { <pngx-input-file [formControlName]="option.key" (upload)="uploadFile($event, option.key)" [error]="errors[option.key]"></pngx-input-file> }
-                                                        @case (ConfigOptionType.Password) { <pngx-input-password [formControlName]="option.key" [error]="errors[option.key]"></pngx-input-password> }
+                                                        @case (ConfigOptionType.Password) { <pngx-input-password [formControlName]="option.key" [error]="errors[option.key]" autocomplete="new-password"></pngx-input-password> }
                                                     }
                                                 </div>
                                                 @if (option.note) {

src-ui/src/app/components/common/input/password/password.component.spec.ts

@@ -40,6 +40,10 @@ describe('PasswordComponent', () => {
     // expect(component.value).toEqual('foo')
   })
 
+  it('should not offer itself to browser autofill by default', () => {
+    expect(input.getAttribute('autocomplete')).toEqual('off')
+  })
+
   it('should support toggling field visibility', () => {
     expect(input.type).toEqual('password')
     component.showReveal = true

src-ui/src/app/components/common/input/password/password.component.ts

@@ -25,7 +25,7 @@ export class PasswordComponent extends AbstractInputComponent<string> {
   showReveal: boolean = false
 
   @Input()
-  autocomplete: string
+  autocomplete: string = 'off'
 
   public textVisible: boolean = false
 

src-ui/src/app/components/common/input/text/text.component.spec.ts

@@ -24,6 +24,12 @@ describe('TextComponent', () => {
     input = component.inputField.nativeElement
   })
 
+  it('should not offer itself to browser autofill by default', () => {
+    expect(
+      component.inputField.nativeElement.getAttribute('autocomplete')
+    ).toEqual('off')
+  })
+
   it('should support use of input field', () => {
     expect(component.value).toBeUndefined()
     input.value = 'foo'

src-ui/src/app/components/common/input/text/text.component.ts

@@ -28,7 +28,7 @@ import { AbstractInputComponent } from '../abstract-input'
 })
 export class TextComponent extends AbstractInputComponent<string> {
   @Input()
-  autocomplete: string
+  autocomplete: string = 'off'
 
   @Input()
   placeholder: string = ''