diff --git a/packages/e2e-tests/plugins/interactive-blocks/router-navigate/render.php b/packages/e2e-tests/plugins/interactive-blocks/router-navigate/render.php index 7213dbfe0dccc..683e0eaff6e89 100644 --- a/packages/e2e-tests/plugins/interactive-blocks/router-navigate/render.php +++ b/packages/e2e-tests/plugins/interactive-blocks/router-navigate/render.php @@ -31,6 +31,12 @@ data-wp-on--click="actions.router.navigate" href="$link" >link $i + link $i with hash HTML; } } diff --git a/packages/e2e-tests/plugins/interactive-blocks/router-navigate/view.js b/packages/e2e-tests/plugins/interactive-blocks/router-navigate/view.js index d1da34604c7b7..468b4a64482d3 100644 --- a/packages/e2e-tests/plugins/interactive-blocks/router-navigate/view.js +++ b/packages/e2e-tests/plugins/interactive-blocks/router-navigate/view.js @@ -19,7 +19,9 @@ state.router.navigations += 1; state.router.status = 'busy'; - await navigate( e.target.href ); + const force = e.target.dataset.forceNavigation === 'true'; + + await navigate( e.target.href, { force } ); state.router.navigations -= 1; diff --git a/test/e2e/specs/interactivity/router-navigate.spec.ts b/test/e2e/specs/interactivity/router-navigate.spec.ts index f3166f99a7de7..308bc6fd98618 100644 --- a/test/e2e/specs/interactivity/router-navigate.spec.ts +++ b/test/e2e/specs/interactivity/router-navigate.spec.ts @@ -74,4 +74,56 @@ test.describe( 'Router navigate', () => { await expect( status ).toHaveText( 'idle' ); await expect( title ).toHaveText( 'Link 2' ); } ); + + test( 'should update the URL from the last navigation if only varies in the URL fragment', async ( { + page, + interactivityUtils: utils, + } ) => { + const link1 = utils.getLink( 'router navigate - link 1' ); + + const navigations = page.getByTestId( 'router navigations' ); + const status = page.getByTestId( 'router status' ); + const title = page.getByTestId( 'title' ); + + await expect( navigations ).toHaveText( '0' ); + await expect( status ).toHaveText( 'idle' ); + + const resolvers: Function[] = []; + + await page.route( link1, async ( route ) => { + await new Promise( ( r ) => resolvers.push( r ) ); + await route.continue(); + } ); + + await page.getByTestId( 'link 1' ).click(); + await page.getByTestId( 'link 1 with hash' ).click(); + + const href = ( await page + .getByTestId( 'link 1 with hash' ) + .getAttribute( 'href' ) ) as string; + + await expect( navigations ).toHaveText( '2' ); + await expect( status ).toHaveText( 'busy' ); + await expect( title ).toHaveText( 'Main' ); + + { + const resolver = resolvers.pop(); + if ( resolver ) resolver(); + } + + await expect( navigations ).toHaveText( '1' ); + await expect( status ).toHaveText( 'busy' ); + await expect( title ).toHaveText( 'Link 1' ); + await expect( page ).toHaveURL( href ); + + { + const resolver = resolvers.pop(); + if ( resolver ) resolver(); + } + + await expect( navigations ).toHaveText( '0' ); + await expect( status ).toHaveText( 'idle' ); + await expect( title ).toHaveText( 'Link 1' ); + await expect( page ).toHaveURL( href ); + } ); } );