javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-16 11:42:04 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(color): four-digit hex color parse failure (#10593)

Browse Source
This commit is contained in:
Dimitris-Rafail Katsampas
2024-08-06 01:05:27 +03:00
committed by GitHub
parent 423a2d2dce
commit 8877becdf9
2 changed files with 33 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
apps/automated/src/color/color-tests-common.ts
View File

@ -17,6 +17,19 @@ export var test_Hex_Color = function () {
TKUnit.assertEqual(color.argb, 0xffff0000, 'Color.argb not properly parsed'); TKUnit.assertEqual(color.argb, 0xffff0000, 'Color.argb not properly parsed');
}; };
export var test_Hex_rgba_Color = function () {
// >> color-hex-rgba
// Creates the red color
var color = new Color('#FF0000FF');
// << color-hex-rgba
TKUnit.assertEqual(color.a, 255, 'Color.a not properly parsed');
TKUnit.assertEqual(color.r, 255, 'Color.r not properly parsed');
TKUnit.assertEqual(color.g, 0, 'Color.g not properly parsed');
TKUnit.assertEqual(color.b, 0, 'Color.b not properly parsed');
TKUnit.assertEqual(color.hex, '#FF0000', 'Color.hex not properly parsed');
TKUnit.assertEqual(color.argb, 0xffff0000, 'Color.argb not properly parsed');
};
export var test_ShortHex_Color = function () { export var test_ShortHex_Color = function () {
// >> color-hex-short // >> color-hex-short
// Creates the color #FF8800 // Creates the color #FF8800
@ -30,6 +43,19 @@ export var test_ShortHex_Color = function () {
TKUnit.assertEqual(color.argb, 0xffff8800, 'Color.argb not properly parsed'); TKUnit.assertEqual(color.argb, 0xffff8800, 'Color.argb not properly parsed');
}; };
export var test_ShortHex_rgba_Color = function () {
// >> color-hex-short-rgba
// Creates the color #FF8800
var color = new Color('#F80F');
// << color-hex-short-rgba
TKUnit.assertEqual(color.a, 255, 'Color.a not properly parsed');
TKUnit.assertEqual(color.r, 255, 'Color.r not properly parsed');
TKUnit.assertEqual(color.g, 136, 'Color.g not properly parsed'); // 0x88 == 136
TKUnit.assertEqual(color.b, 0, 'Color.b not properly parsed');
TKUnit.assertEqual(color.hex, '#FF8800', 'Color.hex not properly parsed');
TKUnit.assertEqual(color.argb, 0xffff8800, 'Color.argb not properly parsed');
};
export var test_Argb_Color = function () { export var test_Argb_Color = function () {
// >> color-rgb // >> color-rgb
// Creates the color with 100 alpha, 255 red, 100 green, 100 blue // Creates the color with 100 alpha, 255 red, 100 green, 100 blue
@ -112,7 +138,10 @@ export var test_Color_isValid = function () {
var color = new Color('#FF0000'); var color = new Color('#FF0000');
TKUnit.assertEqual(Color.isValid(color), true, 'Failed to validate color instance'); TKUnit.assertEqual(Color.isValid(color), true, 'Failed to validate color instance');
TKUnit.assertEqual(Color.isValid('#FF0000'), true, 'Failed to validate hex color'); TKUnit.assertEqual(Color.isValid('#FFF'), true, 'Failed to validate 3-digit hex color');
TKUnit.assertEqual(Color.isValid('#FFF0'), true, 'Failed to validate 4-digit hex color');
TKUnit.assertEqual(Color.isValid('#FF0000'), true, 'Failed to validate 6-digit hex color');
TKUnit.assertEqual(Color.isValid('#FF000000'), true, 'Failed to validate 8-digit hex color');
TKUnit.assertEqual(Color.isValid('rgb(255, 100, 100)'), true, 'Failed to validate rgb color'); TKUnit.assertEqual(Color.isValid('rgb(255, 100, 100)'), true, 'Failed to validate rgb color');
TKUnit.assertEqual(Color.isValid('hsl(50, 50%, 50%)'), true, 'Failed to validate hsl color'); TKUnit.assertEqual(Color.isValid('hsl(50, 50%, 50%)'), true, 'Failed to validate hsl color');
TKUnit.assertEqual(Color.isValid(null) || Color.isValid(undefined), false, 'Failed to invalidate nullish value'); TKUnit.assertEqual(Color.isValid(null) || Color.isValid(undefined), false, 'Failed to invalidate nullish value');

6
packages/core/color/color-common.ts
View File

@ -4,7 +4,7 @@ import * as knownColors from './known-colors';
import { Color } from '.'; import { Color } from '.';
const SHARP = '#'; const SHARP = '#';
const HEX_REGEX = /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)|(^#[0-9A-F]{8}$)/i; const HEX_REGEX = /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)|(^#[0-9A-F]{8}$)|(^#[0-9A-F]{4}$)/i;
export class ColorBase implements definition.Color { export class ColorBase implements definition.Color {
private _argb: number; private _argb: number;
@ -29,7 +29,7 @@ export class ColorBase implements definition.Color {
const argb = knownColors.getKnownColor(lowered); const argb = knownColors.getKnownColor(lowered);
this._name = arg; this._name = arg;
this._argb = argb; this._argb = argb;
} else if (arg[0].charAt(0) === SHARP && (arg.length === 4 || arg.length === 7 || arg.length === 9)) { } else if (arg[0].charAt(0) === SHARP && (arg.length === 4 || arg.length === 5 || arg.length === 7 || arg.length === 9)) {
// we dont use the regexp as it is quite slow. Instead we expect it to be a valid hex format // we dont use the regexp as it is quite slow. Instead we expect it to be a valid hex format
// strange that it would not be. And if it is not a thrown error seems best // strange that it would not be. And if it is not a thrown error seems best
// The parameter is a "#RRGGBBAA" formatted string // The parameter is a "#RRGGBBAA" formatted string
@ -578,7 +578,7 @@ function hsvToRgb(h1, s1, v1) {
const s = s1 / 100; const s = s1 / 100;
const v = v1 / 100; const v = v1 / 100;
var i = Math.floor(h), const i = Math.floor(h),
f = h - i, f = h - i,
p = v * (1 - s), p = v * (1 - s),
q = v * (1 - f * s), q = v * (1 - f * s),