Error when deploying to Vercel Edge Functions

[joshdchang]

Description

I am using Vercel Edge Functions and Solid.js

This is the code for the renderer function that fails (api/ssr.ts):

import { renderPage } from "vite-plugin-ssr";

export const config = {
  runtime: "edge",
  regions: ["iad1"],
};

export default async (request: Request) => {
  const { url } = request;
  console.log("Request to url:", url);

  const pageContextInit = { url };
  const pageContext = await renderPage(pageContextInit);
  const { httpResponse } = pageContext;

  if (!httpResponse) {
    return new Response(null, {
      status: 200,
    });
  }

  return new Response(httpResponse.body, {
    status: httpResponse.statusCode,
    headers: {
      "content-type": httpResponse.contentType,
    },
  });
};

Error message + stack trace are included.

Error Message + Error Stack

Error: [vite-plugin-ssr@0.4.118][Bug] You stumbled upon a bug in vite-plugin-ssr's source code. Go to https://github.com/brillout/vite-plugin-ssr/issues/new and copy-paste this error. (The error's stack trace is usually enough to fix the problem). A maintainer will fix the bug (usually under 24 hours). Don't hesitate to reach out as it makes vite-plugin-ssr more robust.
    at (node_modules/.pnpm/vite-plugin-ssr@0.4.118_vite@4.3.3/node_modules/vite-plugin-ssr/dist/esm/utils/createErrorWithCleanStackTrace.js:8:0)
    at (node_modules/.pnpm/vite-plugin-ssr@0.4.118_vite@4.3.3/node_modules/vite-plugin-ssr/dist/esm/utils/assert.js:32:0)
    at (node_modules/.pnpm/vite-plugin-ssr@0.4.118_vite@4.3.3/node_modules/vite-plugin-ssr/dist/esm/client/utils.js:5:0)
    at (node_modules/.pnpm/vite-plugin-ssr@0.4.118_vite@4.3.3/node_modules/vite-plugin-ssr/dist/esm/client/node.js:1:0)
    at (apps/vite-ssr/api/ssr.js:1:0)
    at (api/ssr:middleware.js:1:17)

[brillout]

Thanks for the bug report.

What is the content of node_modules/.pnpm/vite-plugin-ssr@0.4.118_vite@4.3.3/node_modules/vite-plugin-ssr/dist/esm/client/utils.js:5:0? I.e.: which assert() is failing?

Or reproduction if you prefer.

[joshdchang]

Thank you for looking into this!

Here is the file:

// Utils needed by Server Routing.
// Ensure we don't bloat the server-side with client utils
import { isBrowser } from '../utils/isBrowser';
import { assert } from '../utils/assert';
assert(isBrowser());
export * from '../utils/assert';
export * from '../utils/assertSingleInstance';
export * from '../utils/callHookWithTimeout';
export * from '../utils/checkType'; // Only used by Server Routing (not needed for Client Routing)
export * from '../utils/getCurrentUrl';
export * from '../utils/getGlobalObject';
export * from '../utils/hasProp';
export * from '../utils/isCallable';
export * from '../utils/isObject';
export * from '../utils/objectAssign';
export * from '../utils/parseUrl';
export * from '../utils/projectInfo';
export * from '../utils/slice';
export * from '../utils/unique'; // Only used by Server Routing (not needed for Client Routing)

Line 5 is assert(isBrowser());. My assumption would be that isBrowser is being tripped up by the Edge Runtime, which looks a lot like a browser environment.

[brillout]

It's quite unexpected though:

https://github.com/brillout/vite-plugin-ssr/blob/eeb74d3ab3d6d3dabc143aaaf3127a8215321953/vite-plugin-ssr/utils/isBrowser.ts#L1-L4

I guess at this point a reproduction would be the best.

[joshdchang]

https://github.com/joshdchang/vps-edge-error

Let me know if this works.

[brillout]

Reproduction steps?

[joshdchang]

Yes, sorry.

1. https://vercel.com/new/git/third-party
2. Paste https://github.com/joshdchang/vps-edge-error
3. Follow the prompts to connect to Git and deploy
4. Navigate to the deployment (like something.vercel.app)
5. You should see an error message - you can go to the Functions tab under the deployment in Vercel to see the error logs for the function

[brillout]

I made it work with vite-plugin-ssr on my fork: https://github.com/brillout/vps-edge-error.

But seems like Solid is having a similar issue:

Error: zo is not supported in the browser, returning undefined
    at (node_modules/.pnpm/solid-js@1.7.3/node_modules/solid-js/web/dist/web.js:537:0

[brillout]

Vite-plugin-ssr now itself works with Vercel's Edge Runtime. Fix released in 0.4.119.

As for Solid's error, I think the Edge Runtime should pick worker instead of browser. I recommend you to reach out to Vercel and tell them that.

[joshdchang]

Thank you for looking into this so quickly and finding a fix! I agree that worker would make more sense - I will send the Vercel people a note.

[brillout]

👍Also in case you think you can convince your employer: https://github.com/sponsors/brillout

[joshdchang]

I'm a college student working on my own side project, but in the low chance it blows up I'll drop a sponsor haha :) Cool stuff your doing and I wish you luck.

[brillout]

I see :-) Have fun!