mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Disallow invalid unitless lengths in filters (#49242)
Summary: Pull Request resolved: https://github.com/facebook/react-native/pull/49242 Same bug as in D68740553, copy/pasted. Unitless numbers are not valid <length> apart from `0`. Changelog: [General][Breaking] - Disallow invalid unitless lengths in filters Reviewed By: javache Differential Revision: D69210768 fbshipit-source-id: c20a3aa1e9dbc84f636235a70c58e4d96dbe86b9
This commit is contained in:
committed by
Facebook GitHub Bot
parent
e2a776f322
commit
b34e63539d
+17
-15
@@ -112,7 +112,7 @@ describe('processFilter', () => {
|
||||
});
|
||||
it('string multiple filters', () => {
|
||||
expect(
|
||||
processFilter('brightness(0.5) opacity(0.5) blur(5) hue-rotate(90deg)'),
|
||||
processFilter('brightness(0.5) opacity(0.5) blur(5px) hue-rotate(90deg)'),
|
||||
).toEqual([{brightness: 0.5}, {opacity: 0.5}, {blur: 5}, {hueRotate: 90}]);
|
||||
});
|
||||
it('string multiple filters with newlines', () => {
|
||||
@@ -124,7 +124,7 @@ describe('processFilter', () => {
|
||||
});
|
||||
it('string multiple filters one invalid', () => {
|
||||
expect(
|
||||
processFilter('brightness(0.5) opacity(0.5) blur(5) hue-rotate(90foo)'),
|
||||
processFilter('brightness(0.5) opacity(0.5) blur(5px) hue-rotate(90foo)'),
|
||||
).toEqual([]);
|
||||
});
|
||||
it('string multiple same filters', () => {
|
||||
@@ -233,7 +233,7 @@ function createFilterPrimitive(
|
||||
|
||||
function testDropShadow() {
|
||||
it('should parse string drop-shadow', () => {
|
||||
expect(processFilter('drop-shadow(4px 4 10px red)')).toEqual([
|
||||
expect(processFilter('drop-shadow(4px 4px 10px red)')).toEqual([
|
||||
{
|
||||
dropShadow: {
|
||||
offsetX: 4,
|
||||
@@ -246,7 +246,7 @@ function testDropShadow() {
|
||||
});
|
||||
|
||||
it('should parse string negative offsets drop-shadow', () => {
|
||||
expect(processFilter('drop-shadow(-4 -4)')).toEqual([
|
||||
expect(processFilter('drop-shadow(-4px -4px)')).toEqual([
|
||||
{
|
||||
dropShadow: {
|
||||
offsetX: -4,
|
||||
@@ -258,7 +258,9 @@ function testDropShadow() {
|
||||
|
||||
it('should parse string multiple drop-shadows', () => {
|
||||
expect(
|
||||
processFilter('drop-shadow(4 4) drop-shadow(4 4) drop-shadow(4 4)'),
|
||||
processFilter(
|
||||
'drop-shadow(4px 4px) drop-shadow(4px 4px) drop-shadow(4px 4px)',
|
||||
),
|
||||
).toEqual([
|
||||
{
|
||||
dropShadow: {
|
||||
@@ -283,7 +285,7 @@ function testDropShadow() {
|
||||
|
||||
it('should parse string drop-shadow with random whitespaces', () => {
|
||||
expect(
|
||||
processFilter(' drop-shadow(4px 4 10px red) '),
|
||||
processFilter(' drop-shadow(4px 4px 10px red) '),
|
||||
).toEqual([
|
||||
{
|
||||
dropShadow: {
|
||||
@@ -299,7 +301,7 @@ function testDropShadow() {
|
||||
it('should parse string drop-shadow with multiple filters', () => {
|
||||
expect(
|
||||
processFilter(
|
||||
'drop-shadow(4px 4 10px red) brightness(0.5) brightness(0.5)',
|
||||
'drop-shadow(4px 4px 10px red) brightness(0.5) brightness(0.5)',
|
||||
),
|
||||
).toEqual([
|
||||
{
|
||||
@@ -316,7 +318,7 @@ function testDropShadow() {
|
||||
});
|
||||
|
||||
it('should parse string drop-shadow with color', () => {
|
||||
expect(processFilter('drop-shadow(50 50 purple)')).toEqual([
|
||||
expect(processFilter('drop-shadow(50px 50px purple)')).toEqual([
|
||||
{
|
||||
dropShadow: {
|
||||
offsetX: 50,
|
||||
@@ -328,7 +330,7 @@ function testDropShadow() {
|
||||
});
|
||||
|
||||
it('should parse string drop-shadow with rgba color', () => {
|
||||
expect(processFilter('drop-shadow(50 50 rgba(0, 0, 0, 1))')).toEqual([
|
||||
expect(processFilter('drop-shadow(50px 50px rgba(0, 0, 0, 1))')).toEqual([
|
||||
{
|
||||
dropShadow: {
|
||||
offsetX: 50,
|
||||
@@ -340,7 +342,7 @@ function testDropShadow() {
|
||||
});
|
||||
|
||||
it('should parse string with mixed case drop-shadow', () => {
|
||||
expect(processFilter('DroP-sHaDOw(50 50 purple)')).toEqual([
|
||||
expect(processFilter('DroP-sHaDOw(50px 50px purple)')).toEqual([
|
||||
{
|
||||
dropShadow: {
|
||||
offsetX: 50,
|
||||
@@ -359,7 +361,7 @@ function testDropShadow() {
|
||||
offsetX: 4,
|
||||
offsetY: 4,
|
||||
color: '#FFFFFF',
|
||||
standardDeviation: '10',
|
||||
standardDeviation: '10px',
|
||||
},
|
||||
},
|
||||
]),
|
||||
@@ -376,7 +378,7 @@ function testDropShadow() {
|
||||
});
|
||||
|
||||
it('should fail to parse string comma separated drop-shadow', () => {
|
||||
expect(processFilter('drop-shadow(4px, 4, 10px, red)')).toEqual([]);
|
||||
expect(processFilter('drop-shadow(4px, 4px, 10px, red)')).toEqual([]);
|
||||
});
|
||||
|
||||
it('should fail to parse other symbols after args comma separated drop-shadow', () => {
|
||||
@@ -384,15 +386,15 @@ function testDropShadow() {
|
||||
});
|
||||
|
||||
it('should fail on color between lengths string drop-shadow', () => {
|
||||
expect(processFilter('drop-shadow(10 red 10 10')).toEqual([]);
|
||||
expect(processFilter('drop-shadow(10px red 10px 10px')).toEqual([]);
|
||||
});
|
||||
|
||||
it('should fail on color between offset & blur string drop-shadow', () => {
|
||||
expect(processFilter('drop-shadow(10 10 red 10')).toEqual([]);
|
||||
expect(processFilter('drop-shadow(10px 10px red 10px')).toEqual([]);
|
||||
});
|
||||
|
||||
it('should fail on negative blue', () => {
|
||||
expect(processFilter('drop-shadow(10 10 -10')).toEqual([]);
|
||||
expect(processFilter('drop-shadow(10px 10px -10px')).toEqual([]);
|
||||
});
|
||||
|
||||
it('should fail on invalid object drop-shadow', () => {
|
||||
|
||||
@@ -317,5 +317,9 @@ function parseLength(length: string): ?number {
|
||||
return null;
|
||||
}
|
||||
|
||||
if (match[3] == null && match[1] !== '0') {
|
||||
return null;
|
||||
}
|
||||
|
||||
return Number(match[1]);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user