Skip to content

Commit

Permalink
Fix UnitControl crashing on regex control characters.
Browse files Browse the repository at this point in the history
Units are now escaped using `escapeRegExp` before concatenating them into a regular expression.

Fixes #52211.
---------

Co-authored-by: Mitchell Austin <mr.fye@oneandthesame.net>
  • Loading branch information
TimothyBJacobs and stokesman authored Jul 3, 2023
1 parent 96a8929 commit 4090d21
Show file tree
Hide file tree
Showing 3 changed files with 9 additions and 4 deletions.
1 change: 1 addition & 0 deletions packages/components/CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@
- `ZStack`: ZStack: fix component bounding box to match children ([#51836](https://github.com/WordPress/gutenberg/pull/51836)).
- `Modal`: Add small top padding to the content so that avoid cutting off the visible outline when hovering items ([#51829](https://github.com/WordPress/gutenberg/pull/51829)).
- `DropdownMenu`: fix icon style when dashicon is used ([#43574](https://github.com/WordPress/gutenberg/pull/43574)).
- `UnitControl`: Fix crash when certain units are used ([#52211](https://github.com/WordPress/gutenberg/pull/52211)).

## 25.2.0 (2023-06-23)

Expand Down
5 changes: 3 additions & 2 deletions packages/components/src/unit-control/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ import {
getValidParsedQuantityAndUnit,
} from './utils';
import { useControlledState } from '../utils/hooks';
import { escapeRegExp } from '../utils/strings';
import type { UnitControlProps, UnitControlOnChangeCallback } from './types';

function UnforwardedUnitControl(
Expand Down Expand Up @@ -76,9 +77,9 @@ function UnforwardedUnitControl(
);
const [ { value: firstUnitValue = '' } = {}, ...rest ] = list;
const firstCharacters = rest.reduce( ( carry, { value } ) => {
const first = value?.substring( 0, 1 ) || '';
const first = escapeRegExp( value?.substring( 0, 1 ) || '' );
return carry.includes( first ) ? carry : `${ carry }|${ first }`;
}, firstUnitValue.substring( 0, 1 ) );
}, escapeRegExp( firstUnitValue.substring( 0, 1 ) ) );
return [ list, new RegExp( `^(?:${ firstCharacters })$`, 'i' ) ];
}, [ nonNullValueProp, unitProp, unitsProp ] );
const [ parsedQuantity, parsedUnit ] = getParsedQuantityAndUnit(
Expand Down
7 changes: 5 additions & 2 deletions packages/components/src/unit-control/test/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -373,18 +373,21 @@ describe( 'UnitControl', () => {
const units = [
{ value: 'pt', label: 'pt', default: 0 },
{ value: 'vmax', label: 'vmax', default: 10 },
// Proves that units with regex control characters don't error.
{ value: '+', label: '+', default: 10 },
];

render( <UnitControl units={ units } /> );

const options = getSelectOptions();

expect( options.length ).toBe( 2 );
expect( options.length ).toBe( 3 );

const [ pt, vmax ] = options;
const [ pt, vmax, plus ] = options;

expect( pt.value ).toBe( 'pt' );
expect( vmax.value ).toBe( 'vmax' );
expect( plus.value ).toBe( '+' );
} );

it( 'should reset value on unit change, if unit has default value', async () => {
Expand Down

1 comment on commit 4090d21

@github-actions
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Flaky tests detected in 4090d21.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/5446413898
📝 Reported issues:

Please sign in to comment.