Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Navigator Screen: warn if path doesn't follow a URL-like scheme #65231

Merged
merged 3 commits into from
Sep 11, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions packages/components/CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@

### Enhancements

- `Navigator`: warn if a screen's `path` doesn't follow a URL-like scheme ([#65231](https://github.com/WordPress/gutenberg/pull/65231)).
- `Modal`: Decrease close button size and remove horizontal offset ([#65131](https://github.com/WordPress/gutenberg/pull/65131)).

### Internal
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import {
import { useMergeRefs } from '@wordpress/compose';
import { isRTL as isRTLFn } from '@wordpress/i18n';
import { escapeAttribute } from '@wordpress/escape-html';
import warning from '@wordpress/warning';

/**
* Internal dependencies
Expand All @@ -33,6 +34,12 @@ function UnconnectedNavigatorScreen(
props: WordPressComponentProps< NavigatorScreenProps, 'div', false >,
forwardedRef: ForwardedRef< any >
) {
if ( ! /^\//.test( props.path ) ) {
warning(
'wp.components.NavigatorScreen: the `path` should follow a URL-like scheme; it should start with and be separated by the `/` character.'
);
}

const screenId = useId();
const { children, className, path, ...otherProps } = useContextSystem(
props,
Expand Down
8 changes: 8 additions & 0 deletions packages/components/src/navigator/test/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -642,6 +642,14 @@ describe( 'Navigator', () => {
).toHaveAttribute( 'id', INVALID_HTML_ATTRIBUTE.escaped );
} );

it( 'should warn if the `path` prop does not follow the required format', () => {
render( <NavigatorScreen path="not-valid">Test</NavigatorScreen> );

expect( console ).toHaveWarnedWith(
'wp.components.NavigatorScreen: the `path` should follow a URL-like scheme; it should start with and be separated by the `/` character.'
);
} );

it( 'should match correctly paths with named arguments', async () => {
const user = userEvent.setup();

Expand Down
Loading