Moduletrace/bunext
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Hydration bugfix

Browse Source
This commit is contained in:
Benjamin Toby 2026-04-08 08:08:27 +01:00
parent 6b7d29bc53
commit ab6fc3be26
8 changed files with 89 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dist/functions/bundler/grab-client-hydration-script.js vendored
View File

@ -44,7 +44,7 @@ export default async function grabClientHydrationScript({ page_local_path, }) {
txt += ` window.${ClientRootComponentWindowName}.render(component);\n`;
txt += `} else {\n`;
txt += ` const root = hydrateRoot(document.getElementById("${ClientRootElementIDName}"), component, { onRecoverableError: () => {\n\n`;
// txt += ` console.log(\`Hydration Error.\`)\n\n`;
txt += ` console.log(\`Hydration Error.\`)\n\n`;
txt += ` } });\n\n`;
txt += ` window.${ClientRootComponentWindowName} = root;\n`;
txt += ` window.__BUNEXT_RERENDER__ = (NewPage) => {\n`;

42
dist/functions/server/web-pages/generate-web-html.js vendored
View File

@ -48,34 +48,34 @@ export default async function genWebHTML({ component, pageProps, bundledMap, mod
__html: page_hydration_script,
}, "data-bunext-head": true })) : null] }), _jsx("body", { children: _jsx("div", { id: ClientRootElementIDName, suppressHydrationWarning: !dev, children: component }) })] }));
let html = `<!DOCTYPE html>\n`;
// const stream = await renderToReadableStream(final_component, {
// onError(error: any) {
// if (error.message.includes('unique "key" prop')) return;
// console.error(error);
// },
// });
// const htmlBody = await new Response(stream).text();
const originalConsole = {
log: console.log,
warn: console.warn,
error: console.error,
info: console.info,
debug: console.debug,
};
console.log = () => { };
console.warn = () => { };
console.error = () => { };
console.info = () => { };
console.debug = () => { };
const stream = await renderToReadableStream(final_component, {
onError(error) {
if (error.message.includes('unique "key" prop'))
return;
console.error(error);
originalConsole.error(error);
},
});
const htmlBody = await new Response(stream).text();
// const originalConsole = {
// log: console.log,
// warn: console.warn,
// error: console.error,
// info: console.info,
// debug: console.debug,
// };
// console.log = () => {};
// console.warn = () => {};
// console.error = () => {};
// console.info = () => {};
// console.debug = () => {};
// const stream = await renderToReadableStream(final_component, {
// onError(error: any) {
// if (error.message.includes('unique "key" prop')) return;
// originalConsole.error(error);
// },
// });
// const htmlBody = await new Response(stream).text();
// Object.assign(console, originalConsole);
Object.assign(console, originalConsole);
html += htmlBody;
return html;
}

14
dist/functions/server/web-pages/grab-page-component.js vendored
View File

@ -5,6 +5,11 @@ import { log } from "../../../utils/log";
import grabPageModules from "./grab-page-modules";
import grabPageCombinedServerRes from "./grab-page-combined-server-res";
class NotFoundError extends Error {
status = 404;
constructor(message) {
super(message);
this.name = "NotFoundError";
}
}
export default async function grabPageComponent({ req, file_path: passed_file_path, debug, return_server_res_only, }) {
const url = req?.url ? new URL(req.url) : undefined;
@ -69,11 +74,16 @@ export default async function grabPageComponent({ req, file_path: passed_file_pa
};
}
catch (error) {
log.error(`Error Grabbing Page Component: ${error.message}`);
const is404 = error instanceof NotFoundError ||
error?.name === "NotFoundError" ||
error?.status === 404;
if (!is404) {
log.error(`Error Grabbing Page Component: ${error.message}`);
}
return await grabPageErrorComponent({
error,
routeParams,
is404: error instanceof NotFoundError,
is404,
url,
});
}

3
dist/functions/server/web-pages/grab-page-react-component-string.js vendored
View File

@ -4,9 +4,6 @@ export default function grabPageReactComponentString({ file_path, root_file_path
try {
let tsx = ``;
const server_res_json = JSON.stringify(EJSON.stringify(server_res || {}) ?? "{}");
// Import directly from the source page files. The generated TSX is
// bundled before execution, which keeps Root, Page, and any __root
// context consumers inside one module graph for SSR.
if (root_file_path) {
tsx += `import Root from "${root_file_path}"\n`;
}

2
dist/functions/server/web-pages/grab-tsx-string-module.js vendored
View File

@ -2,6 +2,7 @@ import isDevelopment from "../../../utils/is-development";
import * as esbuild from "esbuild";
import grabDirNames from "../../../utils/grab-dir-names";
import path from "path";
import tailwindEsbuildPlugin from "./tailwind-esbuild-plugin";
export default async function grabTsxStringModule({ tsx, }) {
const dev = isDevelopment();
const now = Date.now();
@ -29,6 +30,7 @@ export default async function grabTsxStringModule({ tsx, }) {
},
jsx: "automatic",
outfile: target_cache_file_path,
plugins: [tailwindEsbuildPlugin],
});
Loader.registry.delete(target_cache_file_path);
const mod = await import(`${target_cache_file_path}?t=${now}`);

2
package.json
View File

@ -1,6 +1,6 @@
{
"name": "@moduletrace/bunext",
"version": "1.0.57",
"version": "1.0.58",
"main": "dist/index.js",
"module": "index.ts",
"dependencies": {

35
src/__tests__/functions/server/grab-page-component.test.tsx Normal file
View File

@ -0,0 +1,35 @@
import { afterEach, describe, expect, mock, test } from "bun:test";
import path from "path";
mock.module("../../../../src/utils/log", () => ({
log: {
info: mock((msg: string) => {}),
error: mock((msg: string) => {}),
},
}));
import { log } from "../../../../src/utils/log";
import grabPageComponent from "../../../../src/functions/server/web-pages/grab-page-component";
describe("grabPageComponent", () => {
const originalRouter = global.ROUTER;
afterEach(() => {
global.ROUTER = originalRouter;
mock.restore();
});
test("does not log an error for expected 404 page lookups", async () => {
global.ROUTER = new Bun.FileSystemRouter({
style: "nextjs",
dir: path.resolve(__dirname, "../../../../test/e2e-fixture/src/pages"),
});
const res = await grabPageComponent({
req: new Request("http://localhost:3000/unknown-foo-bar123"),
});
expect(res.serverRes?.responseOptions?.status).toBe(404);
expect(log.error).not.toHaveBeenCalled();
});
});

20
src/functions/server/web-pages/grab-page-component.tsx
View File

@ -6,7 +6,14 @@ import { log } from "../../../utils/log";
import grabPageModules from "./grab-page-modules";
import grabPageCombinedServerRes from "./grab-page-combined-server-res";
class NotFoundError extends Error {}
class NotFoundError extends Error {
status = 404;
constructor(message: string) {
super(message);
this.name = "NotFoundError";
}
}
type Params = {
req?: Request;
@ -100,12 +107,19 @@ export default async function grabPageComponent({
root_module,
};
} catch (error: any) {
log.error(`Error Grabbing Page Component: ${error.message}`);
const is404 =
error instanceof NotFoundError ||
error?.name === "NotFoundError" ||
error?.status === 404;
if (!is404) {
log.error(`Error Grabbing Page Component: ${error.message}`);
}
return await grabPageErrorComponent({
error,
routeParams,
is404: error instanceof NotFoundError,
is404,
url,
});
}