Skip to content

Commit 6babbf7

Browse files
birkskyumautofix-ci[bot]brenelzSeanCassiere
authored andcommitted
feat(solid-router): Add a SolidJS driver for TanStack Router (#3276)
* copy react-router * update * Move forward branch * cleanup * cleanup * add publish * bump deps * ci: apply automated fixes * remove unused imports * ci: apply automated fixes * bump vite plugin solid * fix imports * ci: apply automated fixes * remove react lint from solid-router * fix types * ci: apply automated fixes * add structuralSharing * downgrade vite plugin solid * fix scroll-restoration in solid-router * fix Transitioner * fix imports from ScrollRestoration * Fix tests * Fix more tests * Remove the react $$typeof * add accessors to useLocation * add remountDeps * cleanup * remove tanstack/store * format * add missing call to setupScrollRestoration * format * add optional * align match component * make matches a signal * Bump vite-plugin-solid to stable * add missing await * Fix unknown error * Tweak the tests to call functions * remove unused vars * fix lockfile * Down to 25 failures * Remove .only * call search() * remove the structuralSharing * fix type test * fix structuralSharing * comment out structured sharing validation check * fix typings * comment out serialization check * comment out serialization check * cleanup * improve types of useSearch * fix "when setting search params with 2 parallel navigate calls" * fix useParams * fix types * fix useParams types * cleanup debug * fix link data loader * fix data loader signal * fix type test * fix Link "when navigating away from a route with a loader that errors" * setup on() simpler * make initial load a createRenderEffect * Fix some link preload tests * add accessor to UseMatchRoute * fix: when navigating to /posts with a beforeLoad that returns context * call parentRouteId * re-enable invariant * fix when navigating from /invoices to ./invoiceId and the current route is /posts/$postId/details * use memo for prev * remove browserhistory workaround * fix "after a navigation, should have emitted the "onResolved" event twice" * skip remount * add types to useSearch * fix search middleware * don't need a getter * sync react-router * solid kitchen sink * add the example to workspace * lockfile * fix solid kitchensink name * add solid template * fix example * rename react to solid * work on example * add accessor * fix type tests * Fix login in example * Don't destructure * Fix stuck on pending component * Fix where loaderData can be undefined * Use For component * More refactor * Hacky way to fix loading spinner * Fix one test * Better MatchRoute fix * Down to 1 failing test * Fix last test * cleanup subscription * lockfile * eslint * ci: apply automated fixes * fix router-core lint * ci: apply automated fixes * add e2e test for solid-router * ci: apply automated fixes * work on solid-router e2e suites * fix comment * use solid-virtualizer * work on scroll-restauration * work on scroll-restauration * skip react-specific useRenderEffect test * fix errorcomponent being used before it's defined * set solid target for esbuild * ci: apply automated fixes * fix rspack tests * fix query tets * add solid-query example * use memo for post * add memo for posts * fix example * add jsx compiler flags to esbuild commands * add esbuild-plugin-solid * Fix some e2e * ci: apply automated fixes * port #3423 from react-router * fix useLoaderData test-d * add codeSplitGroupings * Scroll restoration fixes * add asset headcontent script * remove solid-router-copy * fix react use * fix scroll restoration test * skip esbuild because it's broken in react-router * wait for timeout * update scroll-restoration to match react * useLocation * use on() in match * align useNavigate with react-router * lockfile * fix Scripts test * align __TSR_SSR__ in ScriptOnce * remove solid-router from publish * lint * ci: apply automated fixes * align to react-router * port over "exclude props from state equality check to prevent history push for equal url and state" * align with react-router * add shouldThrow * fix typePrimitives * use searchStr to fix the search middleware * ci: add solid-router to the labeler * use patched vite-plugin-solid * eslint * ci: apply automated fixes * use vite-plugin-solid 2.11.2 * remove only modifier * move vite-plugin-solid peerDep to router-plugin * use latest vite-plugin-solid * move vitest to root * bump vitest * revert onRendered * lint * add to publish * fix scroll restoration * ci: apply automated fixes * align version with react-router * sync to react-router * sync with react-router * sync navigate tests to react-router * ci: apply automated fixes * use Solid.JSX.Element consistently instead of Solid.JSXElement * remove irrelevant test * ci: apply automated fixes * remove unused suite * lint --------- Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com> Co-authored-by: Brenley Dueck <brenleydueck@gmail.com> Co-authored-by: SeanCassiere <33615041+SeanCassiere@users.noreply.github.com>
1 parent c2d5043 commit 6babbf7

File tree

434 files changed

+46743
-72
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

434 files changed

+46743
-72
lines changed

.github/labeler.yml

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,8 @@
3232
- 'packages/router-vite-plugin/**/*'
3333
'package: server-functions-plugin':
3434
- 'packages/server-functions-plugin/**/*'
35+
'package: solid-router':
36+
- 'packages/solid-router/**/*'
3537
'package: start':
3638
- 'packages/start/**/*'
3739
'package: start-api-routes':
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
node_modules
2+
.DS_Store
3+
dist
4+
dist-ssr
5+
*.local
6+
7+
/test-results/
8+
/playwright-report/
9+
/blob-report/
10+
/playwright/.cache/
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>Vite App</title>
7+
<script src="https://unpkg.com/@tailwindcss/browser@4"></script>
8+
<style type="text/tailwindcss">
9+
html {
10+
color-scheme: light dark;
11+
}
12+
* {
13+
@apply border-gray-200 dark:border-gray-800;
14+
}
15+
body {
16+
@apply bg-gray-50 text-gray-950 dark:bg-gray-900 dark:text-gray-200;
17+
}
18+
</style>
19+
</head>
20+
<body>
21+
<div id="app"></div>
22+
<script type="module" src="/dist/main.js"></script>
23+
</body>
24+
</html>
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
{
2+
"name": "tanstack-router-e2e-solid-basic-esbuild-file-based",
3+
"private": true,
4+
"type": "module",
5+
"scripts": {
6+
"dev": "esbuild src/main.tsx --jsx=preserve --jsx-import-source=solid-js --serve=5601 --bundle --outfile=dist/main.js --watch --servedir=.",
7+
"build": "esbuild src/main.tsx --jsx=preserve --jsx-import-source=solid-js --bundle --outfile=dist/main.js && tsc --noEmit",
8+
"serve": "esbuild src/main.tsx --jsx=preserve --jsx-import-source=solid-js --bundle --outfile=dist/main.js --servedir=.",
9+
"start": "dev",
10+
"test:e2e": "playwright test --project=chromium"
11+
},
12+
"dependencies": {
13+
"@tanstack/router-plugin": "workspace:^",
14+
"@tanstack/solid-router": "workspace:^",
15+
"@tanstack/zod-adapter": "workspace:^",
16+
"redaxios": "^0.5.1",
17+
"solid-js": "^1.9.4",
18+
"zod": "^3.24.1"
19+
},
20+
"devDependencies": {
21+
"@playwright/test": "^1.50.1",
22+
"@tanstack/router-e2e-utils": "workspace:^",
23+
"esbuild": "^0.25.0",
24+
"esbuild-plugin-solid": "^0.6.0"
25+
}
26+
}
Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import { defineConfig, devices } from '@playwright/test'
2+
import { derivePort } from '@tanstack/router-e2e-utils'
3+
import packageJson from './package.json' with { type: 'json' }
4+
5+
const PORT = derivePort(packageJson.name)
6+
const baseURL = `http://localhost:${PORT}`
7+
/**
8+
* See https://playwright.dev/docs/test-configuration.
9+
*/
10+
export default defineConfig({
11+
testDir: './tests',
12+
workers: 1,
13+
14+
reporter: [['line']],
15+
16+
use: {
17+
/* Base URL to use in actions like `await page.goto('/')`. */
18+
baseURL,
19+
},
20+
21+
webServer: {
22+
command: `pnpm run build && pnpm run serve --serve=${PORT}`,
23+
url: baseURL,
24+
reuseExistingServer: !process.env.CI,
25+
stdout: 'pipe',
26+
},
27+
28+
projects: [
29+
{
30+
name: 'chromium',
31+
use: { ...devices['Desktop Chrome'] },
32+
},
33+
],
34+
})
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import { TanStackRouterEsbuild } from '@tanstack/router-plugin/esbuild'
2+
import { solidPlugin } from 'esbuild-plugin-solid'
3+
4+
export default {
5+
// ...
6+
plugins: [
7+
TanStackRouterEsbuild({
8+
target: 'solid',
9+
autoCodeSplitting: true,
10+
}),
11+
solidPlugin(),
12+
],
13+
}
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import { render } from 'solid-js/web'
2+
import { RouterProvider, createRouter } from '@tanstack/solid-router'
3+
import { routeTree } from './routeTree.gen'
4+
5+
// Set up a Router instance
6+
const router = createRouter({
7+
routeTree,
8+
defaultPreload: 'intent',
9+
defaultStaleTime: 5000,
10+
scrollRestoration: true,
11+
})
12+
13+
// Register things for typesafety
14+
declare module '@tanstack/solid-router' {
15+
interface Register {
16+
router: typeof router
17+
}
18+
}
19+
20+
const rootElement = document.getElementById('app')!
21+
22+
if (!rootElement.innerHTML) {
23+
render(() => <RouterProvider router={router} />, rootElement)
24+
}
Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { notFound } from '@tanstack/solid-router'
2+
import axios from 'redaxios'
3+
4+
export type PostType = {
5+
id: string
6+
title: string
7+
body: string
8+
}
9+
10+
export const fetchPost = async (postId: string) => {
11+
console.info(`Fetching post with id ${postId}...`)
12+
await new Promise((r) => setTimeout(r, 500))
13+
const post = await axios
14+
.get<PostType>(`https://jsonplaceholder.typicode.com/posts/${postId}`)
15+
.then((r) => r.data)
16+
.catch((err) => {
17+
if (err.status === 404) {
18+
throw notFound()
19+
}
20+
throw err
21+
})
22+
23+
return post
24+
}
25+
26+
export const fetchPosts = async () => {
27+
console.info('Fetching posts...')
28+
await new Promise((r) => setTimeout(r, 500))
29+
return axios
30+
.get<Array<PostType>>('https://jsonplaceholder.typicode.com/posts')
31+
.then((r) => r.data.slice(0, 10))
32+
}

0 commit comments

Comments
 (0)