Add Pages Functions example test project (#617)

.changeset/pink-apricots-fix.md

@@ -0,0 +1,5 @@
+---
+"pages-functions-example": patch
+---
+
+Added a Pages Functions example project for tests

packages/example-pages-functions-app/functions/blog/[slug].ts

@@ -0,0 +1,6 @@
+export const onRequestGet: PagesFunction<unknown, "slug"> = ({ params }) => {
+  const { slug } = params;
+  return new Response(`<h1>A blog with a slug: ${slug}</h1>`, {
+    headers: { "content-type": "text/html" },
+  });
+};

packages/example-pages-functions-app/functions/date.ts

@@ -0,0 +1,3 @@
+export const onRequest = () => {
+  return new Response(new Date().toISOString());
+};

packages/example-pages-functions-app/functions/intercept.ts

@@ -0,0 +1,10 @@
+export const onRequest: PagesFunction = async ({ next }) => {
+  const response = await next();
+  return new Response(response.body, {
+    status: response.status,
+    headers: {
+      ...Object.fromEntries(response.headers.entries()),
+      "x-set-from-functions": "true",
+    },
+  });
+};

packages/example-pages-functions-app/package.json

@@ -0,0 +1,34 @@
+{
+  "private": true,
+  "name": "pages-functions-example",
+  "scripts": {
+    "dev": "npx wrangler pages dev public --port 8789",
+    "test": "npx jest --forceExit"
+  },
+  "devDependencies": {
+    "@cloudflare/workers-types": "^3.2.0",
+    "typescript": "^4.1.2",
+    "undici": "^4.13.0"
+  },
+  "engines": {
+    "node": ">=14"
+  },
+  "sideEffects": false,
+  "main": "dist/worker.js",
+  "jest": {
+    "restoreMocks": true,
+    "testTimeout": 30000,
+    "testRegex": ".*.(test|spec)\\.[jt]sx?$",
+    "transformIgnorePatterns": [
+      "node_modules/(?!find-up|locate-path|p-locate|p-limit|yocto-queue|path-exists|execa|strip-final-newline|npm-run-path|path-key|onetime|mimic-fn|human-signals|is-stream)"
+    ],
+    "transform": {
+      "^.+\\.c?(t|j)sx?$": [
+        "esbuild-jest",
+        {
+          "sourcemap": true
+        }
+      ]
+    }
+  }
+}

packages/example-pages-functions-app/public/index.html

@@ -0,0 +1 @@
+<h1>Hello, world!</h1>

packages/example-pages-functions-app/tests/index.test.ts

@@ -0,0 +1,63 @@
+import { spawn } from "child_process";
+import { resolve } from "path";
+import { fetch } from "undici";
+import type { Response } from "undici";
+
+const waitUntilReady = async (url: string): Promise<Response> => {
+  let response: Response | undefined = undefined;
+
+  while (response === undefined) {
+    await new Promise((resolvePromise) => setTimeout(resolvePromise, 500));
+
+    try {
+      response = await fetch(url);
+    } catch {}
+  }
+
+  return response as Response;
+};
+
+const isWindows = process.platform === "win32";
+
+describe("Remix", () => {
+  beforeAll(async () => {
+    const wranglerProcess = spawn("npm", ["run", "dev"], {
+      shell: isWindows,
+      cwd: resolve(__dirname, "../"),
+      env: { BROWSER: "none", ...process.env },
+    });
+    wranglerProcess.stdout.on("data", (chunk) => {
+      console.log(chunk.toString());
+    });
+    wranglerProcess.stderr.on("data", (chunk) => {
+      console.log(chunk.toString());
+    });
+  });
+
+  it("renders static pages", async () => {
+    const response = await waitUntilReady("http://localhost:8789/");
+    const text = await response.text();
+    expect(text).toContain("Hello, world!");
+  });
+
+  it("intercepts static requests with next()", async () => {
+    const response = await waitUntilReady("http://localhost:8789/intercept");
+    const text = await response.text();
+    expect(text).toContain("Hello, world!");
+    expect(response.headers.get("x-set-from-functions")).toBe("true");
+  });
+
+  it("can make SSR responses", async () => {
+    const response = await waitUntilReady("http://localhost:8789/date");
+    const text = await response.text();
+    expect(text).toMatch(/\d{4}-\d\d-\d\dT\d\d:\d\d:\d\d/);
+  });
+
+  it("can use parameters", async () => {
+    const response = await waitUntilReady(
+      "http://localhost:8789/blog/hello-world"
+    );
+    const text = await response.text();
+    expect(text).toContain("<h1>A blog with a slug: hello-world</h1>");
+  });
+});

packages/example-pages-functions-app/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "include": ["functions"],
+  "compilerOptions": {
+    "target": "ES2020",
+    "module": "CommonJS",
+    "lib": ["ES2020"],
+    "types": ["@cloudflare/workers-types"]
+  }
+}