fix: CustomRequest instantiation (#202)

Author: vicb

.changeset/nine-fireants-protect.md

@@ -0,0 +1,9 @@
+---
+"@opennextjs/cloudflare": patch
+---
+
+fix: CustomRequest instantiation
+
+In some cases some request properties would not be initialized (i.e. method, headers, ...)
+The bug was caused by the processing the init in the CustomRequest class.
+The bug was tigerred when using clerk.

examples/middleware/app/clerk/route.ts

@@ -0,0 +1,3 @@
+export async function POST(request: Request) {
+  return new Response(`Hello clerk`);
+}

examples/middleware/e2e/base.spec.ts

@@ -27,3 +27,11 @@ test("matching noop middleware", async ({ page }) => {
   expect(page.waitForURL("**/middleware"));
   expect(await page.textContent("h1")).toContain("Via middleware");
 });
+
+// Test for https://github.com/opennextjs/opennextjs-cloudflare/issues/201
+test("clerk middleware", async ({ page }) => {
+  const res = await page.request.post("/clerk", { data: "some body" });
+  expect(res.ok()).toEqual(true);
+  expect(res.status()).toEqual(200);
+  await expect(res.text()).resolves.toEqual("Hello clerk");
+});

examples/middleware/middleware.ts

@@ -1,16 +1,24 @@
-import { NextRequest, NextResponse } from "next/server";
+import { NextRequest, NextResponse, NextFetchEvent } from "next/server";
+import { clerkMiddleware } from "@clerk/nextjs/server";
 
-export function middleware(request: NextRequest) {
+export function middleware(request: NextRequest, event: NextFetchEvent) {
   console.log("middleware");
   if (request.nextUrl.pathname === "/about") {
     return NextResponse.redirect(new URL("/redirected", request.url));
   }
   if (request.nextUrl.pathname === "/another") {
     return NextResponse.rewrite(new URL("/rewrite", request.url));
   }
+  if (request.nextUrl.pathname === "/clerk") {
+    return clerkMiddleware(async () => {}, {
+      publishableKey: "pk_test_ZXhhbXBsZS5hY2NvdW50cy5kZXYk",
+      secretKey: "skey",
+    })(request, event);
+  }
+
   return NextResponse.next();
 }
 
 export const config = {
-  matcher: ["/about/:path*", "/another/:path*", "/middleware/:path*"],
+  matcher: ["/about/:path*", "/another/:path*", "/middleware/:path*", "/clerk"],
 };

examples/middleware/package.json

@@ -12,6 +12,7 @@
     "e2e": "playwright test -c e2e/playwright.config.ts"
   },
   "dependencies": {
+    "@clerk/nextjs": "6.9.6",
     "next": "catalog:",
     "react": "catalog:",
     "react-dom": "catalog:"

packages/cloudflare/src/cli/build/bundle-server.ts

@@ -94,13 +94,12 @@ fetch = globalThis.fetch;
 const CustomRequest = class extends globalThis.Request {
   constructor(input, init) {
     if (init) {
-      init = {
-        ...init,
-        cache: undefined,
-        // https://github.com/cloudflare/workerd/issues/2746
-        // https://github.com/cloudflare/workerd/issues/3245
-        body: init.body instanceof __cf_stream.Readable ? ReadableStream.from(init.body) : init.body,
-      };
+      init.cache = undefined;
+      // https://github.com/cloudflare/workerd/issues/2746
+      // https://github.com/cloudflare/workerd/issues/3245
+      Object.defineProperty(init, "body", {
+        value: init.body instanceof __cf_stream.Readable ? ReadableStream.from(init.body) : init.body;
+      });
     }
     super(input, init);
   }