adjust form requirements and verbatim input

src/app/accounts/hint.component.html

@@ -1,4 +1,4 @@
-<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" class="container">
+<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" class="container" ngNativeValidate>
     <div class="row justify-content-md-center mt-5">
         <div class="col-5">
             <p class="lead text-center mb-4">{{'passwordHint' | i18n}}</p>
@@ -6,7 +6,8 @@
                 <div class="card-body">
                     <div class="form-group">
                         <label for="email">{{'emailAddress' | i18n}}</label>
-                        <input id="email" class="form-control" type="text" name="Email" [(ngModel)]="email" required appAutofocus appInputVerbatim="false">
+                        <input id="email" class="form-control" type="text" name="Email" [(ngModel)]="email" required appAutofocus inputmode="email"
+                            appInputVerbatim="false">
                         <small class="form-text text-muted">{{'enterEmailToGetHint' | i18n}}</small>
                     </div>
                     <hr>

src/app/accounts/lock.component.html

@@ -11,7 +11,7 @@
                         <label for="masterPassword">{{'masterPass' | i18n}}</label>
                         <div class="d-flex">
                             <input id="masterPassword" type="{{showPassword ? 'text' : 'password'}}" name="MasterPassword" class="text-monospace form-control"
-                                [(ngModel)]="masterPassword" required appAutofocus>
+                                [(ngModel)]="masterPassword" required appAutofocus appInputVerbatim>
                             <button type="button" class="ml-1 btn btn-link" appBlurClick title="{{'toggleVisibility' | i18n}}" (click)="togglePassword()">
                                 <i class="fa fa-lg" [ngClass]="{'fa-eye': !showPassword, 'fa-eye-slash': showPassword}"></i>
                             </button>

src/app/accounts/login.component.html

@@ -1,4 +1,4 @@
-<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" class="container">
+<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" class="container" ngNativeValidate>
     <div class="row justify-content-md-center mt-5">
         <div class="col-5">
             <img src="../../images/logo-dark@2x.png" class="logo mb-2" alt="Bitwarden">

src/app/accounts/register.component.html

@@ -1,4 +1,4 @@
-<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" class="container">
+<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" class="container" ngNativeValidate>
     <div class="row justify-content-md-center mt-5">
         <div class="col-5">
             <p class="lead text-center mb-4">{{'createAccount' | i18n}}</p>

src/app/accounts/two-factor.component.html

@@ -1,4 +1,4 @@
-<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" class="container">
+<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" class="container" ngNativeValidate>
     <div class="row justify-content-md-center mt-5">
         <div class="col-5" [ngClass]="{'col-9': selectedProviderType === providerType.Duo || selectedProviderType === providerType.OrganizationDuo}">
             <p class="lead text-center mb-4">{{title}}</p>
@@ -11,7 +11,7 @@
                         </p>
                         <div class="form-group">
                             <label for="code" class="sr-only">{{'verificationCode' | i18n}}</label>
-                            <input id="code" type="text" name="Code" class="form-control" [(ngModel)]="token" required appAutofocus>
+                            <input id="code" type="text" name="Code" class="form-control" [(ngModel)]="token" required appAutofocus inputmode="tel" appInputVerbatim>
                             <small class="form-text" *ngIf="selectedProviderType === providerType.Email">
                                 <a href="#" appStopClick (click)="sendEmail(true)" [appApiAction]="emailPromise" *ngIf="selectedProviderType === providerType.Email">
                                     {{'sendVerificationCodeEmailAgain' | i18n}}
@@ -24,7 +24,7 @@
                         <img src="../../images/yubikey.jpg" class="rounded img-fluid mb-3" alt="">
                         <div class="form-group">
                             <label for="code" class="sr-only">{{'verificationCode' | i18n}}</label>
-                            <input id="code" type="password" name="Code" class="form-control" [(ngModel)]="token" required appAutofocus>
+                            <input id="code" type="password" name="Code" class="form-control" [(ngModel)]="token" required appAutofocus appInputVerbatim>
                         </div>
                     </ng-container>
                     <ng-container *ngIf="selectedProviderType === providerType.U2f">

src/app/organizations/manage/collection-add-edit.component.html

@@ -1,6 +1,6 @@
 <div class="modal fade">
     <div class="modal-dialog">
-        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
+        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">
                 <h2 class="modal-title">{{title}}</h2>
                 <button type="button" class="close" data-dismiss="modal" attr.aria-label="{{'close' | i18n}}">
@@ -13,7 +13,7 @@
             <div class="modal-body" *ngIf="!loading">
                 <div class="form-group">
                     <label for="name">{{'name' | i18n}}</label>
-                    <input id="name" class="form-control" type="text" name="Name" [(ngModel)]="name">
+                    <input id="name" class="form-control" type="text" name="Name" [(ngModel)]="name" required>
                 </div>
                 <h3 class="mt-4 d-flex mb-0">
                     {{'groupAccess' | i18n}}

src/app/organizations/manage/group-add-edit.component.html

@@ -1,6 +1,6 @@
 <div class="modal fade">
     <div class="modal-dialog">
-        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
+        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">
                 <h2 class="modal-title">{{title}}</h2>
                 <button type="button" class="close" data-dismiss="modal" attr.aria-label="{{'close' | i18n}}">
@@ -13,7 +13,7 @@
             <div class="modal-body" *ngIf="!loading">
                 <div class="form-group">
                     <label for="name">{{'name' | i18n}}</label>
-                    <input id="name" class="form-control" type="text" name="Name" [(ngModel)]="name">
+                    <input id="name" class="form-control" type="text" name="Name" [(ngModel)]="name" required>
                 </div>
                 <div class="form-group">
                     <label for="externalId">{{'externalId' | i18n}}</label>

src/app/organizations/manage/user-add-edit.component.html

@@ -1,6 +1,6 @@
 <div class="modal fade">
     <div class="modal-dialog" [ngClass]="{'modal-lg': !editMode}">
-        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
+        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">
                 <h2 class="modal-title">
                     {{title}}
@@ -18,7 +18,7 @@
                     <p>{{'inviteUserDesc' | i18n}}</p>
                     <div class="form-group mb-4">
                         <label for="emails">{{'email' | i18n}}</label>
-                        <input id="emails" class="form-control" type="text" name="Emails" [(ngModel)]="emails">
+                        <input id="emails" class="form-control" type="text" name="Emails" [(ngModel)]="emails" required>
                         <small class="text-muted">{{'inviteMultipleEmailDesc' | i18n : '20'}}</small>
                     </div>
                 </ng-container>

src/app/settings/change-email.component.html

@@ -4,11 +4,12 @@
             <div class="form-group">
                 <label for="masterPassword">{{'masterPass' | i18n}}</label>
                 <input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control" [(ngModel)]="masterPassword" required
-                    [readonly]="tokenSent">
+                    [readonly]="tokenSent" appInputVerbatim>
             </div>
             <div class="form-group">
                 <label for="newEmail">{{'newEmail' | i18n}}</label>
-                <input id="newEmail" class="form-control" type="text" name="NewEmail" [(ngModel)]="newEmail" required [readonly]="tokenSent">
+                <input id="newEmail" class="form-control" type="text" name="NewEmail" [(ngModel)]="newEmail" required [readonly]="tokenSent"
+                    inputmode="email" appInputVerbatim="false">
             </div>
         </div>
     </div>
@@ -20,7 +21,7 @@
             <div class="col-6">
                 <div class="form-group">
                     <label for="token">{{'code' | i18n}}</label>
-                    <input id="token" class="form-control" type="text" name="Token" [(ngModel)]="token" required>
+                    <input id="token" class="form-control" type="text" name="Token" [(ngModel)]="token" required appInputVerbatim>
                 </div>
             </div>
         </div>

src/app/settings/change-password.component.html

@@ -5,17 +5,17 @@
             <div class="form-group">
                 <label for="currentMasterPassword">{{'currentMasterPass' | i18n}}</label>
                 <input id="currentMasterPassword" type="password" name="MasterPasswordHash" class="form-control" [(ngModel)]="currentMasterPassword"
-                    required>
+                    required appInputVerbatim>
             </div>
             <div class="form-group">
                 <label for="newMasterPassword">{{'newMasterPass' | i18n}}</label>
                 <input id="newMasterPassword" type="password" name="NewMasterPasswordHash" class="form-control" [(ngModel)]="newMasterPassword"
-                    required>
+                    required appInputVerbatim>
             </div>
             <div class="form-group">
                 <label for="confirmNewMasterPassword">{{'confirmNewMasterPass' | i18n}}</label>
                 <input id="confirmNewMasterPassword" type="password" name="ConfirmNewMasterPasswordHash" class="form-control" [(ngModel)]="confirmNewMasterPassword"
-                    required>
+                    required appInputVerbatim>
             </div>
         </div>
     </div>

src/app/settings/deauthorize-sessions.component.html

@@ -1,6 +1,6 @@
 <div class="modal fade">
     <div class="modal-dialog">
-        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
+        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">
                 <h2 class="modal-title">{{'deauthorizeSessions' | i18n}}</h2>
                 <button type="button" class="close" data-dismiss="modal" attr.aria-label="{{'close' | i18n}}">
@@ -12,7 +12,7 @@
                 <app-callout type="warning">{{'deauthorizeSessionsWarning' | i18n}}</app-callout>
                 <label for="masterPassword">{{'masterPass' | i18n}}</label>
                 <input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control" [(ngModel)]="masterPassword" required
-                    appAutoFocus>
+                    appAutoFocus appInputVerbatim>
             </div>
             <div class="modal-footer">
                 <button appBlurClick type="submit" class="btn btn-danger btn-submit" [disabled]="form.loading">

src/app/settings/delete-account.component.html

@@ -1,6 +1,6 @@
 <div class="modal fade">
     <div class="modal-dialog">
-        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
+        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">
                 <h2 class="modal-title">{{'deleteAccount' | i18n}}</h2>
                 <button type="button" class="close" data-dismiss="modal" attr.aria-label="{{'close' | i18n}}">
@@ -12,7 +12,7 @@
                 <app-callout type="warning">{{'deleteAccountWarning' | i18n}}</app-callout>
                 <label for="masterPassword">{{'masterPass' | i18n}}</label>
                 <input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control" [(ngModel)]="masterPassword" required
-                    appAutofocus>
+                    appAutofocus appInputVerbatim>
             </div>
             <div class="modal-footer">
                 <button appBlurClick type="submit" class="btn btn-danger btn-submit" [disabled]="form.loading">

src/app/settings/domain-rules.component.html

@@ -2,7 +2,7 @@
     <h1>{{'domainRules' | i18n}}</h1>
 </div>
 <p>{{'domainRulesDesc' | i18n}}</p>
-<form #form (ngSubmit)="submit()" [appApiAction]="formPromise">
+<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
     <h2>{{'customEqDomains' | i18n}}</h2>
     <p *ngIf="loading">
         <i class="fa fa-spinner fa-spin text-muted"></i>
@@ -11,7 +11,8 @@
         <div class="form-group d-flex" *ngFor="let d of custom; let i = index; trackBy: indexTrackBy">
             <div class="flex-fill">
                 <label for="customDomain_{{i}}" class="sr-only">{{'customDomainX' | i18n : (i + 1)}}</label>
-                <textarea class="form-control" name="CustomDomain[{{i}}]" id="customDomain_{{i}}" [(ngModel)]="custom[i]" placeholder="{{'ex' | i18n}} google.com, gmail.com"></textarea>
+                <textarea class="form-control" name="CustomDomain[{{i}}]" id="customDomain_{{i}}" [(ngModel)]="custom[i]" placeholder="{{'ex' | i18n}} google.com, gmail.com"
+                    required></textarea>
             </div>
             <button type="button" class="btn btn-link text-danger ml-2" (click)="remove(i)" title="{{'remove' | i18n}}">
                 <i class="fa fa-minus-circle fa-lg"></i>

src/app/settings/profile.component.html

@@ -1,7 +1,7 @@
 <div *ngIf="loading">
     <i class="fa fa-spinner fa-spin text-muted"></i>
 </div>
-<form *ngIf="profile && !loading" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
+<form *ngIf="profile && !loading" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
     <div class="row">
         <div class="col-6">
             <div class="form-group">

src/app/settings/purge-vault.component.html

@@ -1,6 +1,6 @@
 <div class="modal fade">
     <div class="modal-dialog">
-        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
+        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">
                 <h2 class="modal-title">{{'purgeVault' | i18n}}</h2>
                 <button type="button" class="close" data-dismiss="modal" attr.aria-label="{{'close' | i18n}}">
@@ -12,7 +12,7 @@
                 <app-callout type="warning">{{'purgeVaultWarning' | i18n}}</app-callout>
                 <label for="masterPassword">{{'masterPass' | i18n}}</label>
                 <input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control" [(ngModel)]="masterPassword" required
-                    appAutofocus>
+                    appAutofocus appInputVerbatim>
             </div>
             <div class="modal-footer">
                 <button appBlurClick type="submit" class="btn btn-danger btn-submit" [disabled]="form.loading">

src/app/settings/two-factor-duo.component.html

@@ -34,7 +34,7 @@
                         </div>
                         <div class="form-group">
                             <label for="skey">{{'twoFactorDuoSecretKey' | i18n}}</label>
-                            <input id="skey" type="password" name="SecretKey" class="form-control" [(ngModel)]="skey" required>
+                            <input id="skey" type="password" name="SecretKey" class="form-control" [(ngModel)]="skey" required appInputVerbatim>
                         </div>
                         <div class="form-group">
                             <label for="host">{{'twoFactorDuoApiHostname' | i18n}}</label>

src/app/settings/two-factor-email.component.html

@@ -27,7 +27,7 @@
                         </p>
                         <div class="form-group">
                             <label for="email">1. {{'twoFactorEmailEnterEmail' | i18n}}</label>
-                            <input id="email" type="text" name="Email" class="form-control" [(ngModel)]="email" required>
+                            <input id="email" type="text" name="Email" class="form-control" [(ngModel)]="email" required inputmode="email" appInputVerbatim="false">
                         </div>
                         <div class="mb-3 d-flex">
                             <button #sendBtn type="button" class="btn btn-outline-primary btn-sm btn-submit align-self-start" appBlurClick (click)="sendEmail()"

src/app/settings/two-factor-verify.component.html

@@ -3,7 +3,7 @@
         <p>{{'twoStepLoginAuthDesc' | i18n}}</p>
         <label for="masterPassword">{{'masterPass' | i18n}}</label>
         <input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control" [(ngModel)]="masterPassword" required
-            appAutoFocus>
+            appAutoFocus appInputVerbatim>
     </div>
     <div class="modal-footer">
         <button appBlurClick type="submit" class="btn btn-primary btn-submit" [disabled]="form.loading">

src/app/tools/export.component.html

@@ -7,7 +7,8 @@
     <div class="row">
         <div class="form-group col-6">
             <label for="masterPassword">{{'masterPass' | i18n}}</label>
-            <input id="masterPassword" type="password" name="MasterPassword" class="form-control" [(ngModel)]="masterPassword" required>
+            <input id="masterPassword" type="password" name="MasterPassword" class="form-control" [(ngModel)]="masterPassword" required
+                appInputVerbatim>
         </div>
     </div>
     <button appBlurClick type="submit" class="btn btn-primary btn-submit" [disabled]="form.loading">

src/app/vault/add-edit.component.html

@@ -1,6 +1,6 @@
 <div class="modal fade">
     <div class="modal-dialog modal-lg">
-        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
+        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">
                 <h2 class="modal-title">{{title}}</h2>
                 <button type="button" class="close" data-dismiss="modal" attr.aria-label="{{'close' | i18n}}">
@@ -19,7 +19,7 @@
                 <div class="row">
                     <div class="col-6 form-group">
                         <label for="name">{{'name' | i18n}}</label>
-                        <input id="name" class="form-control" type="text" name="Name" [(ngModel)]="cipher.name">
+                        <input id="name" class="form-control" type="text" name="Name" [(ngModel)]="cipher.name" required>
                     </div>
                     <div class="col-6 form-group" *ngIf="!organization">
                         <label for="folder">{{'folder' | i18n}}</label>
@@ -34,7 +34,7 @@
                         <div class="col-6 form-group">
                             <label for="loginUsername">{{'username' | i18n}}</label>
                             <div class="input-group">
-                                <input id="loginUsername" class="form-control" type="text" name="Login.Username" [(ngModel)]="cipher.login.username">
+                                <input id="loginUsername" class="form-control" type="text" name="Login.Username" [(ngModel)]="cipher.login.username" appInputVerbatim>
                                 <div class="input-group-append">
                                     <button type="button" class="btn btn-outline-secondary" appBlurClick title="{{'copyUsername' | i18n}}" (click)="copy(cipher.login.username, 'username', 'Username')"
                                         tabindex="-1">
@@ -59,7 +59,7 @@
                             </div>
                             <div class="input-group">
                                 <input id="loginPassword" class="form-control text-monospace" type="{{showPassword ? 'text' : 'password'}}" name="Login.Password"
-                                    [(ngModel)]="cipher.login.password">
+                                    [(ngModel)]="cipher.login.password" appInputVerbatim>
                                 <div class="input-group-append">
                                     <button type="button" class="btn btn-outline-secondary" appBlurClick title="{{'toggleVisibility' | i18n}}" (click)="togglePassword()"
                                         tabindex="-1">
@@ -76,7 +76,7 @@
                     <div class="row">
                         <div class="col-6 form-group">
                             <label for="loginTotp">{{'authenticatorKeyTotp' | i18n}}</label>
-                            <input id="loginTotp" type="text" name="Login.Totp" class="form-control text-monospace" [(ngModel)]="cipher.login.totp">
+                            <input id="loginTotp" type="text" name="Login.Totp" class="form-control text-monospace" [(ngModel)]="cipher.login.totp" appInputVerbatim>
                         </div>
                         <div class="col-6 form-group totp d-flex align-items-end" [ngClass]="{'low': totpLow}">
                             <div *ngIf="!cipher.login.totp || !totpCode">
@@ -104,7 +104,8 @@
                             <div class="col-7 form-group">
                                 <label for="loginUri{{i}}">{{'uriPosition' | i18n : (i + 1)}}</label>
                                 <div class="input-group">
-                                    <input class="form-control" id="loginUri{{i}}" type="text" name="Login.Uris[{{i}}].Uri" [(ngModel)]="u.uri" placeholder="{{'ex' | i18n}} https://google.com">
+                                    <input class="form-control" id="loginUri{{i}}" type="text" name="Login.Uris[{{i}}].Uri" [(ngModel)]="u.uri" placeholder="{{'ex' | i18n}} https://google.com"
+                                        appInputVerbatim>
                                     <div class="input-group-append">
                                         <button type="button" class="btn btn-outline-secondary" appBlurClick title="{{'launch' | i18n}}" (click)="launch(u)" [disabled]="!u.canLaunch"
                                             tabindex="-1">
@@ -154,7 +155,7 @@
                         <div class="col-6 form-group">
                             <label for="cardNumber">{{'number' | i18n}}</label>
                             <div class="input-group">
-                                <input id="cardNumber" class="form-control" type="text" name="Card.Number" [(ngModel)]="cipher.card.number">
+                                <input id="cardNumber" class="form-control" type="text" name="Card.Number" [(ngModel)]="cipher.card.number" appInputVerbatim>
                                 <div class="input-group-append">
                                     <button type="button" class="btn btn-outline-secondary" appBlurClick title="{{'copyNumber' | i18n}}" (click)="copy(cipher.card.number, 'number', 'Number')"
                                         tabindex="-1">
@@ -178,7 +179,8 @@
                         <div class="col-6 form-group">
                             <label for="cardCode">{{'securityCode' | i18n}}</label>
                             <div class="input-group">
-                                <input id="cardCode" class="form-control text-monospace" type="{{showCardCode ? 'text' : 'password'}}" name="Card.Code" [(ngModel)]="cipher.card.code">
+                                <input id="cardCode" class="form-control text-monospace" type="{{showCardCode ? 'text' : 'password'}}" name="Card.Code" [(ngModel)]="cipher.card.code"
+                                    appInputVerbatim>
                                 <div class="input-group-append">
                                     <button type="button" class="btn btn-outline-secondary" appBlurClick title="{{'toggleVisibility' | i18n}}" (click)="toggleCardCode()"
                                         tabindex="-1">
@@ -220,7 +222,7 @@
                     <div class="row">
                         <div class="col-4 form-group">
                             <label for="idUsername">{{'username' | i18n}}</label>
-                            <input id="idUsername" class="form-control" type="text" name="Identity.Username" [(ngModel)]="cipher.identity.username">
+                            <input id="idUsername" class="form-control" type="text" name="Identity.Username" [(ngModel)]="cipher.identity.username" appInputVerbatim>
                         </div>
                         <div class="col-4 form-group">
                             <label for="idCompany">{{'company' | i18n}}</label>
@@ -230,21 +232,23 @@
                     <div class="row">
                         <div class="col-4 form-group">
                             <label for="idSsn">{{'ssn' | i18n}}</label>
-                            <input id="idSsn" class="form-control" type="text" name="Identity.SSN" [(ngModel)]="cipher.identity.ssn">
+                            <input id="idSsn" class="form-control" type="text" name="Identity.SSN" [(ngModel)]="cipher.identity.ssn" appInputVerbatim>
                         </div>
                         <div class="col-4 form-group">
                             <label for="idPassportNumber">{{'passportNumber' | i18n}}</label>
-                            <input id="idPassportNumber" class="form-control" type="text" name="Identity.PassportNumber" [(ngModel)]="cipher.identity.passportNumber">
+                            <input id="idPassportNumber" class="form-control" type="text" name="Identity.PassportNumber" [(ngModel)]="cipher.identity.passportNumber"
+                                appInputVerbatim>
                         </div>
                         <div class="col-4 form-group">
                             <label for="idLicenseNumber">{{'licenseNumber' | i18n}}</label>
-                            <input id="idLicenseNumber" class="form-control" type="text" name="Identity.LicenseNumber" [(ngModel)]="cipher.identity.licenseNumber">
+                            <input id="idLicenseNumber" class="form-control" type="text" name="Identity.LicenseNumber" [(ngModel)]="cipher.identity.licenseNumber"
+                                appInputVerbatim>
                         </div>
                     </div>
                     <div class="row">
                         <div class="col-6 form-group">
                             <label for="idEmail">{{'email' | i18n}}</label>
-                            <input id="idEmail" class="form-control" type="text" name="Identity.Email" [(ngModel)]="cipher.identity.email">
+                            <input id="idEmail" class="form-control" type="text" name="Identity.Email" [(ngModel)]="cipher.identity.email" appInputVerbatim>
                         </div>
                         <div class="col-6 form-group">
                             <label for="idPhone">{{'phone' | i18n}}</label>
@@ -297,13 +301,13 @@
                     <div class="row" appBoxRow *ngFor="let f of cipher.fields; let i = index">
                         <div class="col-5 form-group">
                             <label for="fieldName{{i}}">{{'name' | i18n}}</label>
-                            <input id="fieldName{{i}}" type="text" name="Field.Name{{i}}" [(ngModel)]="f.name" class="form-control">
+                            <input id="fieldName{{i}}" type="text" name="Field.Name{{i}}" [(ngModel)]="f.name" class="form-control" appInputVerbatim>
                         </div>
                         <div class="col-7 form-group">
                             <label for="fieldValue{{i}}">{{'value' | i18n}}</label>
                             <div class="d-flex align-items-center">
                                 <div class="input-group" *ngIf="f.type === fieldType.Text">
-                                    <input id="fieldValue{{i}}" class="form-control" type="text" name="Field.Value{{i}}" [(ngModel)]="f.value">
+                                    <input id="fieldValue{{i}}" class="form-control" type="text" name="Field.Value{{i}}" [(ngModel)]="f.value" appInputVerbatim>
                                     <div class="input-group-append">
                                         <button type="button" class="btn btn-outline-secondary" appBlurClick title="{{'copyValue' | i18n}}" (click)="copy(f.value, 'value', 'Field')"
                                             tabindex="-1">
@@ -312,7 +316,8 @@
                                     </div>
                                 </div>
                                 <div class="input-group" *ngIf="f.type === fieldType.Hidden">
-                                    <input id="fieldValue{{i}}" type="{{f.showValue ? 'text' : 'password'}}" name="Field.Value{{i}}" [(ngModel)]="f.value" class="form-control text-monospace">
+                                    <input id="fieldValue{{i}}" type="{{f.showValue ? 'text' : 'password'}}" name="Field.Value{{i}}" [(ngModel)]="f.value" class="form-control text-monospace"
+                                        appInputVerbatim>
                                     <div class="input-group-append">
                                         <button type="button" class="btn btn-outline-secondary" appBlurClick title="{{'toggleVisibility' | i18n}}" (click)="toggleFieldValue(f)"
                                             tabindex="-1">

src/app/vault/attachments.component.html

@@ -1,6 +1,6 @@
 <div class="modal fade">
     <div class="modal-dialog">
-        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
+        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">
                 <h2 class="modal-title">
                     {{'attachments' | i18n}}

src/app/vault/folder-add-edit.component.html

@@ -1,6 +1,6 @@
 <div class="modal fade">
     <div class="modal-dialog modal-sm">
-        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
+        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">
                 <h2 class="modal-title">{{title}}</h2>
                 <button type="button" class="close" data-dismiss="modal" attr.aria-label="{{'close' | i18n}}">
@@ -9,7 +9,7 @@
             </div>
             <div class="modal-body">
                 <label for="name">{{'name' | i18n}}</label>
-                <input id="name" class="form-control" type="text" name="Name" [(ngModel)]="folder.name">
+                <input id="name" class="form-control" type="text" name="Name" [(ngModel)]="folder.name" required>
             </div>
             <div class="modal-footer">
                 <button appBlurClick type="submit" class="btn btn-primary btn-submit" [disabled]="form.loading">