diff --git a/e2e/react-router/basic-react-query-file-based/src/routes/transition/count/query.tsx b/e2e/react-router/basic-react-query-file-based/src/routes/transition/count/query.tsx deleted file mode 100644 index 5bd2ff4341a..00000000000 --- a/e2e/react-router/basic-react-query-file-based/src/routes/transition/count/query.tsx +++ /dev/null @@ -1,55 +0,0 @@ -import { Link, createFileRoute } from '@tanstack/react-router' -import { Suspense } from 'react' -import { queryOptions, useQuery } from '@tanstack/react-query' -import { z } from 'zod' - -const searchSchema = z.object({ - n: z.number().default(1), -}) - -const doubleQueryOptions = (n: number) => - queryOptions({ - queryKey: ['transition-double', n], - queryFn: async () => { - await new Promise((resolve) => setTimeout(resolve, 1000)) - return { n, double: n * 2 } - }, - placeholderData: (oldData) => oldData, - }) - -export const Route = createFileRoute('/transition/count/query')({ - validateSearch: searchSchema, - loader: ({ context: { queryClient }, location }) => { - const { n } = searchSchema.parse(location.search) - return queryClient.ensureQueryData(doubleQueryOptions(n)) - }, - component: TransitionPage, -}) - -function TransitionPage() { - const search = Route.useSearch() - - const doubleQuery = useQuery(doubleQueryOptions(search.n)) - - return ( - -
- ({ n: s.n + 1 })} - > - Increase - - -
-
n: {doubleQuery.data?.n}
-
- double: {doubleQuery.data?.double} -
-
-
-
- ) -} diff --git a/e2e/react-router/basic-react-query-file-based/tests/transition.spec.ts b/e2e/react-router/basic-react-query-file-based/tests/transition.spec.ts deleted file mode 100644 index 27ea079ca4e..00000000000 --- a/e2e/react-router/basic-react-query-file-based/tests/transition.spec.ts +++ /dev/null @@ -1,95 +0,0 @@ -import { expect, test } from '@playwright/test' - -test('transitions/count/query should keep old values visible during navigation', async ({ - page, -}) => { - await page.goto('/transition/count/query') - - await expect(page.getByTestId('n-value')).toContainText('n: 1') - await expect(page.getByTestId('double-value')).toContainText('double: 2') - - const bodyTexts: Array = [] - - const pollInterval = setInterval(async () => { - const text = await page - .locator('body') - .textContent() - .catch(() => '') - if (text) bodyTexts.push(text) - }, 50) - - // 1 click - - page.getByTestId('increase-button').click() - - await expect(page.getByTestId('n-value')).toContainText('n: 1', { - timeout: 2_000, - }) - await expect(page.getByTestId('double-value')).toContainText('double: 2', { - timeout: 2_000, - }) - - await page.waitForTimeout(200) - - await expect(page.getByTestId('n-value')).toContainText('n: 2', { - timeout: 2000, - }) - await expect(page.getByTestId('double-value')).toContainText('double: 4', { - timeout: 2000, - }) - - // 2 clicks - - page.getByTestId('increase-button').click() - page.getByTestId('increase-button').click() - - await expect(page.getByTestId('n-value')).toContainText('n: 2', { - timeout: 2000, - }) - await expect(page.getByTestId('double-value')).toContainText('double: 4', { - timeout: 2000, - }) - - await page.waitForTimeout(200) - - await expect(page.getByTestId('n-value')).toContainText('n: 4', { - timeout: 2000, - }) - await expect(page.getByTestId('double-value')).toContainText('double: 8', { - timeout: 2000, - }) - - // 3 clicks - - page.getByTestId('increase-button').click() - page.getByTestId('increase-button').click() - page.getByTestId('increase-button').click() - - await expect(page.getByTestId('n-value')).toContainText('n: 4', { - timeout: 2000, - }) - await expect(page.getByTestId('double-value')).toContainText('double: 8', { - timeout: 2000, - }) - - await page.waitForTimeout(200) - - await expect(page.getByTestId('n-value')).toContainText('n: 7', { - timeout: 2000, - }) - await expect(page.getByTestId('double-value')).toContainText('double: 14', { - timeout: 2000, - }) - - clearInterval(pollInterval) - - // With proper transitions, old values should remain visible until new ones arrive - const hasLoadingText = bodyTexts.some((text) => text.includes('Loading...')) - - if (hasLoadingText) { - throw new Error( - 'FAILED: "Loading..." appeared during navigation. ' + - 'Solid Router should use transitions to keep old values visible.', - ) - } -}) diff --git a/e2e/solid-router/basic-solid-query-file-based/src/routes/transition/count/query.tsx b/e2e/solid-router/basic-solid-query-file-based/src/routes/transition/count/query.tsx deleted file mode 100644 index 256b097dd94..00000000000 --- a/e2e/solid-router/basic-solid-query-file-based/src/routes/transition/count/query.tsx +++ /dev/null @@ -1,55 +0,0 @@ -import { Link, createFileRoute } from '@tanstack/solid-router' -import { Suspense } from 'solid-js' -import { queryOptions, useQuery } from '@tanstack/solid-query' -import { z } from 'zod' - -const searchSchema = z.object({ - n: z.number().default(1), -}) - -const doubleQueryOptions = (n: number) => - queryOptions({ - queryKey: ['transition-double', n], - queryFn: async () => { - await new Promise((resolve) => setTimeout(resolve, 1000)) - return { n, double: n * 2 } - }, - placeholderData: (oldData) => oldData, - }) - -export const Route = createFileRoute('/transition/count/query')({ - validateSearch: searchSchema, - loader: ({ context: { queryClient }, location }) => { - const { n } = searchSchema.parse(location.search) - return queryClient.ensureQueryData(doubleQueryOptions(n)) - }, - component: TransitionPage, -}) - -function TransitionPage() { - const search = Route.useSearch() - - const doubleQuery = useQuery(() => doubleQueryOptions(search().n)) - - return ( - -
- ({ n: s.n + 1 })} - > - Increase - - -
-
n: {doubleQuery.data?.n}
-
- double: {doubleQuery.data?.double} -
-
-
-
- ) -} diff --git a/e2e/solid-router/basic-solid-query-file-based/tests/transition.spec.ts b/e2e/solid-router/basic-solid-query-file-based/tests/transition.spec.ts deleted file mode 100644 index 27ea079ca4e..00000000000 --- a/e2e/solid-router/basic-solid-query-file-based/tests/transition.spec.ts +++ /dev/null @@ -1,95 +0,0 @@ -import { expect, test } from '@playwright/test' - -test('transitions/count/query should keep old values visible during navigation', async ({ - page, -}) => { - await page.goto('/transition/count/query') - - await expect(page.getByTestId('n-value')).toContainText('n: 1') - await expect(page.getByTestId('double-value')).toContainText('double: 2') - - const bodyTexts: Array = [] - - const pollInterval = setInterval(async () => { - const text = await page - .locator('body') - .textContent() - .catch(() => '') - if (text) bodyTexts.push(text) - }, 50) - - // 1 click - - page.getByTestId('increase-button').click() - - await expect(page.getByTestId('n-value')).toContainText('n: 1', { - timeout: 2_000, - }) - await expect(page.getByTestId('double-value')).toContainText('double: 2', { - timeout: 2_000, - }) - - await page.waitForTimeout(200) - - await expect(page.getByTestId('n-value')).toContainText('n: 2', { - timeout: 2000, - }) - await expect(page.getByTestId('double-value')).toContainText('double: 4', { - timeout: 2000, - }) - - // 2 clicks - - page.getByTestId('increase-button').click() - page.getByTestId('increase-button').click() - - await expect(page.getByTestId('n-value')).toContainText('n: 2', { - timeout: 2000, - }) - await expect(page.getByTestId('double-value')).toContainText('double: 4', { - timeout: 2000, - }) - - await page.waitForTimeout(200) - - await expect(page.getByTestId('n-value')).toContainText('n: 4', { - timeout: 2000, - }) - await expect(page.getByTestId('double-value')).toContainText('double: 8', { - timeout: 2000, - }) - - // 3 clicks - - page.getByTestId('increase-button').click() - page.getByTestId('increase-button').click() - page.getByTestId('increase-button').click() - - await expect(page.getByTestId('n-value')).toContainText('n: 4', { - timeout: 2000, - }) - await expect(page.getByTestId('double-value')).toContainText('double: 8', { - timeout: 2000, - }) - - await page.waitForTimeout(200) - - await expect(page.getByTestId('n-value')).toContainText('n: 7', { - timeout: 2000, - }) - await expect(page.getByTestId('double-value')).toContainText('double: 14', { - timeout: 2000, - }) - - clearInterval(pollInterval) - - // With proper transitions, old values should remain visible until new ones arrive - const hasLoadingText = bodyTexts.some((text) => text.includes('Loading...')) - - if (hasLoadingText) { - throw new Error( - 'FAILED: "Loading..." appeared during navigation. ' + - 'Solid Router should use transitions to keep old values visible.', - ) - } -})