diff --git a/src/angular/pipes/color-password.pipe.ts b/src/angular/pipes/color-password.pipe.ts
index 1867032faf..f5de7967e5 100644
--- a/src/angular/pipes/color-password.pipe.ts
+++ b/src/angular/pipes/color-password.pipe.ts
@@ -1,20 +1,43 @@
-import { Pipe, PipeTransform } from '@angular/core';
-import { SafeHtml } from '@angular/platform-browser';
+import {
+ Pipe,
+ PipeTransform,
+} from '@angular/core';
/**
* A pipe that sanitizes HTML and highlights numbers and special characters (in different colors each).
*/
@Pipe({ name: 'colorPassword' })
export class ColorPasswordPipe implements PipeTransform {
- transform(password: string): SafeHtml {
- return password
+ transform(password: string) {
+ let colorizedPassword = '';
+ for (let i = 0; i < password.length; i++) {
+ let character = password[i];
+ let isSpecial = false;
// Sanitize HTML first.
- .replace(/&/g, '&')
- .replace(//g, '>')
- // Replace special chars (since that will exclude numbers anyway).
- .replace(/((&|<|>|[^\w ])+)/g, `$1`)
- // Finally replace the numbers.
- .replace(/(\d+)/g, `$1`);
+ switch (character) {
+ case '&':
+ character = '&';
+ isSpecial = true;
+ break;
+ case '<':
+ character = '<';
+ isSpecial = true;
+ break;
+ case '>':
+ character = '>';
+ isSpecial = true;
+ break;
+ default:
+ break;
+ }
+ let type = 'letter';
+ if (isSpecial || character.match(/[^\w ]/)) {
+ type = 'special';
+ } else if (character.match(/\d/)) {
+ type = 'number';
+ }
+ colorizedPassword += '' + character + '';
+ }
+ return colorizedPassword;
}
}