From 24425cde35940b7ce82eeff2b10224f835389d21 Mon Sep 17 00:00:00 2001 From: daishi Date: Sat, 30 Mar 2024 15:33:01 +0900 Subject: [PATCH 01/25] add failing test for #631 --- e2e/fixtures/ssr-context-provider/README.md | 3 + .../ssr-context-provider/package.json | 22 +++++ .../src/components/app.tsx | 12 +++ .../src/components/context-consumer.tsx | 19 +++++ .../src/components/context-provider.tsx | 10 +++ .../ssr-context-provider/src/entries.tsx | 29 +++++++ .../ssr-context-provider/src/main.tsx | 17 ++++ .../ssr-context-provider/tsconfig.json | 17 ++++ e2e/ssr-context-provider.spec.ts | 83 +++++++++++++++++++ pnpm-lock.yaml | 25 ++++++ 10 files changed, 237 insertions(+) create mode 100644 e2e/fixtures/ssr-context-provider/README.md create mode 100644 e2e/fixtures/ssr-context-provider/package.json create mode 100644 e2e/fixtures/ssr-context-provider/src/components/app.tsx create mode 100644 e2e/fixtures/ssr-context-provider/src/components/context-consumer.tsx create mode 100644 e2e/fixtures/ssr-context-provider/src/components/context-provider.tsx create mode 100644 e2e/fixtures/ssr-context-provider/src/entries.tsx create mode 100644 e2e/fixtures/ssr-context-provider/src/main.tsx create mode 100644 e2e/fixtures/ssr-context-provider/tsconfig.json create mode 100644 e2e/ssr-context-provider.spec.ts diff --git a/e2e/fixtures/ssr-context-provider/README.md b/e2e/fixtures/ssr-context-provider/README.md new file mode 100644 index 000000000..93fa34223 --- /dev/null +++ b/e2e/fixtures/ssr-context-provider/README.md @@ -0,0 +1,3 @@ +# SSR Context Provider + +To cover https://github.com/dai-shi/waku/issues/631 case diff --git a/e2e/fixtures/ssr-context-provider/package.json b/e2e/fixtures/ssr-context-provider/package.json new file mode 100644 index 000000000..3946b1077 --- /dev/null +++ b/e2e/fixtures/ssr-context-provider/package.json @@ -0,0 +1,22 @@ +{ + "name": "ssr-context-provider", + "version": "0.1.0", + "type": "module", + "private": true, + "scripts": { + "dev": "waku dev", + "build": "waku build", + "start": "waku start" + }, + "dependencies": { + "react": "18.3.0-canary-670811593-20240322", + "react-dom": "18.3.0-canary-670811593-20240322", + "react-server-dom-webpack": "18.3.0-canary-670811593-20240322", + "waku": "workspace:*" + }, + "devDependencies": { + "@types/react": "18.2.69", + "@types/react-dom": "18.2.22", + "typescript": "5.4.3" + } +} diff --git a/e2e/fixtures/ssr-context-provider/src/components/app.tsx b/e2e/fixtures/ssr-context-provider/src/components/app.tsx new file mode 100644 index 000000000..e23ae4031 --- /dev/null +++ b/e2e/fixtures/ssr-context-provider/src/components/app.tsx @@ -0,0 +1,12 @@ +import { ContextProvider } from './context-provider.js'; +import { ContextConsumer } from './context-consumer.js'; + +export default function App() { + return ( +
+ + + +
+ ); +} diff --git a/e2e/fixtures/ssr-context-provider/src/components/context-consumer.tsx b/e2e/fixtures/ssr-context-provider/src/components/context-consumer.tsx new file mode 100644 index 000000000..ad0d98902 --- /dev/null +++ b/e2e/fixtures/ssr-context-provider/src/components/context-consumer.tsx @@ -0,0 +1,19 @@ +'use client'; + +import { useContext, useEffect, useState } from 'react'; + +import { Context } from './context-provider.js'; + +export const ContextConsumer = () => { + const [mounted, setMounted] = useState(false); + useEffect(() => { + setMounted(true); + }, []); + const value = useContext(Context); + return ( + <> + {mounted &&
true
} +
{value}
; + + ); +}; diff --git a/e2e/fixtures/ssr-context-provider/src/components/context-provider.tsx b/e2e/fixtures/ssr-context-provider/src/components/context-provider.tsx new file mode 100644 index 000000000..2949cfc02 --- /dev/null +++ b/e2e/fixtures/ssr-context-provider/src/components/context-provider.tsx @@ -0,0 +1,10 @@ +'use client'; + +import { createContext } from 'react'; +import type { ReactNode } from 'react'; + +export const Context = createContext('original'); + +export const ContextProvider = ({ children }: { children: ReactNode }) => { + return {children}; +}; diff --git a/e2e/fixtures/ssr-context-provider/src/entries.tsx b/e2e/fixtures/ssr-context-provider/src/entries.tsx new file mode 100644 index 000000000..bf415354c --- /dev/null +++ b/e2e/fixtures/ssr-context-provider/src/entries.tsx @@ -0,0 +1,29 @@ +/// + +import { defineEntries } from 'waku/server'; +import { Slot } from 'waku/client'; + +import App from './components/app.js'; + +export default defineEntries( + // renderEntries + async () => { + return { + App: , + }; + }, + // getBuildConfig + async () => [{ pathname: '/', entries: [{ input: '' }] }], + // getSsrConfig + async (pathname) => { + switch (pathname) { + case '/': + return { + input: '', + body: , + }; + default: + return null; + } + }, +); diff --git a/e2e/fixtures/ssr-context-provider/src/main.tsx b/e2e/fixtures/ssr-context-provider/src/main.tsx new file mode 100644 index 000000000..fe026c6b2 --- /dev/null +++ b/e2e/fixtures/ssr-context-provider/src/main.tsx @@ -0,0 +1,17 @@ +import { StrictMode } from 'react'; +import { createRoot, hydrateRoot } from 'react-dom/client'; +import { Root, Slot } from 'waku/client'; + +const rootElement = ( + + + + + +); + +if (document.body.dataset.hydrate) { + hydrateRoot(document.body, rootElement); +} else { + createRoot(document.body).render(rootElement); +} diff --git a/e2e/fixtures/ssr-context-provider/tsconfig.json b/e2e/fixtures/ssr-context-provider/tsconfig.json new file mode 100644 index 000000000..2590e13de --- /dev/null +++ b/e2e/fixtures/ssr-context-provider/tsconfig.json @@ -0,0 +1,17 @@ +{ + "compilerOptions": { + "composite": true, + "strict": true, + "target": "esnext", + "downlevelIteration": true, + "esModuleInterop": true, + "module": "nodenext", + "skipLibCheck": true, + "noUncheckedIndexedAccess": true, + "exactOptionalPropertyTypes": true, + "types": ["react/experimental"], + "jsx": "react-jsx", + "rootDir": "./src", + "outDir": "./dist" + } +} diff --git a/e2e/ssr-context-provider.spec.ts b/e2e/ssr-context-provider.spec.ts new file mode 100644 index 000000000..09858136f --- /dev/null +++ b/e2e/ssr-context-provider.spec.ts @@ -0,0 +1,83 @@ +import { expect } from '@playwright/test'; +import { execSync, exec, ChildProcess } from 'node:child_process'; +import { fileURLToPath } from 'node:url'; +import waitPort from 'wait-port'; +import { getFreePort, test } from './utils.js'; +import { rm } from 'node:fs/promises'; + +const waku = fileURLToPath( + new URL('../packages/waku/dist/cli.js', import.meta.url), +); + +const commands = [ + { + command: 'dev', + }, + { + build: 'build', + command: 'start', + }, +]; + +const cwd = fileURLToPath( + new URL('./fixtures/ssr-context-provider', import.meta.url), +); + +for (const { build, command } of commands) { + test.describe(`ssr-context-provider: ${command}`, () => { + let cp: ChildProcess; + let port: number; + test.beforeAll('remove cache', async () => { + await rm(`${cwd}/dist`, { + recursive: true, + force: true, + }); + }); + + test.beforeAll(async () => { + if (build) { + execSync(`node ${waku} ${build}`, { + cwd, + }); + } + port = await getFreePort(); + cp = exec(`node ${waku} ${command}`, { + cwd, + env: { + ...process.env, + PORT: `${port}`, + }, + }); + cp.stdout?.on('data', (data) => { + console.log(`${port} stdout: `, `${data}`); + }); + cp.stderr?.on('data', (data) => { + console.error(`${port} stderr: `, `${data}`); + }); + await waitPort({ + port, + }); + }); + + test.afterAll(async () => { + cp.kill(); + }); + + test('show context value', async ({ page }) => { + await page.goto(`http://localhost:${port}/`); + await page.waitForSelector('[data-testid="mounted"]'); + await expect(page.getByTestId('value')).toHaveText('provider value'); + }); + + test('no js environment', async ({ browser }) => { + const context = await browser.newContext({ + javaScriptEnabled: false, + }); + const page = await context.newPage(); + await page.goto(`http://localhost:${port}/`); + await expect(page.getByTestId('value')).toHaveText('provider value'); + await page.close(); + await context.close(); + }); + }); +} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 932df224b..5ab9bd970 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -147,6 +147,31 @@ importers: specifier: 5.4.3 version: 5.4.3 + e2e/fixtures/ssr-context-provider: + dependencies: + react: + specifier: 18.3.0-canary-670811593-20240322 + version: 18.3.0-canary-670811593-20240322 + react-dom: + specifier: 18.3.0-canary-670811593-20240322 + version: 18.3.0-canary-670811593-20240322(react@18.3.0-canary-670811593-20240322) + react-server-dom-webpack: + specifier: 18.3.0-canary-670811593-20240322 + version: 18.3.0-canary-670811593-20240322(react-dom@18.3.0-canary-670811593-20240322)(react@18.3.0-canary-670811593-20240322)(webpack@5.91.0) + waku: + specifier: workspace:* + version: link:../../../packages/waku + devDependencies: + '@types/react': + specifier: 18.2.69 + version: 18.2.69 + '@types/react-dom': + specifier: 18.2.22 + version: 18.2.22 + typescript: + specifier: 5.4.3 + version: 5.4.3 + e2e/fixtures/ssr-swr: dependencies: react: From 63ba64eba619fd5f92b59060e3a22a217198d007 Mon Sep 17 00:00:00 2001 From: daishi Date: Sat, 30 Mar 2024 15:50:50 +0900 Subject: [PATCH 02/25] tsconfig.e2e --- tsconfig.e2e.json | 3 +++ 1 file changed, 3 insertions(+) diff --git a/tsconfig.e2e.json b/tsconfig.e2e.json index c7721fa4c..9096de6c9 100644 --- a/tsconfig.e2e.json +++ b/tsconfig.e2e.json @@ -20,6 +20,9 @@ }, { "path": "./e2e/fixtures/ssr-swr/tsconfig.json" + }, + { + "path": "./e2e/fixtures/ssr-context-provider/tsconfig.json" } ] } From 4c3579a0ceff023903d0bc29029fbea6aa1dcd38 Mon Sep 17 00:00:00 2001 From: Mohammad Bagher Abiyat Date: Mon, 1 Apr 2024 19:39:19 +0330 Subject: [PATCH 03/25] init --- .../waku/src/lib/renderers/dev-worker-impl.ts | 28 +++++++++++++------ .../waku/src/lib/renderers/html-renderer.ts | 10 ++++--- 2 files changed, 25 insertions(+), 13 deletions(-) diff --git a/packages/waku/src/lib/renderers/dev-worker-impl.ts b/packages/waku/src/lib/renderers/dev-worker-impl.ts index 5db7d57de..467fe4f85 100644 --- a/packages/waku/src/lib/renderers/dev-worker-impl.ts +++ b/packages/waku/src/lib/renderers/dev-worker-impl.ts @@ -45,20 +45,29 @@ const configPrivateDir = getEnvironmentData('CONFIG_PRIVATE_DIR') as string; const resolveClientEntryForDev = ( id: string, - config: { basePath: string }, + config: { rootDir: string }, initialModules: ClonableModuleNode[], ) => { - for (const moduleNode of initialModules) { - if (moduleNode.file === id) { - return moduleNode.url; - } + console.log(config) + console.log('resolveClientEntryForDev', id) + // for (const moduleNode of initialModules) { + // if (moduleNode.file === id) { + // console.log('moduleNode', moduleNode.file, moduleNode.url) + // // return moduleNode.url; + // return moduleNode.file; + // } + // } + let filePath = id.startsWith('file://') ? fileURLToFilePath(id) : id; + if (filePath.startsWith(config.rootDir)) { + filePath = filePath.slice(config.rootDir.length, filePath.length) } - const filePath = id.startsWith('file://') ? fileURLToFilePath(id) : id; // HACK this relies on Vite's internal implementation detail. - return config.basePath + '@fs' + encodeFilePathToAbsolute(filePath); + return filePath + // return config.basePath + '@fs' + encodeFilePathToAbsolute(filePath); }; const handleRender = async (mesg: MessageReq & { type: 'render' }) => { + const vite = await vitePromise const { id, type: _removed, @@ -90,7 +99,7 @@ const handleRender = async (mesg: MessageReq & { type: 'render' }) => { loadServerFile, loadServerModule, resolveClientEntry: (id: string) => - resolveClientEntryForDev(id, rest.config, initialModules), + resolveClientEntryForDev(id, {rootDir: vite.config.root}, initialModules), entries: await loadEntries(rest.config), }, ); @@ -114,6 +123,7 @@ const handleRender = async (mesg: MessageReq & { type: 'render' }) => { const handleGetSsrConfig = async ( mesg: MessageReq & { type: 'getSsrConfig' }, ) => { + const vite = await vitePromise const { id, config, pathname, searchParamsString, initialModules } = mesg; const searchParams = new URLSearchParams(searchParamsString); try { @@ -126,7 +136,7 @@ const handleGetSsrConfig = async ( { isDev: true, resolveClientEntry: (id: string) => - resolveClientEntryForDev(id, config, initialModules), + resolveClientEntryForDev(id, {rootDir: vite.config.root}, initialModules), entries: await loadEntries(config), }, ); diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index 37b5928a9..522d292b1 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -262,11 +262,13 @@ export const renderHtml = async ( get(_target, name: string) { if (isDev) { // TODO too long, we need to refactor this logic - let file = filePath.slice(config.basePath.length); + // let file = filePath.slice(config.basePath.length); + let file = filePath; file = file.split('?')[0]!; - file = file.startsWith('@fs/') - ? file.slice('@fs'.length) - : encodeFilePathToAbsolute(joinPath(opts.rootDir, file)); + // file = file.startsWith('@fs/') + // ? file.slice('@fs'.length) + // : encodeFilePathToAbsolute(joinPath(opts.rootDir, file)); + const wakuDist = joinPath( fileURLToFilePath(import.meta.url), '../../..', From 99c7818374a06d2b6d036af4866864d18f247d45 Mon Sep 17 00:00:00 2001 From: Mohammad Bagher Abiyat Date: Mon, 1 Apr 2024 19:43:25 +0330 Subject: [PATCH 04/25] format --- .../waku/src/lib/renderers/dev-worker-impl.ts | 38 +++++-------------- .../waku/src/lib/renderers/html-renderer.ts | 1 - 2 files changed, 9 insertions(+), 30 deletions(-) diff --git a/packages/waku/src/lib/renderers/dev-worker-impl.ts b/packages/waku/src/lib/renderers/dev-worker-impl.ts index 467fe4f85..8e6c54960 100644 --- a/packages/waku/src/lib/renderers/dev-worker-impl.ts +++ b/packages/waku/src/lib/renderers/dev-worker-impl.ts @@ -9,11 +9,7 @@ import { createServer as createViteServer } from 'vite'; import viteReact from '@vitejs/plugin-react'; import type { EntriesDev } from '../../server.js'; -import { - joinPath, - fileURLToFilePath, - encodeFilePathToAbsolute, -} from '../utils/path.js'; +import { joinPath, fileURLToFilePath } from '../utils/path.js'; import { deepFreeze, hasStatusCode } from './utils.js'; import type { MessageReq, MessageRes } from './dev-worker-api.js'; import { renderRsc, getSsrConfig } from './rsc-renderer.js'; @@ -25,7 +21,6 @@ import { rscManagedPlugin } from '../plugins/vite-plugin-rsc-managed.js'; import { rscDelegatePlugin } from '../plugins/vite-plugin-rsc-delegate.js'; import { mergeUserViteConfig } from '../utils/merge-vite-config.js'; import { viteHot } from '../plugins/vite-plugin-rsc-hmr.js'; -import type { ClonableModuleNode } from '../middleware/types.js'; // For react-server-dom-webpack/server.edge (globalThis as any).AsyncLocalStorage = AsyncLocalStorage; @@ -43,31 +38,16 @@ const configSrcDir = getEnvironmentData('CONFIG_SRC_DIR') as string; const configEntriesJs = getEnvironmentData('CONFIG_ENTRIES_JS') as string; const configPrivateDir = getEnvironmentData('CONFIG_PRIVATE_DIR') as string; -const resolveClientEntryForDev = ( - id: string, - config: { rootDir: string }, - initialModules: ClonableModuleNode[], -) => { - console.log(config) - console.log('resolveClientEntryForDev', id) - // for (const moduleNode of initialModules) { - // if (moduleNode.file === id) { - // console.log('moduleNode', moduleNode.file, moduleNode.url) - // // return moduleNode.url; - // return moduleNode.file; - // } - // } +const resolveClientEntryForDev = (id: string, config: { rootDir: string }) => { let filePath = id.startsWith('file://') ? fileURLToFilePath(id) : id; if (filePath.startsWith(config.rootDir)) { - filePath = filePath.slice(config.rootDir.length, filePath.length) + filePath = filePath.slice(config.rootDir.length, filePath.length); } - // HACK this relies on Vite's internal implementation detail. - return filePath - // return config.basePath + '@fs' + encodeFilePathToAbsolute(filePath); + return filePath; }; const handleRender = async (mesg: MessageReq & { type: 'render' }) => { - const vite = await vitePromise + const vite = await vitePromise; const { id, type: _removed, @@ -99,7 +79,7 @@ const handleRender = async (mesg: MessageReq & { type: 'render' }) => { loadServerFile, loadServerModule, resolveClientEntry: (id: string) => - resolveClientEntryForDev(id, {rootDir: vite.config.root}, initialModules), + resolveClientEntryForDev(id, { rootDir: vite.config.root }), entries: await loadEntries(rest.config), }, ); @@ -123,8 +103,8 @@ const handleRender = async (mesg: MessageReq & { type: 'render' }) => { const handleGetSsrConfig = async ( mesg: MessageReq & { type: 'getSsrConfig' }, ) => { - const vite = await vitePromise - const { id, config, pathname, searchParamsString, initialModules } = mesg; + const vite = await vitePromise; + const { id, config, pathname, searchParamsString } = mesg; const searchParams = new URLSearchParams(searchParamsString); try { const ssrConfig = await getSsrConfig( @@ -136,7 +116,7 @@ const handleGetSsrConfig = async ( { isDev: true, resolveClientEntry: (id: string) => - resolveClientEntryForDev(id, {rootDir: vite.config.root}, initialModules), + resolveClientEntryForDev(id, { rootDir: vite.config.root }), entries: await loadEntries(config), }, ); diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index 522d292b1..31bcf4b88 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -17,7 +17,6 @@ import { joinPath, filePathToFileURL, fileURLToFilePath, - encodeFilePathToAbsolute, } from '../utils/path.js'; import { encodeInput, hasStatusCode } from './utils.js'; From 15c45365ed9bac166baae49e65b155685dd192fb Mon Sep 17 00:00:00 2001 From: Mohammad Bagher Abiyat Date: Mon, 1 Apr 2024 20:50:28 +0330 Subject: [PATCH 05/25] update --- .../waku/src/lib/renderers/dev-worker-impl.ts | 23 +++++++++++++++---- .../waku/src/lib/renderers/html-renderer.ts | 10 ++++---- 2 files changed, 23 insertions(+), 10 deletions(-) diff --git a/packages/waku/src/lib/renderers/dev-worker-impl.ts b/packages/waku/src/lib/renderers/dev-worker-impl.ts index 8e6c54960..851973c4b 100644 --- a/packages/waku/src/lib/renderers/dev-worker-impl.ts +++ b/packages/waku/src/lib/renderers/dev-worker-impl.ts @@ -9,7 +9,11 @@ import { createServer as createViteServer } from 'vite'; import viteReact from '@vitejs/plugin-react'; import type { EntriesDev } from '../../server.js'; -import { joinPath, fileURLToFilePath } from '../utils/path.js'; +import { + joinPath, + fileURLToFilePath, + encodeFilePathToAbsolute, +} from '../utils/path.js'; import { deepFreeze, hasStatusCode } from './utils.js'; import type { MessageReq, MessageRes } from './dev-worker-api.js'; import { renderRsc, getSsrConfig } from './rsc-renderer.js'; @@ -38,10 +42,15 @@ const configSrcDir = getEnvironmentData('CONFIG_SRC_DIR') as string; const configEntriesJs = getEnvironmentData('CONFIG_ENTRIES_JS') as string; const configPrivateDir = getEnvironmentData('CONFIG_PRIVATE_DIR') as string; -const resolveClientEntryForDev = (id: string, config: { rootDir: string }) => { +const resolveClientEntryForDev = ( + id: string, + config: { rootDir: string; basePath: string }, +) => { let filePath = id.startsWith('file://') ? fileURLToFilePath(id) : id; if (filePath.startsWith(config.rootDir)) { filePath = filePath.slice(config.rootDir.length, filePath.length); + } else { + filePath = config.basePath + '@fs' + encodeFilePathToAbsolute(filePath); } return filePath; }; @@ -79,7 +88,10 @@ const handleRender = async (mesg: MessageReq & { type: 'render' }) => { loadServerFile, loadServerModule, resolveClientEntry: (id: string) => - resolveClientEntryForDev(id, { rootDir: vite.config.root }), + resolveClientEntryForDev(id, { + rootDir: vite.config.root, + basePath: rest.config.basePath, + }), entries: await loadEntries(rest.config), }, ); @@ -116,7 +128,10 @@ const handleGetSsrConfig = async ( { isDev: true, resolveClientEntry: (id: string) => - resolveClientEntryForDev(id, { rootDir: vite.config.root }), + resolveClientEntryForDev(id, { + rootDir: vite.config.root, + basePath: config.basePath, + }), entries: await loadEntries(config), }, ); diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index 31bcf4b88..b7eb8420a 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -261,12 +261,10 @@ export const renderHtml = async ( get(_target, name: string) { if (isDev) { // TODO too long, we need to refactor this logic - // let file = filePath.slice(config.basePath.length); - let file = filePath; - file = file.split('?')[0]!; - // file = file.startsWith('@fs/') - // ? file.slice('@fs'.length) - // : encodeFilePathToAbsolute(joinPath(opts.rootDir, file)); + let file = filePath.split('?')[0]!; + file = file.startsWith('/@fs/') + ? file.slice((config.basePath + '@fs').length) + : file; const wakuDist = joinPath( fileURLToFilePath(import.meta.url), From f59c55350eafb9f210922e38a6a76804420b799e Mon Sep 17 00:00:00 2001 From: Mohammad Bagher Abiyat Date: Fri, 5 Apr 2024 00:33:14 +0330 Subject: [PATCH 06/25] another trial --- packages/waku/src/lib/renderers/html-renderer.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index b7eb8420a..94323f739 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -270,9 +270,10 @@ export const renderHtml = async ( fileURLToFilePath(import.meta.url), '../../..', ); - if (file.startsWith(wakuDist)) { + const fileWithAbsolutePath = !file.startsWith(opts.rootDir) ? joinPath(opts.rootDir, file): file + if (file.startsWith(wakuDist) || fileWithAbsolutePath.startsWith(wakuDist)) { const id = - 'waku' + file.slice(wakuDist.length).replace(/\.\w+$/, ''); + 'waku' + fileWithAbsolutePath.slice(wakuDist.length).replace(/\.\w+$/, ''); if (!moduleLoading.has(id)) { moduleLoading.set( id, From 32cb1d6fb6830ba20d38880e07aeef15193e0a7b Mon Sep 17 00:00:00 2001 From: Mohammad Bagher Abiyat Date: Sat, 6 Apr 2024 18:25:19 +0330 Subject: [PATCH 07/25] another trial --- .../waku/src/lib/middleware/dev-server.ts | 30 ++++++++--------- .../waku/src/lib/renderers/dev-worker-impl.ts | 33 ++++++++++++++----- .../waku/src/lib/renderers/html-renderer.ts | 23 +++++++++---- 3 files changed, 54 insertions(+), 32 deletions(-) diff --git a/packages/waku/src/lib/middleware/dev-server.ts b/packages/waku/src/lib/middleware/dev-server.ts index 887487ed8..2c4f60413 100644 --- a/packages/waku/src/lib/middleware/dev-server.ts +++ b/packages/waku/src/lib/middleware/dev-server.ts @@ -166,23 +166,21 @@ export const devServer: Middleware = (options) => { vitePromise, ]); - if (!initialModules) { - // pre-process the mainJs file to see which modules are being sent to the browser by vite - // and using the same modules if possible in the bundlerConfig in the stream - const mainJs = `${config.basePath}${config.srcDir}/${config.mainJs}`; - await vite.transformRequest(mainJs); - const resolved = await vite.pluginContainer.resolveId(mainJs); - const resolvedModule = vite.moduleGraph.idToModuleMap.get(resolved!.id)!; - await Promise.all( - [...resolvedModule.importedModules].map(({ id }) => - id ? vite.warmupRequest(id) : null, - ), - ); + // pre-process the mainJs file to see which modules are being sent to the browser by vite + // and using the same modules if possible in the bundlerConfig in the stream + const mainJs = `${config.basePath}${config.srcDir}/${config.mainJs}`; + await vite.transformRequest(mainJs); + const resolved = await vite.pluginContainer.resolveId(mainJs); + const resolvedModule = vite.moduleGraph.idToModuleMap.get(resolved!.id)!; + await Promise.all( + [...resolvedModule.importedModules].map(({ id }) => + id ? vite.warmupRequest(id) : null, + ), + ); - initialModules = Array.from(vite.moduleGraph.idToModuleMap.values()).map( - (m) => ({ url: m.url, file: m.file! }), - ); - } + initialModules = Array.from(vite.moduleGraph.idToModuleMap.values()).map( + (m) => ({ url: m.url, file: m.file! }), + ); ctx.devServer = { rootDir: vite.config.root, diff --git a/packages/waku/src/lib/renderers/dev-worker-impl.ts b/packages/waku/src/lib/renderers/dev-worker-impl.ts index 851973c4b..0a3afea44 100644 --- a/packages/waku/src/lib/renderers/dev-worker-impl.ts +++ b/packages/waku/src/lib/renderers/dev-worker-impl.ts @@ -25,6 +25,7 @@ import { rscManagedPlugin } from '../plugins/vite-plugin-rsc-managed.js'; import { rscDelegatePlugin } from '../plugins/vite-plugin-rsc-delegate.js'; import { mergeUserViteConfig } from '../utils/merge-vite-config.js'; import { viteHot } from '../plugins/vite-plugin-rsc-hmr.js'; +import type { ClonableModuleNode } from '../middleware/types.js'; // For react-server-dom-webpack/server.edge (globalThis as any).AsyncLocalStorage = AsyncLocalStorage; @@ -45,7 +46,13 @@ const configPrivateDir = getEnvironmentData('CONFIG_PRIVATE_DIR') as string; const resolveClientEntryForDev = ( id: string, config: { rootDir: string; basePath: string }, + initialModules: ClonableModuleNode[], ) => { + for (const moduleNode of initialModules) { + if (moduleNode.file === id) { + return moduleNode.url; + } + } let filePath = id.startsWith('file://') ? fileURLToFilePath(id) : id; if (filePath.startsWith(config.rootDir)) { filePath = filePath.slice(config.rootDir.length, filePath.length); @@ -88,10 +95,14 @@ const handleRender = async (mesg: MessageReq & { type: 'render' }) => { loadServerFile, loadServerModule, resolveClientEntry: (id: string) => - resolveClientEntryForDev(id, { - rootDir: vite.config.root, - basePath: rest.config.basePath, - }), + resolveClientEntryForDev( + id, + { + rootDir: vite.config.root, + basePath: rest.config.basePath, + }, + initialModules, + ), entries: await loadEntries(rest.config), }, ); @@ -116,7 +127,7 @@ const handleGetSsrConfig = async ( mesg: MessageReq & { type: 'getSsrConfig' }, ) => { const vite = await vitePromise; - const { id, config, pathname, searchParamsString } = mesg; + const { id, config, initialModules, pathname, searchParamsString } = mesg; const searchParams = new URLSearchParams(searchParamsString); try { const ssrConfig = await getSsrConfig( @@ -128,10 +139,14 @@ const handleGetSsrConfig = async ( { isDev: true, resolveClientEntry: (id: string) => - resolveClientEntryForDev(id, { - rootDir: vite.config.root, - basePath: config.basePath, - }), + resolveClientEntryForDev( + id, + { + rootDir: vite.config.root, + basePath: config.basePath, + }, + initialModules, + ), entries: await loadEntries(config), }, ); diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index 94323f739..154f7f7c9 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -261,19 +261,28 @@ export const renderHtml = async ( get(_target, name: string) { if (isDev) { // TODO too long, we need to refactor this logic - let file = filePath.split('?')[0]!; - file = file.startsWith('/@fs/') - ? file.slice((config.basePath + '@fs').length) - : file; + const file = ( + filePath.startsWith('/@fs/') + ? filePath.slice((config.basePath + '@fs').length) + : filePath + ).split('?')[0]!; const wakuDist = joinPath( fileURLToFilePath(import.meta.url), '../../..', ); - const fileWithAbsolutePath = !file.startsWith(opts.rootDir) ? joinPath(opts.rootDir, file): file - if (file.startsWith(wakuDist) || fileWithAbsolutePath.startsWith(wakuDist)) { + const fileWithAbsolutePath = !file.startsWith(opts.rootDir) + ? joinPath(opts.rootDir, file) + : file; + if ( + file.startsWith(wakuDist) || + fileWithAbsolutePath.startsWith(wakuDist) + ) { const id = - 'waku' + fileWithAbsolutePath.slice(wakuDist.length).replace(/\.\w+$/, ''); + 'waku' + + fileWithAbsolutePath + .slice(wakuDist.length) + .replace(/\.\w+$/, ''); if (!moduleLoading.has(id)) { moduleLoading.set( id, From 6d2cf49886153b5f185cd1722cdabd8bb84654a3 Mon Sep 17 00:00:00 2001 From: Mohammad Bagher Abiyat Date: Sat, 6 Apr 2024 18:42:31 +0330 Subject: [PATCH 08/25] another trial --- packages/waku/src/lib/renderers/html-renderer.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index 154f7f7c9..570896b5a 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -283,6 +283,7 @@ export const renderHtml = async ( fileWithAbsolutePath .slice(wakuDist.length) .replace(/\.\w+$/, ''); + console.log('import', fileWithAbsolutePath, id) if (!moduleLoading.has(id)) { moduleLoading.set( id, From 40bb89f591b542f9c925d37bec35578278ce59df Mon Sep 17 00:00:00 2001 From: Mohammad Bagher Abiyat Date: Sat, 6 Apr 2024 19:25:59 +0330 Subject: [PATCH 09/25] another trial --- packages/waku/src/lib/renderers/html-renderer.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index 570896b5a..d0aedb6ce 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -271,7 +271,7 @@ export const renderHtml = async ( fileURLToFilePath(import.meta.url), '../../..', ); - const fileWithAbsolutePath = !file.startsWith(opts.rootDir) + const fileWithAbsolutePath = !file.startsWith(opts.rootDir) && !file.startsWith(wakuDist) ? joinPath(opts.rootDir, file) : file; if ( From 5cdcd001ae298af5a643cb976c9fd321d1e6c98f Mon Sep 17 00:00:00 2001 From: Mohammad Bagher Abiyat Date: Sat, 6 Apr 2024 20:32:33 +0330 Subject: [PATCH 10/25] debug --- packages/waku/src/lib/renderers/dev-worker-impl.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/waku/src/lib/renderers/dev-worker-impl.ts b/packages/waku/src/lib/renderers/dev-worker-impl.ts index 0a3afea44..308313fce 100644 --- a/packages/waku/src/lib/renderers/dev-worker-impl.ts +++ b/packages/waku/src/lib/renderers/dev-worker-impl.ts @@ -54,11 +54,13 @@ const resolveClientEntryForDev = ( } } let filePath = id.startsWith('file://') ? fileURLToFilePath(id) : id; + console.log('startFilePath', filePath) if (filePath.startsWith(config.rootDir)) { filePath = filePath.slice(config.rootDir.length, filePath.length); } else { filePath = config.basePath + '@fs' + encodeFilePathToAbsolute(filePath); } + console.log('endFilePath', filePath) return filePath; }; From d940272b99af3620da581197f3830a6e0af7050e Mon Sep 17 00:00:00 2001 From: daishi Date: Sun, 7 Apr 2024 21:54:24 +0900 Subject: [PATCH 11/25] update pnpm lock --- pnpm-lock.yaml | 57 ++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 57 insertions(+) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 11e4b82c6..9835016c6 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -2136,12 +2136,26 @@ packages: /@types/prop-types@15.7.12: resolution: {integrity: sha512-5zvhXYtRNRluoE/jAp4GVsSduVUzNWKkOZrCDBWYtE7biZywwdC2AcEzg+cSMLFRfVgeAFqpfNabiPjxFddV1Q==} + /@types/react-dom@18.2.22: + resolution: {integrity: sha512-fHkBXPeNtfvri6gdsMYyW+dW7RXFo6Ad09nLFK0VQWR7yGLai/Cyvyj696gbwYvBnhGtevUG9cET0pmUbMtoPQ==} + dependencies: + '@types/react': 18.2.74 + dev: true + /@types/react-dom@18.2.24: resolution: {integrity: sha512-cN6upcKd8zkGy4HU9F1+/s98Hrp6D4MOcippK4PoE8OZRngohHZpbJn1GsaDLz87MqvHNoT13nHvNqM9ocRHZg==} dependencies: '@types/react': 18.2.74 dev: true + /@types/react@18.2.69: + resolution: {integrity: sha512-W1HOMUWY/1Yyw0ba5TkCV+oqynRjG7BnteBB+B7JmAK7iw3l2SW+VGOxL+akPweix6jk2NNJtyJKpn4TkpfK3Q==} + dependencies: + '@types/prop-types': 15.7.12 + '@types/scheduler': 0.23.0 + csstype: 3.1.3 + dev: true + /@types/react@18.2.74: resolution: {integrity: sha512-9AEqNZZyBx8OdZpxzQlaFEVCSFUM2YXJH46yPOiOpm078k6ZLOCcuAzGum/zK8YBwY+dbahVNbHrbgrAwIRlqw==} dependencies: @@ -2154,6 +2168,10 @@ packages: '@types/node': 20.12.5 dev: true + /@types/scheduler@0.23.0: + resolution: {integrity: sha512-YIoDCTH3Af6XM5VuwGG/QL/CJqga1Zm3NkU3HZ4ZHK2fRMPYP1VczsTUqtsf43PH/iJNVlPHAo2oWX7BSdB2Hw==} + dev: true + /@types/semver@7.5.8: resolution: {integrity: sha512-I8EUhyrgfLrcTkzV3TSsGyl1tSuPrEDzr0yd5m90UgNxQkyDXULk3b6MlQqTCpZpNtWe1K0hzclnZkTcLBe2UQ==} dev: true @@ -5797,6 +5815,15 @@ packages: strip-json-comments: 2.0.1 dev: true + /react-dom@18.3.0-canary-670811593-20240322(react@18.3.0-canary-670811593-20240322): + resolution: {integrity: sha512-AHxCnyDzZueXIHY4WA2Uba1yaL7/vbjhO3D3TWPQeruKD5MwgD0/xExZi0T104gBr6Thv6MEsLSxFjBAHhHKKg==} + peerDependencies: + react: 18.3.0-canary-670811593-20240322 + dependencies: + react: 18.3.0-canary-670811593-20240322 + scheduler: 0.24.0-canary-670811593-20240322 + dev: false + /react-dom@19.0.0-canary-e3ebcd54b-20240405(react@19.0.0-canary-e3ebcd54b-20240405): resolution: {integrity: sha512-rLmRhyj0CiO0H5lWTIeP1izYsjjp03Dt36dufxjlPWVVpbHdKoIHUU/cDNin7Le2H+hNQfDQk7VcOb6Z7Z+W0g==} peerDependencies: @@ -5815,6 +5842,21 @@ packages: engines: {node: '>=0.10.0'} dev: false + /react-server-dom-webpack@18.3.0-canary-670811593-20240322(react-dom@18.3.0-canary-670811593-20240322)(react@18.3.0-canary-670811593-20240322)(webpack@5.91.0): + resolution: {integrity: sha512-YaCk3AvvOXcOo0FL7SlAY2GVBeuZKFQ/5FfAtE48IjpI6MvXTwMBu3QVnT/Ukk9Y4M9GzpIbLtuc8hPjfFAOaw==} + engines: {node: '>=0.10.0'} + peerDependencies: + react: 18.3.0-canary-670811593-20240322 + react-dom: 18.3.0-canary-670811593-20240322 + webpack: ^5.59.0 + dependencies: + acorn-loose: 8.4.0 + neo-async: 2.6.2 + react: 18.3.0-canary-670811593-20240322 + react-dom: 18.3.0-canary-670811593-20240322(react@18.3.0-canary-670811593-20240322) + webpack: 5.91.0 + dev: false + /react-server-dom-webpack@19.0.0-canary-e3ebcd54b-20240405(react-dom@19.0.0-canary-e3ebcd54b-20240405)(react@19.0.0-canary-e3ebcd54b-20240405)(webpack@5.91.0): resolution: {integrity: sha512-wzZhAOr3GBc6n6M7kivf0Tp2qmVOq+GYQcjzeB0KSPtMoj2jSQHMa0E+xDwHT9OYRWXVYtG2bdFD8MP6kuXkkw==} engines: {node: '>=0.10.0'} @@ -5866,6 +5908,11 @@ packages: react: 19.0.0-canary-e3ebcd54b-20240405 dev: false + /react@18.3.0-canary-670811593-20240322: + resolution: {integrity: sha512-EI6+q3tOT+0z4OkB2sz842Ra/n/yz7b3jOJhSK1HQwi4Ng29VJzLGngWmSuxQ94YfdE3EBhpUKDfgNgzoKM9Vg==} + engines: {node: '>=0.10.0'} + dev: false + /react@19.0.0-canary-e3ebcd54b-20240405: resolution: {integrity: sha512-cJE4hNNSAZSkMGplceUigybvn9cnUrvgFuljOahB2LStTLGVK4bZcszJ0sppwPbr9XVelEvyNmKj/0HRQPc53w==} engines: {node: '>=0.10.0'} @@ -6084,6 +6131,10 @@ packages: is-regex: 1.1.4 dev: true + /scheduler@0.24.0-canary-670811593-20240322: + resolution: {integrity: sha512-IGX6Fq969h1L0X7jV0sJ/EdI4fr+mRetbBNJl55nn+/RsCuQSVwgKnZG6Q3NByixDNbkRI8nRmWuhOm8NQowGQ==} + dev: false + /scheduler@0.25.0-canary-e3ebcd54b-20240405: resolution: {integrity: sha512-xI+jJ4zTJfULtwgO1GgoT3I3MiEV1OisswVdS9LdoQr0QwKpH0Al7IlW68R5ceIXE/a8RfuYZc7Aq34DwBqr7A==} dev: false @@ -6690,6 +6741,12 @@ packages: possible-typed-array-names: 1.0.0 dev: true + /typescript@5.4.3: + resolution: {integrity: sha512-KrPd3PKaCLr78MalgiwJnA25Nm8HAmdwN3mYUYZgG/wizIo9EainNVQI9/yDavtVFRN2h3k8uf3GLHuhDMgEHg==} + engines: {node: '>=14.17'} + hasBin: true + dev: true + /typescript@5.4.4: resolution: {integrity: sha512-dGE2Vv8cpVvw28v8HCPqyb08EzbBURxDpuhJvTrusShUfGnhHBafDsLdS1EhhxyL6BJQE+2cT3dDPAv+MQ6oLw==} engines: {node: '>=14.17'} From 9ac65d2fc7e92155d68c71298d46847953118ed4 Mon Sep 17 00:00:00 2001 From: daishi Date: Tue, 9 Apr 2024 22:53:13 +0900 Subject: [PATCH 12/25] apply review points --- packages/waku/src/lib/renderers/dev-worker-impl.ts | 9 +++++---- packages/waku/src/lib/renderers/html-renderer.ts | 11 ++++++----- 2 files changed, 11 insertions(+), 9 deletions(-) diff --git a/packages/waku/src/lib/renderers/dev-worker-impl.ts b/packages/waku/src/lib/renderers/dev-worker-impl.ts index 84a81dd1e..56100a852 100644 --- a/packages/waku/src/lib/renderers/dev-worker-impl.ts +++ b/packages/waku/src/lib/renderers/dev-worker-impl.ts @@ -54,13 +54,14 @@ const resolveClientEntryForDev = ( } } let filePath = id.startsWith('file://') ? fileURLToFilePath(id) : id; - console.log('startFilePath', filePath) + console.log('startFilePath', filePath); + console.log('config.rootDir', config.rootDir); if (filePath.startsWith(config.rootDir)) { - filePath = filePath.slice(config.rootDir.length, filePath.length); + filePath = filePath.slice(config.rootDir.length); } else { filePath = config.basePath + '@fs' + encodeFilePathToAbsolute(filePath); } - console.log('endFilePath', filePath) + console.log('endFilePath', filePath); return filePath; }; @@ -129,7 +130,7 @@ const handleGetSsrConfig = async ( mesg: MessageReq & { type: 'getSsrConfig' }, ) => { const vite = await vitePromise; - const { id, config, initialModules, pathname, searchParamsString } = mesg; + const { id, config, pathname, searchParamsString, initialModules } = mesg; const searchParams = new URLSearchParams(searchParamsString); try { const ssrConfig = await getSsrConfig( diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index d0aedb6ce..d68729836 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -262,7 +262,7 @@ export const renderHtml = async ( if (isDev) { // TODO too long, we need to refactor this logic const file = ( - filePath.startsWith('/@fs/') + filePath.slice(config.basePath.length).startsWith('@fs/') ? filePath.slice((config.basePath + '@fs').length) : filePath ).split('?')[0]!; @@ -271,9 +271,10 @@ export const renderHtml = async ( fileURLToFilePath(import.meta.url), '../../..', ); - const fileWithAbsolutePath = !file.startsWith(opts.rootDir) && !file.startsWith(wakuDist) - ? joinPath(opts.rootDir, file) - : file; + const fileWithAbsolutePath = + !file.startsWith(opts.rootDir) && !file.startsWith(wakuDist) + ? joinPath(opts.rootDir, file) + : file; if ( file.startsWith(wakuDist) || fileWithAbsolutePath.startsWith(wakuDist) @@ -283,7 +284,7 @@ export const renderHtml = async ( fileWithAbsolutePath .slice(wakuDist.length) .replace(/\.\w+$/, ''); - console.log('import', fileWithAbsolutePath, id) + console.log('import', fileWithAbsolutePath, id); if (!moduleLoading.has(id)) { moduleLoading.set( id, From 9db9f20a622285149725691782d35dcb2c617870 Mon Sep 17 00:00:00 2001 From: daishi Date: Tue, 9 Apr 2024 22:59:56 +0900 Subject: [PATCH 13/25] fix fixture --- .../ssr-context-provider/package.json | 12 +-- pnpm-lock.yaml | 81 +++---------------- 2 files changed, 18 insertions(+), 75 deletions(-) diff --git a/e2e/fixtures/ssr-context-provider/package.json b/e2e/fixtures/ssr-context-provider/package.json index 3946b1077..6218d1772 100644 --- a/e2e/fixtures/ssr-context-provider/package.json +++ b/e2e/fixtures/ssr-context-provider/package.json @@ -9,14 +9,14 @@ "start": "waku start" }, "dependencies": { - "react": "18.3.0-canary-670811593-20240322", - "react-dom": "18.3.0-canary-670811593-20240322", - "react-server-dom-webpack": "18.3.0-canary-670811593-20240322", + "react": "19.0.0-canary-e3ebcd54b-20240405", + "react-dom": "19.0.0-canary-e3ebcd54b-20240405", + "react-server-dom-webpack": "19.0.0-canary-e3ebcd54b-20240405", "waku": "workspace:*" }, "devDependencies": { - "@types/react": "18.2.69", - "@types/react-dom": "18.2.22", - "typescript": "5.4.3" + "@types/react": "18.2.74", + "@types/react-dom": "18.2.24", + "typescript": "5.4.4" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 9835016c6..44013b06c 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -150,27 +150,27 @@ importers: e2e/fixtures/ssr-context-provider: dependencies: react: - specifier: 18.3.0-canary-670811593-20240322 - version: 18.3.0-canary-670811593-20240322 + specifier: 19.0.0-canary-e3ebcd54b-20240405 + version: 19.0.0-canary-e3ebcd54b-20240405 react-dom: - specifier: 18.3.0-canary-670811593-20240322 - version: 18.3.0-canary-670811593-20240322(react@18.3.0-canary-670811593-20240322) + specifier: 19.0.0-canary-e3ebcd54b-20240405 + version: 19.0.0-canary-e3ebcd54b-20240405(react@19.0.0-canary-e3ebcd54b-20240405) react-server-dom-webpack: - specifier: 18.3.0-canary-670811593-20240322 - version: 18.3.0-canary-670811593-20240322(react-dom@18.3.0-canary-670811593-20240322)(react@18.3.0-canary-670811593-20240322)(webpack@5.91.0) + specifier: 19.0.0-canary-e3ebcd54b-20240405 + version: 19.0.0-canary-e3ebcd54b-20240405(react-dom@19.0.0-canary-e3ebcd54b-20240405)(react@19.0.0-canary-e3ebcd54b-20240405)(webpack@5.91.0) waku: specifier: workspace:* version: link:../../../packages/waku devDependencies: '@types/react': - specifier: 18.2.69 - version: 18.2.69 + specifier: 18.2.74 + version: 18.2.74 '@types/react-dom': - specifier: 18.2.22 - version: 18.2.22 + specifier: 18.2.24 + version: 18.2.24 typescript: - specifier: 5.4.3 - version: 5.4.3 + specifier: 5.4.4 + version: 5.4.4 e2e/fixtures/ssr-swr: dependencies: @@ -2136,26 +2136,12 @@ packages: /@types/prop-types@15.7.12: resolution: {integrity: sha512-5zvhXYtRNRluoE/jAp4GVsSduVUzNWKkOZrCDBWYtE7biZywwdC2AcEzg+cSMLFRfVgeAFqpfNabiPjxFddV1Q==} - /@types/react-dom@18.2.22: - resolution: {integrity: sha512-fHkBXPeNtfvri6gdsMYyW+dW7RXFo6Ad09nLFK0VQWR7yGLai/Cyvyj696gbwYvBnhGtevUG9cET0pmUbMtoPQ==} - dependencies: - '@types/react': 18.2.74 - dev: true - /@types/react-dom@18.2.24: resolution: {integrity: sha512-cN6upcKd8zkGy4HU9F1+/s98Hrp6D4MOcippK4PoE8OZRngohHZpbJn1GsaDLz87MqvHNoT13nHvNqM9ocRHZg==} dependencies: '@types/react': 18.2.74 dev: true - /@types/react@18.2.69: - resolution: {integrity: sha512-W1HOMUWY/1Yyw0ba5TkCV+oqynRjG7BnteBB+B7JmAK7iw3l2SW+VGOxL+akPweix6jk2NNJtyJKpn4TkpfK3Q==} - dependencies: - '@types/prop-types': 15.7.12 - '@types/scheduler': 0.23.0 - csstype: 3.1.3 - dev: true - /@types/react@18.2.74: resolution: {integrity: sha512-9AEqNZZyBx8OdZpxzQlaFEVCSFUM2YXJH46yPOiOpm078k6ZLOCcuAzGum/zK8YBwY+dbahVNbHrbgrAwIRlqw==} dependencies: @@ -2168,10 +2154,6 @@ packages: '@types/node': 20.12.5 dev: true - /@types/scheduler@0.23.0: - resolution: {integrity: sha512-YIoDCTH3Af6XM5VuwGG/QL/CJqga1Zm3NkU3HZ4ZHK2fRMPYP1VczsTUqtsf43PH/iJNVlPHAo2oWX7BSdB2Hw==} - dev: true - /@types/semver@7.5.8: resolution: {integrity: sha512-I8EUhyrgfLrcTkzV3TSsGyl1tSuPrEDzr0yd5m90UgNxQkyDXULk3b6MlQqTCpZpNtWe1K0hzclnZkTcLBe2UQ==} dev: true @@ -5815,15 +5797,6 @@ packages: strip-json-comments: 2.0.1 dev: true - /react-dom@18.3.0-canary-670811593-20240322(react@18.3.0-canary-670811593-20240322): - resolution: {integrity: sha512-AHxCnyDzZueXIHY4WA2Uba1yaL7/vbjhO3D3TWPQeruKD5MwgD0/xExZi0T104gBr6Thv6MEsLSxFjBAHhHKKg==} - peerDependencies: - react: 18.3.0-canary-670811593-20240322 - dependencies: - react: 18.3.0-canary-670811593-20240322 - scheduler: 0.24.0-canary-670811593-20240322 - dev: false - /react-dom@19.0.0-canary-e3ebcd54b-20240405(react@19.0.0-canary-e3ebcd54b-20240405): resolution: {integrity: sha512-rLmRhyj0CiO0H5lWTIeP1izYsjjp03Dt36dufxjlPWVVpbHdKoIHUU/cDNin7Le2H+hNQfDQk7VcOb6Z7Z+W0g==} peerDependencies: @@ -5842,21 +5815,6 @@ packages: engines: {node: '>=0.10.0'} dev: false - /react-server-dom-webpack@18.3.0-canary-670811593-20240322(react-dom@18.3.0-canary-670811593-20240322)(react@18.3.0-canary-670811593-20240322)(webpack@5.91.0): - resolution: {integrity: sha512-YaCk3AvvOXcOo0FL7SlAY2GVBeuZKFQ/5FfAtE48IjpI6MvXTwMBu3QVnT/Ukk9Y4M9GzpIbLtuc8hPjfFAOaw==} - engines: {node: '>=0.10.0'} - peerDependencies: - react: 18.3.0-canary-670811593-20240322 - react-dom: 18.3.0-canary-670811593-20240322 - webpack: ^5.59.0 - dependencies: - acorn-loose: 8.4.0 - neo-async: 2.6.2 - react: 18.3.0-canary-670811593-20240322 - react-dom: 18.3.0-canary-670811593-20240322(react@18.3.0-canary-670811593-20240322) - webpack: 5.91.0 - dev: false - /react-server-dom-webpack@19.0.0-canary-e3ebcd54b-20240405(react-dom@19.0.0-canary-e3ebcd54b-20240405)(react@19.0.0-canary-e3ebcd54b-20240405)(webpack@5.91.0): resolution: {integrity: sha512-wzZhAOr3GBc6n6M7kivf0Tp2qmVOq+GYQcjzeB0KSPtMoj2jSQHMa0E+xDwHT9OYRWXVYtG2bdFD8MP6kuXkkw==} engines: {node: '>=0.10.0'} @@ -5908,11 +5866,6 @@ packages: react: 19.0.0-canary-e3ebcd54b-20240405 dev: false - /react@18.3.0-canary-670811593-20240322: - resolution: {integrity: sha512-EI6+q3tOT+0z4OkB2sz842Ra/n/yz7b3jOJhSK1HQwi4Ng29VJzLGngWmSuxQ94YfdE3EBhpUKDfgNgzoKM9Vg==} - engines: {node: '>=0.10.0'} - dev: false - /react@19.0.0-canary-e3ebcd54b-20240405: resolution: {integrity: sha512-cJE4hNNSAZSkMGplceUigybvn9cnUrvgFuljOahB2LStTLGVK4bZcszJ0sppwPbr9XVelEvyNmKj/0HRQPc53w==} engines: {node: '>=0.10.0'} @@ -6131,10 +6084,6 @@ packages: is-regex: 1.1.4 dev: true - /scheduler@0.24.0-canary-670811593-20240322: - resolution: {integrity: sha512-IGX6Fq969h1L0X7jV0sJ/EdI4fr+mRetbBNJl55nn+/RsCuQSVwgKnZG6Q3NByixDNbkRI8nRmWuhOm8NQowGQ==} - dev: false - /scheduler@0.25.0-canary-e3ebcd54b-20240405: resolution: {integrity: sha512-xI+jJ4zTJfULtwgO1GgoT3I3MiEV1OisswVdS9LdoQr0QwKpH0Al7IlW68R5ceIXE/a8RfuYZc7Aq34DwBqr7A==} dev: false @@ -6741,12 +6690,6 @@ packages: possible-typed-array-names: 1.0.0 dev: true - /typescript@5.4.3: - resolution: {integrity: sha512-KrPd3PKaCLr78MalgiwJnA25Nm8HAmdwN3mYUYZgG/wizIo9EainNVQI9/yDavtVFRN2h3k8uf3GLHuhDMgEHg==} - engines: {node: '>=14.17'} - hasBin: true - dev: true - /typescript@5.4.4: resolution: {integrity: sha512-dGE2Vv8cpVvw28v8HCPqyb08EzbBURxDpuhJvTrusShUfGnhHBafDsLdS1EhhxyL6BJQE+2cT3dDPAv+MQ6oLw==} engines: {node: '>=14.17'} From 7f39d19b030ec7190470d044eb6d57e1590e9856 Mon Sep 17 00:00:00 2001 From: daishi Date: Tue, 9 Apr 2024 23:09:00 +0900 Subject: [PATCH 14/25] wip: debug log --- packages/waku/src/lib/renderers/dev-worker-impl.ts | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/waku/src/lib/renderers/dev-worker-impl.ts b/packages/waku/src/lib/renderers/dev-worker-impl.ts index 56100a852..f4a2bf6c5 100644 --- a/packages/waku/src/lib/renderers/dev-worker-impl.ts +++ b/packages/waku/src/lib/renderers/dev-worker-impl.ts @@ -50,18 +50,17 @@ const resolveClientEntryForDev = ( ) => { for (const moduleNode of initialModules) { if (moduleNode.file === id) { + console.log('resolveClientEntryForDev moduleNode.url', moduleNode.url); return moduleNode.url; } } let filePath = id.startsWith('file://') ? fileURLToFilePath(id) : id; - console.log('startFilePath', filePath); - console.log('config.rootDir', config.rootDir); if (filePath.startsWith(config.rootDir)) { filePath = filePath.slice(config.rootDir.length); } else { filePath = config.basePath + '@fs' + encodeFilePathToAbsolute(filePath); } - console.log('endFilePath', filePath); + console.log('resolveClientEntryForDev filePath', filePath); return filePath; }; From 65e83183a94efde232cc1596c99ab2230fb81f6d Mon Sep 17 00:00:00 2001 From: daishi Date: Tue, 9 Apr 2024 23:29:24 +0900 Subject: [PATCH 15/25] wip: debug log 2 --- packages/waku/src/lib/renderers/html-renderer.ts | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index d68729836..9af1fc9c7 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -275,6 +275,10 @@ export const renderHtml = async ( !file.startsWith(opts.rootDir) && !file.startsWith(wakuDist) ? joinPath(opts.rootDir, file) : file; + console.log('---file', file); + console.log('---opts.rootDir', opts.rootDir); + console.log('---wakuDist', wakuDist, fileWithAbsolutePath); + console.log('---fileWithAbsolutePath', fileWithAbsolutePath); if ( file.startsWith(wakuDist) || fileWithAbsolutePath.startsWith(wakuDist) @@ -284,7 +288,6 @@ export const renderHtml = async ( fileWithAbsolutePath .slice(wakuDist.length) .replace(/\.\w+$/, ''); - console.log('import', fileWithAbsolutePath, id); if (!moduleLoading.has(id)) { moduleLoading.set( id, From 9fe262d8834d27b5f30ffb3acfae8656fe62ae3e Mon Sep 17 00:00:00 2001 From: daishi Date: Tue, 9 Apr 2024 23:43:19 +0900 Subject: [PATCH 16/25] encodeFilePathToAbsolute --- packages/waku/src/lib/renderers/html-renderer.ts | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index 9af1fc9c7..1aa8de93f 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -17,6 +17,7 @@ import { joinPath, filePathToFileURL, fileURLToFilePath, + encodeFilePathToAbsolute, } from '../utils/path.js'; import { encodeInput, hasStatusCode } from './utils.js'; @@ -266,15 +267,15 @@ export const renderHtml = async ( ? filePath.slice((config.basePath + '@fs').length) : filePath ).split('?')[0]!; - const wakuDist = joinPath( fileURLToFilePath(import.meta.url), '../../..', ); - const fileWithAbsolutePath = + const fileWithAbsolutePath = encodeFilePathToAbsolute( !file.startsWith(opts.rootDir) && !file.startsWith(wakuDist) ? joinPath(opts.rootDir, file) - : file; + : file, + ); console.log('---file', file); console.log('---opts.rootDir', opts.rootDir); console.log('---wakuDist', wakuDist, fileWithAbsolutePath); From 37c874e820250c5cda014930b6ab8c7e6c100c13 Mon Sep 17 00:00:00 2001 From: daishi Date: Tue, 9 Apr 2024 23:49:46 +0900 Subject: [PATCH 17/25] encodeFilePathToAbsolute 2 --- packages/waku/src/lib/renderers/html-renderer.ts | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index 1aa8de93f..9b31b553f 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -271,14 +271,13 @@ export const renderHtml = async ( fileURLToFilePath(import.meta.url), '../../..', ); - const fileWithAbsolutePath = encodeFilePathToAbsolute( + const fileWithAbsolutePath = !file.startsWith(opts.rootDir) && !file.startsWith(wakuDist) - ? joinPath(opts.rootDir, file) - : file, - ); + ? encodeFilePathToAbsolute(joinPath(opts.rootDir, file)) + : file; console.log('---file', file); console.log('---opts.rootDir', opts.rootDir); - console.log('---wakuDist', wakuDist, fileWithAbsolutePath); + console.log('---wakuDist', wakuDist); console.log('---fileWithAbsolutePath', fileWithAbsolutePath); if ( file.startsWith(wakuDist) || From c7f16e8d04ed05540a6b7e478f0eefadf721b238 Mon Sep 17 00:00:00 2001 From: daishi Date: Tue, 9 Apr 2024 23:58:04 +0900 Subject: [PATCH 18/25] remove console log --- packages/waku/src/lib/renderers/dev-worker-impl.ts | 2 -- packages/waku/src/lib/renderers/html-renderer.ts | 4 ---- 2 files changed, 6 deletions(-) diff --git a/packages/waku/src/lib/renderers/dev-worker-impl.ts b/packages/waku/src/lib/renderers/dev-worker-impl.ts index f4a2bf6c5..6567635ab 100644 --- a/packages/waku/src/lib/renderers/dev-worker-impl.ts +++ b/packages/waku/src/lib/renderers/dev-worker-impl.ts @@ -50,7 +50,6 @@ const resolveClientEntryForDev = ( ) => { for (const moduleNode of initialModules) { if (moduleNode.file === id) { - console.log('resolveClientEntryForDev moduleNode.url', moduleNode.url); return moduleNode.url; } } @@ -60,7 +59,6 @@ const resolveClientEntryForDev = ( } else { filePath = config.basePath + '@fs' + encodeFilePathToAbsolute(filePath); } - console.log('resolveClientEntryForDev filePath', filePath); return filePath; }; diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index 9b31b553f..4ab8e2595 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -275,10 +275,6 @@ export const renderHtml = async ( !file.startsWith(opts.rootDir) && !file.startsWith(wakuDist) ? encodeFilePathToAbsolute(joinPath(opts.rootDir, file)) : file; - console.log('---file', file); - console.log('---opts.rootDir', opts.rootDir); - console.log('---wakuDist', wakuDist); - console.log('---fileWithAbsolutePath', fileWithAbsolutePath); if ( file.startsWith(wakuDist) || fileWithAbsolutePath.startsWith(wakuDist) From 84a0df571bf9095e80a3aaff8631262ddebe64dd Mon Sep 17 00:00:00 2001 From: daishi Date: Wed, 10 Apr 2024 09:03:09 +0900 Subject: [PATCH 19/25] fix e2e tests and format --- e2e/07_router_standalone.spec.ts | 12 +++--------- e2e/examples-smoke.spec.ts | 20 +++++--------------- e2e/rsc-basic.spec.ts | 15 +++------------ e2e/rsc-router.spec.ts | 12 +++--------- e2e/ssr-basic.spec.ts | 12 +++--------- e2e/ssr-context-provider.spec.ts | 27 ++++++--------------------- e2e/ssr-swr.spec.ts | 12 +++--------- e2e/ssr-target-bundle.spec.ts | 25 ++++++------------------- 8 files changed, 32 insertions(+), 103 deletions(-) diff --git a/e2e/07_router_standalone.spec.ts b/e2e/07_router_standalone.spec.ts index 9abd343dd..939e94607 100644 --- a/e2e/07_router_standalone.spec.ts +++ b/e2e/07_router_standalone.spec.ts @@ -21,9 +21,7 @@ const { version } = createRequire(import.meta.url)( ); async function testRouterExample(page: Page, port: number) { - await waitPort({ - port, - }); + await waitPort({ port }); await page.goto(`http://localhost:${port}`); await expect(page.getByRole('heading', { name: 'Home' })).toBeVisible(); @@ -78,9 +76,7 @@ test.describe('07_router standalone', () => { const port = await getFreePort(); const cp = exec( `node ${join(standaloneDir, './node_modules/waku/dist/cli.js')} start --port ${port}`, - { - cwd: standaloneDir, - }, + { cwd: standaloneDir }, ); debugChildProcess(cp, fileURLToPath(import.meta.url)); await testRouterExample(page, port); @@ -92,9 +88,7 @@ test.describe('07_router standalone', () => { const port = await getFreePort(); const cp = exec( `node ${join(standaloneDir, './node_modules/waku/dist/cli.js')} dev --port ${port}`, - { - cwd: standaloneDir, - }, + { cwd: standaloneDir }, ); debugChildProcess(cp, fileURLToPath(import.meta.url), [ /WebSocket server error: Port is already in use/, diff --git a/e2e/examples-smoke.spec.ts b/e2e/examples-smoke.spec.ts index 2f45ac199..1034c3e0f 100644 --- a/e2e/examples-smoke.spec.ts +++ b/e2e/examples-smoke.spec.ts @@ -72,13 +72,9 @@ for (const cwd of examples) { }); } port = await getFreePort(); - cp = exec(`${command} --port ${port}`, { - cwd, - }); + cp = exec(`${command} --port ${port}`, { cwd }); debugChildProcess(cp, fileURLToPath(import.meta.url)); - await waitPort({ - port, - }); + await waitPort({ port }); }); test.afterAll(async () => { @@ -107,14 +103,10 @@ for (const cwd of examples) { test.beforeAll(async () => { if (build) { - execSync(`node ${waku} ${build}`, { - cwd, - }); + execSync(`node ${waku} ${build}`, { cwd }); } port = await getFreePort(); - cp = exec(`node ${waku} ${command} --port ${port}`, { - cwd, - }); + cp = exec(`node ${waku} ${command} --port ${port}`, { cwd }); cp.stdout?.on('data', (data) => { info(`${port} stdout: ${data}`); console.log(`${port} stdout: `, `${data}`); @@ -130,9 +122,7 @@ for (const cwd of examples) { error(`${port} stderr: ${data}`); console.error(`${port} stderr: `, `${data}`); }); - await waitPort({ - port, - }); + await waitPort({ port }); }); test.afterAll(async () => { diff --git a/e2e/rsc-basic.spec.ts b/e2e/rsc-basic.spec.ts index 21e8203ea..56b65c604 100644 --- a/e2e/rsc-basic.spec.ts +++ b/e2e/rsc-basic.spec.ts @@ -34,18 +34,12 @@ for (const { build, command } of commands) { test.beforeAll(async () => { if (build) { - execSync(`node ${waku} ${build}`, { - cwd, - }); + execSync(`node ${waku} ${build}`, { cwd }); } port = await getFreePort(); - cp = exec(`node ${waku} ${command} --port ${port}`, { - cwd, - }); + cp = exec(`node ${waku} ${command} --port ${port}`, { cwd }); debugChildProcess(cp, fileURLToPath(import.meta.url)); - await waitPort({ - port, - }); + await waitPort({ port }); }); test.afterAll(async () => { @@ -54,9 +48,7 @@ for (const { build, command } of commands) { test('basic', async ({ page }) => { await page.goto(`http://localhost:${port}/`); - await expect(page.getByTestId('app-name')).toHaveText('Waku'); - await expect( page.getByTestId('client-counter').getByTestId('count'), ).toHaveText('0'); @@ -68,7 +60,6 @@ for (const { build, command } of commands) { await expect( page.getByTestId('client-counter').getByTestId('count'), ).toHaveText('2'); - await expect( page.getByTestId('server-ping').getByTestId('pong'), ).toBeEmpty(); diff --git a/e2e/rsc-router.spec.ts b/e2e/rsc-router.spec.ts index 18f3aaf7c..73bc6643f 100644 --- a/e2e/rsc-router.spec.ts +++ b/e2e/rsc-router.spec.ts @@ -34,18 +34,12 @@ for (const { build, command } of commands) { test.beforeAll(async () => { if (build) { - execSync(`node ${waku} ${build}`, { - cwd, - }); + execSync(`node ${waku} ${build}`, { cwd }); } port = await getFreePort(); - cp = exec(`node ${waku} ${command} --port ${port}`, { - cwd, - }); + cp = exec(`node ${waku} ${command} --port ${port}`, { cwd }); debugChildProcess(cp, fileURLToPath(import.meta.url)); - await waitPort({ - port, - }); + await waitPort({ port }); }); test.afterAll(async () => { diff --git a/e2e/ssr-basic.spec.ts b/e2e/ssr-basic.spec.ts index 46dc4b604..b9f81a007 100644 --- a/e2e/ssr-basic.spec.ts +++ b/e2e/ssr-basic.spec.ts @@ -34,18 +34,12 @@ for (const { build, command } of commands) { test.beforeAll(async () => { if (build) { - execSync(`node ${waku} ${build}`, { - cwd, - }); + execSync(`node ${waku} ${build}`, { cwd }); } port = await getFreePort(); - cp = exec(`node ${waku} ${command} --port ${port}`, { - cwd, - }); + cp = exec(`node ${waku} ${command} --port ${port}`, { cwd }); debugChildProcess(cp, fileURLToPath(import.meta.url)); - await waitPort({ - port, - }); + await waitPort({ port }); }); test.afterAll(async () => { diff --git a/e2e/ssr-context-provider.spec.ts b/e2e/ssr-context-provider.spec.ts index 09858136f..6611388da 100644 --- a/e2e/ssr-context-provider.spec.ts +++ b/e2e/ssr-context-provider.spec.ts @@ -2,7 +2,7 @@ import { expect } from '@playwright/test'; import { execSync, exec, ChildProcess } from 'node:child_process'; import { fileURLToPath } from 'node:url'; import waitPort from 'wait-port'; -import { getFreePort, test } from './utils.js'; +import { debugChildProcess, getFreePort, terminate, test } from './utils.js'; import { rm } from 'node:fs/promises'; const waku = fileURLToPath( @@ -36,31 +36,16 @@ for (const { build, command } of commands) { test.beforeAll(async () => { if (build) { - execSync(`node ${waku} ${build}`, { - cwd, - }); + execSync(`node ${waku} ${build}`, { cwd }); } port = await getFreePort(); - cp = exec(`node ${waku} ${command}`, { - cwd, - env: { - ...process.env, - PORT: `${port}`, - }, - }); - cp.stdout?.on('data', (data) => { - console.log(`${port} stdout: `, `${data}`); - }); - cp.stderr?.on('data', (data) => { - console.error(`${port} stderr: `, `${data}`); - }); - await waitPort({ - port, - }); + cp = exec(`node ${waku} ${command} --port ${port}`, { cwd }); + debugChildProcess(cp, fileURLToPath(import.meta.url)); + await waitPort({ port }); }); test.afterAll(async () => { - cp.kill(); + await terminate(cp.pid!); }); test('show context value', async ({ page }) => { diff --git a/e2e/ssr-swr.spec.ts b/e2e/ssr-swr.spec.ts index 4e2045b63..52dbc1128 100644 --- a/e2e/ssr-swr.spec.ts +++ b/e2e/ssr-swr.spec.ts @@ -34,18 +34,12 @@ for (const { build, command } of commands) { test.beforeAll(async () => { if (build) { - execSync(`node ${waku} ${build}`, { - cwd, - }); + execSync(`node ${waku} ${build}`, { cwd }); } port = await getFreePort(); - cp = exec(`node ${waku} ${command} --port ${port}`, { - cwd, - }); + cp = exec(`node ${waku} ${command} --port ${port}`, { cwd }); debugChildProcess(cp, fileURLToPath(import.meta.url)); - await waitPort({ - port, - }); + await waitPort({ port }); }); test.afterAll(async () => { diff --git a/e2e/ssr-target-bundle.spec.ts b/e2e/ssr-target-bundle.spec.ts index e6e6216bc..318ef8df0 100644 --- a/e2e/ssr-target-bundle.spec.ts +++ b/e2e/ssr-target-bundle.spec.ts @@ -2,7 +2,7 @@ import { expect } from '@playwright/test'; import { execSync, exec, ChildProcess } from 'node:child_process'; import { fileURLToPath } from 'node:url'; import waitPort from 'wait-port'; -import { getFreePort, test } from './utils.js'; +import { debugChildProcess, getFreePort, terminate, test } from './utils.js'; import { readdir, rm } from 'node:fs/promises'; import path from 'node:path'; @@ -37,27 +37,16 @@ for (const { build, command } of commands) { test.beforeAll(async () => { if (build) { - execSync(`node ${waku} ${build}`, { - cwd, - }); + execSync(`node ${waku} ${build}`, { cwd }); } port = await getFreePort(); - cp = exec(`node ${waku} ${command} --port ${port}`, { - cwd, - }); - cp.stdout?.on('data', (data) => { - console.log(`${port} stdout: `, `${data}`); - }); - cp.stderr?.on('data', (data) => { - console.error(`${port} stderr: `, `${data}`); - }); - await waitPort({ - port, - }); + cp = exec(`node ${waku} ${command} --port ${port}`, { cwd }); + debugChildProcess(cp, fileURLToPath(import.meta.url)); + await waitPort({ port }); }); test.afterAll(async () => { - cp.kill(); + await terminate(cp.pid!); }); test('image exists in folder public/assets', async () => { @@ -108,7 +97,6 @@ for (const { build, command } of commands) { await page.goto(`http://localhost:${port}/`); await page.waitForLoadState('domcontentloaded'); await expect(page.getByTestId('app-name')).toHaveText('Waku'); - page.on('response', (data) => { console.log( data.status(), @@ -124,7 +112,6 @@ for (const { build, command } of commands) { 'naturalWidth', 0, ); - await expect(page.getByTestId('json-private')).toHaveText('6'); const value = await page .getByTestId('json-public-linked') From 5e1ae0d669fda6eae86f15433f6fc224c026b8b9 Mon Sep 17 00:00:00 2001 From: daishi Date: Wed, 10 Apr 2024 09:33:56 +0900 Subject: [PATCH 20/25] refactor 1 --- packages/waku/src/lib/renderers/html-renderer.ts | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index 4ab8e2595..141e2ab32 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -275,10 +275,7 @@ export const renderHtml = async ( !file.startsWith(opts.rootDir) && !file.startsWith(wakuDist) ? encodeFilePathToAbsolute(joinPath(opts.rootDir, file)) : file; - if ( - file.startsWith(wakuDist) || - fileWithAbsolutePath.startsWith(wakuDist) - ) { + if (fileWithAbsolutePath.startsWith(wakuDist)) { const id = 'waku' + fileWithAbsolutePath From 651f04c965d98c2c43e3ca7f6894c8a170d273d2 Mon Sep 17 00:00:00 2001 From: daishi Date: Wed, 10 Apr 2024 09:48:46 +0900 Subject: [PATCH 21/25] revert if (!initialModules) --- .../waku/src/lib/middleware/dev-server.ts | 30 ++++++++++--------- 1 file changed, 16 insertions(+), 14 deletions(-) diff --git a/packages/waku/src/lib/middleware/dev-server.ts b/packages/waku/src/lib/middleware/dev-server.ts index 8e922ae3a..33fb6e3e0 100644 --- a/packages/waku/src/lib/middleware/dev-server.ts +++ b/packages/waku/src/lib/middleware/dev-server.ts @@ -165,21 +165,23 @@ export const devServer: Middleware = (options) => { vitePromise, ]); - // pre-process the mainJs file to see which modules are being sent to the browser by vite - // and using the same modules if possible in the bundlerConfig in the stream - const mainJs = `${config.basePath}${config.srcDir}/${config.mainJs}`; - await vite.transformRequest(mainJs); - const resolved = await vite.pluginContainer.resolveId(mainJs); - const resolvedModule = vite.moduleGraph.idToModuleMap.get(resolved!.id)!; - await Promise.all( - [...resolvedModule.importedModules].map(({ id }) => - id ? vite.warmupRequest(id) : null, - ), - ); + if (!initialModules) { + // pre-process the mainJs file to see which modules are being sent to the browser by vite + // and using the same modules if possible in the bundlerConfig in the stream + const mainJs = `${config.basePath}${config.srcDir}/${config.mainJs}`; + await vite.transformRequest(mainJs); + const resolved = await vite.pluginContainer.resolveId(mainJs); + const resolvedModule = vite.moduleGraph.idToModuleMap.get(resolved!.id)!; + await Promise.all( + [...resolvedModule.importedModules].map(({ id }) => + id ? vite.warmupRequest(id) : null, + ), + ); - initialModules = Array.from(vite.moduleGraph.idToModuleMap.values()).map( - (m) => ({ url: m.url, file: m.file! }), - ); + initialModules = Array.from(vite.moduleGraph.idToModuleMap.values()).map( + (m) => ({ url: m.url, file: m.file! }), + ); + } ctx.devServer = { rootDir: vite.config.root, From b7607996e125a32e7ae96cfac1993d9b5c6e6a47 Mon Sep 17 00:00:00 2001 From: daishi Date: Wed, 10 Apr 2024 10:28:29 +0900 Subject: [PATCH 22/25] wip: debug with log --- packages/waku/src/lib/renderers/html-renderer.ts | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index 141e2ab32..7ab9124b6 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -271,10 +271,11 @@ export const renderHtml = async ( fileURLToFilePath(import.meta.url), '../../..', ); - const fileWithAbsolutePath = - !file.startsWith(opts.rootDir) && !file.startsWith(wakuDist) - ? encodeFilePathToAbsolute(joinPath(opts.rootDir, file)) - : file; + const fileWithAbsolutePath = !file.startsWith(opts.rootDir) + ? encodeFilePathToAbsolute(joinPath(opts.rootDir, file)) + : file; + console.log('fileWithAbsolutePath', fileWithAbsolutePath); + console.log('file', file); if (fileWithAbsolutePath.startsWith(wakuDist)) { const id = 'waku' + From 083d20ea72a620d639fdac64c386a5ede1d31511 Mon Sep 17 00:00:00 2001 From: daishi Date: Wed, 10 Apr 2024 10:43:24 +0900 Subject: [PATCH 23/25] wip: debug with log 2 --- packages/waku/src/lib/renderers/html-renderer.ts | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index 7ab9124b6..de329c1c7 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -262,8 +262,11 @@ export const renderHtml = async ( get(_target, name: string) { if (isDev) { // TODO too long, we need to refactor this logic + const isFullPath = filePath + .slice(config.basePath.length) + .startsWith('@fs/'); const file = ( - filePath.slice(config.basePath.length).startsWith('@fs/') + isFullPath ? filePath.slice((config.basePath + '@fs').length) : filePath ).split('?')[0]!; @@ -271,11 +274,12 @@ export const renderHtml = async ( fileURLToFilePath(import.meta.url), '../../..', ); - const fileWithAbsolutePath = !file.startsWith(opts.rootDir) + const fileWithAbsolutePath = !isFullPath ? encodeFilePathToAbsolute(joinPath(opts.rootDir, file)) : file; console.log('fileWithAbsolutePath', fileWithAbsolutePath); console.log('file', file); + console.log('wakuDist', wakuDist); if (fileWithAbsolutePath.startsWith(wakuDist)) { const id = 'waku' + From bbab20569bcdca20f01c149c37578822271f966a Mon Sep 17 00:00:00 2001 From: daishi Date: Wed, 10 Apr 2024 10:58:05 +0900 Subject: [PATCH 24/25] refactor 2 --- packages/waku/src/lib/renderers/html-renderer.ts | 13 +++++-------- 1 file changed, 5 insertions(+), 8 deletions(-) diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index de329c1c7..10b03acfa 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -262,24 +262,21 @@ export const renderHtml = async ( get(_target, name: string) { if (isDev) { // TODO too long, we need to refactor this logic - const isFullPath = filePath + const isFsPath = filePath .slice(config.basePath.length) .startsWith('@fs/'); const file = ( - isFullPath + isFsPath ? filePath.slice((config.basePath + '@fs').length) : filePath ).split('?')[0]!; + const fileWithAbsolutePath = isFsPath + ? file + : encodeFilePathToAbsolute(joinPath(opts.rootDir, file)); const wakuDist = joinPath( fileURLToFilePath(import.meta.url), '../../..', ); - const fileWithAbsolutePath = !isFullPath - ? encodeFilePathToAbsolute(joinPath(opts.rootDir, file)) - : file; - console.log('fileWithAbsolutePath', fileWithAbsolutePath); - console.log('file', file); - console.log('wakuDist', wakuDist); if (fileWithAbsolutePath.startsWith(wakuDist)) { const id = 'waku' + From 95ee43aab0dbeab7fb05d6d6773316389afea828 Mon Sep 17 00:00:00 2001 From: daishi Date: Wed, 10 Apr 2024 11:17:07 +0900 Subject: [PATCH 25/25] refactor 3 --- packages/waku/src/lib/renderers/dev-worker-impl.ts | 10 +++++----- packages/waku/src/lib/renderers/html-renderer.ts | 11 ++++------- 2 files changed, 9 insertions(+), 12 deletions(-) diff --git a/packages/waku/src/lib/renderers/dev-worker-impl.ts b/packages/waku/src/lib/renderers/dev-worker-impl.ts index 6567635ab..2a1af0138 100644 --- a/packages/waku/src/lib/renderers/dev-worker-impl.ts +++ b/packages/waku/src/lib/renderers/dev-worker-impl.ts @@ -53,13 +53,13 @@ const resolveClientEntryForDev = ( return moduleNode.url; } } - let filePath = id.startsWith('file://') ? fileURLToFilePath(id) : id; - if (filePath.startsWith(config.rootDir)) { - filePath = filePath.slice(config.rootDir.length); + let file = id.startsWith('file://') ? fileURLToFilePath(id) : id; + if (file.startsWith(config.rootDir)) { + file = file.slice(config.rootDir.length + 1); // '+ 1' to remove '/' } else { - filePath = config.basePath + '@fs' + encodeFilePathToAbsolute(filePath); + file = '@fs' + encodeFilePathToAbsolute(file); } - return filePath; + return config.basePath + file; }; const handleRender = async (mesg: MessageReq & { type: 'render' }) => { diff --git a/packages/waku/src/lib/renderers/html-renderer.ts b/packages/waku/src/lib/renderers/html-renderer.ts index 10b03acfa..0deff18ee 100644 --- a/packages/waku/src/lib/renderers/html-renderer.ts +++ b/packages/waku/src/lib/renderers/html-renderer.ts @@ -262,14 +262,11 @@ export const renderHtml = async ( get(_target, name: string) { if (isDev) { // TODO too long, we need to refactor this logic - const isFsPath = filePath + let file = filePath .slice(config.basePath.length) - .startsWith('@fs/'); - const file = ( - isFsPath - ? filePath.slice((config.basePath + '@fs').length) - : filePath - ).split('?')[0]!; + .split('?')[0]!; + const isFsPath = file.startsWith('@fs/'); + file = '/' + (isFsPath ? file.slice('@fs/'.length) : file); const fileWithAbsolutePath = isFsPath ? file : encodeFilePathToAbsolute(joinPath(opts.rootDir, file));