add e2e for external rewrite in middleware in app-router (#793)

* add e2e for external rewrite in middleware in app-router

* review

Author: sommeeeer

examples/app-router/middleware.ts

@@ -24,6 +24,10 @@ export function middleware(request: NextRequest) {
       },
     });
   }
+  if (path === "/rewrite-external") {
+    const u = new URL("https://opennext.js.org/share.png");
+    return NextResponse.rewrite(u);
+  }
   const requestHeaders = new Headers();
   // Setting the Request Headers, this should be available in RSC
   requestHeaders.set("request-header", "request-header");

packages/tests-e2e/tests/appRouter/middleware.rewrite.test.ts

@@ -1,4 +1,11 @@
 import { expect, test } from "@playwright/test";
+import { validateMd5 } from "../utils";
+
+/*
+ * `curl -s https://opennext.js.org/share.png | md5sum`
+ * This is the MD5 hash of the image. It is used to validate the image content.
+ */
+const OPENNEXT_PNG_MD5 = "405f45cc3397b09717a13ebd6f1e027b";
 
 test("Middleware Rewrite", async ({ page }) => {
   await page.goto("/");
@@ -14,3 +21,14 @@ test("Middleware Rewrite", async ({ page }) => {
   el = page.getByText("Rewritten Destination", { exact: true });
   await expect(el).toBeVisible();
 });
+
+test("Middleware Rewrite External Image", async ({ page }) => {
+  await page.goto("/rewrite-external");
+  page.on("response", async (response) => {
+    expect(response.status()).toBe(200);
+    expect(response.headers()["content-type"]).toBe("image/png");
+    expect(response.headers()["cache-control"]).toBe("max-age=600");
+    const bodyBuffer = await response.body();
+    expect(validateMd5(bodyBuffer, OPENNEXT_PNG_MD5)).toBe(true);
+  });
+});