Update color-password.pipe.js to handle Unicode/Emoji correctly accross platforms. (#354)
This commit is contained in:
parent
090ad790f5
commit
b6f102938f
|
@ -3,15 +3,20 @@ import {
|
||||||
PipeTransform,
|
PipeTransform,
|
||||||
} from '@angular/core';
|
} from '@angular/core';
|
||||||
|
|
||||||
/**
|
/*
|
||||||
* A pipe that sanitizes HTML and highlights numbers and special characters (in different colors each).
|
An updated pipe that sanitizes HTML, highlights numbers and special characters (in different colors each)
|
||||||
*/
|
and handles Unicode / Emoji characters correctly.
|
||||||
|
*/
|
||||||
@Pipe({ name: 'colorPassword' })
|
@Pipe({ name: 'colorPassword' })
|
||||||
export class ColorPasswordPipe implements PipeTransform {
|
export class ColorPasswordPipe implements PipeTransform {
|
||||||
transform(password: string) {
|
transform(password: string) {
|
||||||
|
// Regex Unicode property escapes for checking if emoji in passwords.
|
||||||
|
const regexpEmojiPresentation = /\p{Emoji_Presentation}/gu;
|
||||||
|
// Convert to an array to handle cases that stings have special characters, ie: emoji.
|
||||||
|
const passwordArray = Array.from(password);
|
||||||
let colorizedPassword = '';
|
let colorizedPassword = '';
|
||||||
for (let i = 0; i < password.length; i++) {
|
for (let i = 0; i < passwordArray.length; i++) {
|
||||||
let character = password[i];
|
let character = passwordArray[i];
|
||||||
let isSpecial = false;
|
let isSpecial = false;
|
||||||
// Sanitize HTML first.
|
// Sanitize HTML first.
|
||||||
switch (character) {
|
switch (character) {
|
||||||
|
@ -35,7 +40,9 @@ export class ColorPasswordPipe implements PipeTransform {
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
let type = 'letter';
|
let type = 'letter';
|
||||||
if (isSpecial || character.match(/[^\w ]/)) {
|
if (character.match(regexpEmojiPresentation)) {
|
||||||
|
type = 'emoji';
|
||||||
|
} else if (isSpecial || character.match(/[^\w ]/)) {
|
||||||
type = 'special';
|
type = 'special';
|
||||||
} else if (character.match(/\d/)) {
|
} else if (character.match(/\d/)) {
|
||||||
type = 'number';
|
type = 'number';
|
||||||
|
|
Loading…
Reference in New Issue