diff --git a/packages/react-router/tests/link.test.tsx b/packages/react-router/tests/link.test.tsx index 764f7f40d3a..273d94b92c8 100644 --- a/packages/react-router/tests/link.test.tsx +++ b/packages/react-router/tests/link.test.tsx @@ -360,6 +360,10 @@ describe('Link', () => { // navigate to /?foo=bar await act(() => fireEvent.click(indexFooBarLink)) + await waitFor(() => { + expect(indexFooBarLink).toHaveClass('active') + }) + expect(indexExactLink).toHaveClass('inactive') expect(indexExactLink).not.toHaveClass('active') expect(indexExactLink).toHaveAttribute('href', '/') diff --git a/packages/react-router/tests/optional-path-params.test.tsx b/packages/react-router/tests/optional-path-params.test.tsx index e5df289c825..59924e219f5 100644 --- a/packages/react-router/tests/optional-path-params.test.tsx +++ b/packages/react-router/tests/optional-path-params.test.tsx @@ -1,5 +1,12 @@ import { afterEach, describe, expect, it, vi } from 'vitest' -import { act, cleanup, fireEvent, render, screen } from '@testing-library/react' +import { + act, + cleanup, + fireEvent, + render, + screen, + waitFor, +} from '@testing-library/react' import { Link, Outlet, @@ -639,17 +646,22 @@ describe('React Router - Optional Path Parameters', () => { // Test navigation scenarios const navigateAll = await screen.findByTestId('navigate-all') - const navigateTech = await screen.findByTestId('navigate-tech') - const navigateSpecific = await screen.findByTestId('navigate-specific') - - fireEvent.click(navigateAll) - expect(router.state.location.pathname).toBe('/posts') + await fireEvent.click(navigateAll) + await waitFor(() => { + expect(router.state.location.pathname).toBe('/posts') + }) - fireEvent.click(navigateTech) - expect(router.state.location.pathname).toBe('/posts/tech') + const navigateTech = await screen.findByTestId('navigate-tech') + await fireEvent.click(navigateTech) + await waitFor(() => { + expect(router.state.location.pathname).toBe('/posts/tech') + }) - fireEvent.click(navigateSpecific) - expect(router.state.location.pathname).toBe('/posts/tech/hello-world') + const navigateSpecific = await screen.findByTestId('navigate-specific') + await fireEvent.click(navigateSpecific) + await waitFor(() => { + expect(router.state.location.pathname).toBe('/posts/tech/hello-world') + }) }) it('should handle relative navigation with optional parameters', async () => { diff --git a/packages/solid-router/tests/link.test.tsx b/packages/solid-router/tests/link.test.tsx index ce6d1b0682d..4617fef98c5 100644 --- a/packages/solid-router/tests/link.test.tsx +++ b/packages/solid-router/tests/link.test.tsx @@ -393,6 +393,10 @@ describe('Link', () => { // navigate to /?foo=bar fireEvent.click(indexFooBarLink) + await waitFor(() => { + expect(indexFooBarLink).toHaveClass('active') + }) + expect(indexExactLink).toHaveClass('inactive') expect(indexExactLink).not.toHaveClass('active') expect(indexExactLink).toHaveAttribute('href', '/') diff --git a/packages/solid-router/tests/optional-path-params.test.tsx b/packages/solid-router/tests/optional-path-params.test.tsx index 76c0f8311cb..a1c7b6f79db 100644 --- a/packages/solid-router/tests/optional-path-params.test.tsx +++ b/packages/solid-router/tests/optional-path-params.test.tsx @@ -647,17 +647,22 @@ describe('Solid Router - Optional Path Parameters', () => { // Test navigation scenarios const navigateAll = await screen.findByTestId('navigate-all') - const navigateTech = await screen.findByTestId('navigate-tech') - const navigateSpecific = await screen.findByTestId('navigate-specific') - - fireEvent.click(navigateAll) - expect(router.state.location.pathname).toBe('/posts') + await fireEvent.click(navigateAll) + await waitFor(() => { + expect(router.state.location.pathname).toBe('/posts') + }) - fireEvent.click(navigateTech) - expect(router.state.location.pathname).toBe('/posts/tech') + const navigateTech = await screen.findByTestId('navigate-tech') + await fireEvent.click(navigateTech) + await waitFor(() => { + expect(router.state.location.pathname).toBe('/posts/tech') + }) - fireEvent.click(navigateSpecific) - expect(router.state.location.pathname).toBe('/posts/tech/hello-world') + const navigateSpecific = await screen.findByTestId('navigate-specific') + await fireEvent.click(navigateSpecific) + await waitFor(() => { + expect(router.state.location.pathname).toBe('/posts/tech/hello-world') + }) }) it('should handle relative navigation with optional parameters', async () => {