diff --git a/src/app/vault/password-generator.component.html b/src/app/vault/password-generator.component.html
index 6fc1b3e6f3..4a4ed438b2 100644
--- a/src/app/vault/password-generator.component.html
+++ b/src/app/vault/password-generator.component.html
@@ -29,7 +29,7 @@
                             <input id="length" type="number" min="5" max="128" [(ngModel)]="options.length"
                                    (input)="saveOptions()">
                             <input id="lengthRange" type="range" min="5" max="128" step="1"
-                                   [(ngModel)]="options.length">
+                                   [(ngModel)]="options.length" (change)="sliderChanged()" (input)="sliderInput()">
                         </div>
                         <div class="box-content-row box-content-row-checkbox" appBoxRow>
                             <label for="uppercase">A-Z</label>
diff --git a/src/app/vault/password-generator.component.ts b/src/app/vault/password-generator.component.ts
index 7ea037407b..2a1a991459 100644
--- a/src/app/vault/password-generator.component.ts
+++ b/src/app/vault/password-generator.component.ts
@@ -41,27 +41,17 @@ export class PasswordGeneratorComponent implements OnInit {
         this.password = this.passwordGenerationService.generatePassword(this.options);
         this.analytics.eventTrack.next({ action: 'Generated Password' });
         await this.passwordGenerationService.addHistory(this.password);
+    }
 
-        const slider = document.querySelector('#lengthRange');
-        if (slider) {
-            // Save password once the slider stop moving.
-            slider.addEventListener('change', async (e) => {
-                e.preventDefault();
-                this.functionWithChangeDetection(() => {
-                    this.saveOptions(false);
-                });
-                await this.passwordGenerationService.addHistory(this.password);
-                this.analytics.eventTrack.next({ action: 'Regenerated Password' });
-            });
-            // Regenerate while slider moving
-            slider.addEventListener('input', (e) => {
-                e.preventDefault();
-                this.functionWithChangeDetection(() => {
-                    this.normalizeOptions();
-                    this.password = this.passwordGenerationService.generatePassword(this.options);
-                });
-            });
-        }
+    async sliderChanged() {
+        this.saveOptions(false);
+        await this.passwordGenerationService.addHistory(this.password);
+        this.analytics.eventTrack.next({ action: 'Regenerated Password' });
+    }
+
+    async sliderInput() {
+        this.normalizeOptions();
+        this.password = this.passwordGenerationService.generatePassword(this.options);
     }
 
     async saveOptions(regenerate: boolean = true) {