import {
concatArrayBuffers,
readableStreamToArray,
readableStreamToArrayBuffer,
readableStreamToBlob,
readableStreamToText,
serve,
} from "bun";
import { heapStats } from "bun:jsc";
import { describe, expect, it } from "bun:test";
import { renderToReadableStream as renderToReadableStreamBrowser } from "react-dom/server.browser";
import { gc } from "./gc";
import { renderToReadableStream as renderToReadableStreamBun } from "./react-dom-server.bun.cjs";
import React from "react";
Object.defineProperty(renderToReadableStreamBrowser, "name", {
value: "server.browser",
});
Object.defineProperty(renderToReadableStreamBun, "name", {
value: "server.bun",
});
var port = 8908;
const fixtures = [
// Needs at least six variations
// - < 8 chars, latin1
// - 8+ chars, latin1
// - 16+ chars, latin1
// - < 8 chars, utf16
// - 8+ chars, utf16
// - 16+ chars, utf16
["b", b],
["Hello World!", Hello World!],
["", ],
["π", π],
["π", π],
["Hello World! π", Hello World! π],
[
"Hello World!π",
<>
Hello World!π
>,
],
[
"πHello World!",
<>
πHello World!
>,
],
["π", <>π>],
["lπl", <>lπl>],
["loπ", <>loπ>],
["πlo", <>πlo>],
[
"πHello World!",
<>
π
Hello World!
>,
],
[
"ππππHello World!",
<>
ππππ
Hello World!
>,
],
["HelloππππWorld!", HelloππππWorld!],
[
"Hello World!ππππ",
<>
Hello World!
ππππ
>,
],
[
"πLπlπLπAlternating latin1 & utf16",
<>
πLπlπLπAlternating latin1 & utf16
>,
],
["HelloπLπlπLπWorld!", HelloπLπlπLπWorld!],
[
"Hello World!πLπlπLπ",
<>
Hello World!
πLπlπLπ
>,
],
];
describe("React", () => {
it("React.createContext works", () => {
expect(typeof React.createContext).toBe("function");
const pleaseDontThrow = React.createContext({ foo: true });
expect((pleaseDontThrow as any).$$typeof.description).toBe("react.context");
const pleaseDontThrow2 = (React as any).default.createContext({
foo: true,
});
expect(pleaseDontThrow2.$$typeof.description).toBe("react.context");
});
});
describe("ReactDOM", () => {
for (let renderToReadableStream of [renderToReadableStreamBun, renderToReadableStreamBrowser]) {
for (let [inputString, reactElement] of fixtures) {
describe(`${renderToReadableStream.name}(${inputString})`, () => {
it("Response.text()", async () => {
const stream = await renderToReadableStream(reactElement);
gc();
const response = new Response(stream);
gc();
try {
const text = await response.text();
gc();
expect(text.replaceAll("", "")).toBe(inputString);
gc();
} catch (e: any) {
console.log(e.stack);
throw e;
}
});
it("Response.arrayBuffer()", async () => {
const stream = await renderToReadableStream(reactElement);
gc();
const response = new Response(stream);
gc();
const text = new TextDecoder().decode(await response.arrayBuffer());
gc();
expect(text.replaceAll("", "")).toBe(inputString);
gc();
});
it("Response.blob()", async () => {
const stream = await renderToReadableStream(reactElement);
gc();
const response = new Response(stream);
gc();
const text = await (await response.blob()).text();
gc();
expect(text.replaceAll("", "")).toBe(inputString);
gc();
});
it("readableStreamToText(stream)", async () => {
const stream = await renderToReadableStream(reactElement);
gc();
const text = await readableStreamToText(stream);
gc();
expect(text.replaceAll("", "")).toBe(inputString);
gc();
});
it("readableStreamToBlob(stream)", async () => {
try {
const stream = await renderToReadableStream(reactElement);
gc();
const blob = await readableStreamToBlob(stream);
const text = await blob.text();
gc();
expect(text.replaceAll("", "")).toBe(inputString);
gc();
} catch (e: any) {
console.error(e.message);
console.error(e.stack);
throw e;
}
});
it("readableStreamToArray(stream)", async () => {
const stream = await renderToReadableStream(reactElement);
gc();
const array = await readableStreamToArray(stream);
const text =
renderToReadableStream === renderToReadableStreamBun
? array.join("")
: new TextDecoder().decode(concatArrayBuffers(array as any[]));
gc();
expect(text.replaceAll("", "")).toBe(inputString);
gc();
});
it("readableStreamToArrayBuffer(stream)", async () => {
const stream = await renderToReadableStream(reactElement);
gc();
const arrayBuffer = await readableStreamToArrayBuffer(stream);
const text = new TextDecoder().decode(arrayBuffer);
gc();
expect(text.replaceAll("", "")).toBe(inputString);
gc();
});
it("for await (chunk of stream)", async () => {
const stream = await renderToReadableStream(reactElement);
gc();
const chunks: any = [];
for await (let chunk of stream) {
chunks.push(chunk);
}
const text = await new Response(chunks).text();
gc();
expect(text.replaceAll("", "")).toBe(inputString);
gc();
});
it("for await (chunk of stream) (arrayBuffer)", async () => {
const stream = await renderToReadableStream(reactElement);
gc();
const chunks: any[] = [];
for await (let chunk of stream) {
chunks.push(chunk);
}
const text = new TextDecoder().decode(await new Response(chunks as any).arrayBuffer());
gc();
expect(text.replaceAll("", "")).toBe(inputString);
gc();
});
});
}
}
for (let renderToReadableStream of [renderToReadableStreamBun, renderToReadableStreamBrowser]) {
// there is an event loop bug that causes deadlocks
// the bug is with `fetch`, not with the HTTP server
for (let [inputString, reactElement] of fixtures) {
describe(`${renderToReadableStream.name}(${inputString})`, () => {
it("http server, 1 request", async () => {
await (async function () {
var server;
try {
server = serve({
port: port++,
async fetch(req) {
return new Response(await renderToReadableStream(reactElement));
},
});
const resp = await fetch("http://localhost:" + server.port + "/");
expect((await resp.text()).replaceAll("", "")).toBe(inputString);
gc();
} catch (e) {
throw e;
} finally {
server?.stop();
gc();
}
})();
gc();
expect(heapStats().objectTypeCounts.ReadableHTTPResponseSinkController ?? 0).toBe(1);
});
const count = 4;
it(`http server, ${count} requests`, async () => {
var remain = count;
await (async function () {
var server;
try {
server = serve({
port: port++,
async fetch(req) {
return new Response(await renderToReadableStream(reactElement));
},
});
gc();
while (remain--) {
var attempt = remain + 1;
const response = await fetch("http://localhost:" + server.port + "/");
gc();
const result = await response.text();
try {
expect(result.replaceAll("", "")).toBe(inputString);
} catch (e: any) {
e.message += "\nAttempt: " + attempt;
throw e;
}
gc();
}
} catch (e) {
throw e;
} finally {
server.stop();
}
})();
const { ReadableHTTPResponseSinkController = 0 } = heapStats().objectTypeCounts;
expect(ReadableHTTPResponseSinkController).toBe(1);
expect(remain + 1).toBe(0);
});
});
}
}
});