From 0a27fc2d977d19d7fce169eb6e8c6c39c6c33272 Mon Sep 17 00:00:00 2001 From: Ryan Carniato Date: Thu, 2 Feb 2023 21:29:18 -0800 Subject: [PATCH] better csr fix --- docs/api/createServerAction.md | 4 +- docs/api/createServerData.md | 2 + docs/api/createServerMultiAction.md | 1 + docs/api/server.md | 4 +- docs/api/vite.md | 2 +- .../DevRoot.tsx => dev/CsrRoot.tsx} | 0 packages/start/entry-server/StartServer.tsx | 5 +- packages/start/vite/plugin.js | 81 +++++++------------ test/api-routes-test.ts | 50 ++++++------ test/misc-test.ts | 6 +- 10 files changed, 69 insertions(+), 86 deletions(-) rename packages/start/{entry-server/DevRoot.tsx => dev/CsrRoot.tsx} (100%) diff --git a/docs/api/createServerAction.md b/docs/api/createServerAction.md index 283a26d19..186521143 100644 --- a/docs/api/createServerAction.md +++ b/docs/api/createServerAction.md @@ -69,4 +69,6 @@ We return a `redirect` to tell the browser where to go upon successful submissio ## Reference -Refer to [createRouteAction](./createRouteAction) for API reference. \ No newline at end of file +Refer to [createRouteAction](./createRouteAction) for API reference. + +*Note: createServerAction$ does not work when application is configured to `ssr: false`* \ No newline at end of file diff --git a/docs/api/createServerData.md b/docs/api/createServerData.md index ba657eae0..25c68ac0b 100644 --- a/docs/api/createServerData.md +++ b/docs/api/createServerData.md @@ -240,3 +240,5 @@ export function routeData() { Refer to [createRouteData](./createRouteData) for API reference. +*Note: `createServerData$` does not work when application is configured to `ssr: false`* + diff --git a/docs/api/createServerMultiAction.md b/docs/api/createServerMultiAction.md index d552a3ed4..3e0508148 100644 --- a/docs/api/createServerMultiAction.md +++ b/docs/api/createServerMultiAction.md @@ -34,3 +34,4 @@ const [acting, act] = createServerMultiAction$(async (args) => { Refer to [createRouteMultiAction](./createRouteMultiAction) for API reference. +*Note: `createServerMultiAction$` does not work when application is configured to `ssr: false`* \ No newline at end of file diff --git a/docs/api/server.md b/docs/api/server.md index 08dd2df6c..1daecbbf4 100644 --- a/docs/api/server.md +++ b/docs/api/server.md @@ -50,7 +50,7 @@ const serverFunction1 = server$.createFetcher('/Log.tsx/logHello') function Component() { const logHello = serverFunction1; - + logHello('Hello') } ``` @@ -75,3 +75,5 @@ function Component() { logHello('Hello') } ``` + +*Note server$ do not work when application is configured to `ssr: false`* diff --git a/docs/api/vite.md b/docs/api/vite.md index 6eb902238..216252bb7 100644 --- a/docs/api/vite.md +++ b/docs/api/vite.md @@ -76,6 +76,6 @@ The vite plugin exposes the following options: - `serverEntry` (_string_, default `"./entry-server.tsx"`): the file path where to the server entry. - `prerenderRoutes` (_string[]_, default `[]`): list of route paths to prerender (currently only works with static adapter). - `inspect` (_boolean_, default `true`): turns on whether vite inspect plugin is enabled. -- `ssr` (_boolean_, default `true`): toggles between client rendering and server rendering (ssr) mode. +- `ssr` (_boolean_, default `true`): toggles between client rendering and server rendering (ssr) mode. `server$` functions do not work with `ssr: false`. - `islands` (_boolean_, default `false`): _experimental_ toggles on "islands" mode. - `islandsRouter` (_boolean_, default `false`): _experimental_ toggles on hybrid "islands" routing. diff --git a/packages/start/entry-server/DevRoot.tsx b/packages/start/dev/CsrRoot.tsx similarity index 100% rename from packages/start/entry-server/DevRoot.tsx rename to packages/start/dev/CsrRoot.tsx diff --git a/packages/start/entry-server/StartServer.tsx b/packages/start/entry-server/StartServer.tsx index b41e810eb..2ded03d48 100644 --- a/packages/start/entry-server/StartServer.tsx +++ b/packages/start/entry-server/StartServer.tsx @@ -6,11 +6,10 @@ import { ssr } from "solid-js/web"; import Root from "~start/root"; import { RouteDefinition, Router as IslandsRouter } from "../islands/server-router"; -import { fileRoutes } from "../root/FileRoutes"; +import { fileRoutes } from "../root/FileRoutes"; import { ServerContext } from "../server/ServerContext"; import { FetchEvent, PageEvent } from "../server/types"; -import DevRoot from "./DevRoot"; const rootData = Object.values(import.meta.glob("/src/root.data.(js|ts)", { eager: true }))[0] as { default: RouteDataFunc; @@ -83,7 +82,7 @@ export default function StartServer({ event }: { event: PageEvent }) { return ( {devNoSSR ? ( - + ) : ( ["tags"]}> v) { } } + /** * @returns {import('vite').Plugin} * @param {any} options @@ -640,42 +650,6 @@ function solidStartConfig(options) { }; } -/** - * @param {string} locate - * @param {string} [cwd] - * @returns {string | undefined} - */ -function find(locate, cwd) { - cwd = cwd || process.cwd(); - if (cwd.split(path.sep).length < 2) return undefined; - const found = fs.readdirSync(cwd).some(f => f === locate); - if (found) return path.join(cwd, locate); - return find(locate, path.join(cwd, "..")); -} - -// const nodeModulesPath = find("node_modules", process.cwd()); - -// function detectAdapter() { -// let adapters = []; -// fs.readdirSync(nodeModulesPath).forEach(dir => { -// if (dir.startsWith("solid-start-")) { -// const pkg = JSON.parse( -// fs.readFileSync(path.join(nodeModulesPath, dir, "package.json"), { -// encoding: "utf8" -// }) -// ); -// if (pkg.solid && pkg.solid.type === "adapter") { -// adapters.push(dir); -// } -// } -// }); - -// // Ignore the default adapter. -// adapters = adapters.filter(adapter => adapter !== "solid-start-node"); - -// return adapters.length > 0 ? adapters[0] : "solid-start-node"; -// } - const findAny = (path, name, exts = [".js", ".ts", ".jsx", ".tsx", ".mjs", ".mts"]) => { for (var ext of exts) { const file = join(path, name + ext); @@ -737,6 +711,7 @@ export default function solidStart(options) { return [ solidStartConfig(options), solidStartFileSystemRouter(options), + !options.ssr && solidStartCsrDev(options), options.islands ? islands() : undefined, options.inspect ? inspect({ outputDir: join(".solid", "inspect"), build: true }) : undefined, options.ssr && solidStartInlineServerModules(options), diff --git a/test/api-routes-test.ts b/test/api-routes-test.ts index 5906e8671..d0aaa6e59 100644 --- a/test/api-routes-test.ts +++ b/test/api-routes-test.ts @@ -153,31 +153,33 @@ test.describe("api routes", () => { expect(await page.content()).toContain('{"hello":"world"}'); }); - test("should render data from API route using server$.fetch", async ({ page }) => { - let app = new PlaywrightFixture(appFixture, page); - await app.goto("/server-fetch"); - let dataEl = await page.waitForSelector("[data-testid='data']"); - expect(await dataEl!.innerText()).toBe("harry-potter"); - - await app.goto("/", true); - await page.click("a[href='/server-fetch']"); - dataEl = await page.waitForSelector("[data-testid='data']"); - expect(await dataEl!.innerText()).toBe("harry-potter"); - }); - - test("should render data from API route using serverData with server$.fetch", async ({ - page - }) => { - let app = new PlaywrightFixture(appFixture, page); - await app.goto("/server-data-fetch"); - let dataEl = await page.waitForSelector("[data-testid='data']"); - expect(await dataEl!.innerText()).toBe("harry-potter"); + if (ssr) { + test("should render data from API route using server$.fetch", async ({ page }) => { + let app = new PlaywrightFixture(appFixture, page); + await app.goto("/server-fetch"); + let dataEl = await page.waitForSelector("[data-testid='data']"); + expect(await dataEl!.innerText()).toBe("harry-potter"); + + await app.goto("/", true); + await page.click("a[href='/server-fetch']"); + dataEl = await page.waitForSelector("[data-testid='data']"); + expect(await dataEl!.innerText()).toBe("harry-potter"); + }); - await app.goto("/", true); - await page.click("a[href='/server-data-fetch']"); - dataEl = await page.waitForSelector("[data-testid='data']"); - expect(await dataEl!.innerText()).toBe("harry-potter"); - }); + test("should render data from API route using serverData with server$.fetch", async ({ + page + }) => { + let app = new PlaywrightFixture(appFixture, page); + await app.goto("/server-data-fetch"); + let dataEl = await page.waitForSelector("[data-testid='data']"); + expect(await dataEl!.innerText()).toBe("harry-potter"); + + await app.goto("/", true); + await page.click("a[href='/server-data-fetch']"); + dataEl = await page.waitForSelector("[data-testid='data']"); + expect(await dataEl!.innerText()).toBe("harry-potter"); + }); + } test("should return json from API route", async ({ page }) => { test.skip(process.env.START_ADAPTER === "solid-start-cloudflare-pages"); diff --git a/test/misc-test.ts b/test/misc-test.ts index f7946b0ea..7f159f200 100644 --- a/test/misc-test.ts +++ b/test/misc-test.ts @@ -11,9 +11,9 @@ test.describe("miscellaneous tests", () => { runTests(true); }); - test.describe("without SSR", () => { - runTests(false); - }); + // test.describe("without SSR", () => { + // runTests(false); + // }); function runTests(ssr) { test.beforeAll(async () => {