Only plain objects from Server Components to Client Components

[codeBelt]

I hope this is the correct place to report this issue.

When using Next.js and Drizzle with Neon, I encountered the following error:

Error: Only plain objects, and a few built-ins, can be passed to Client Components from Server Components. Classes or null prototypes are not supported.

Steps to Reproduce

Using Next.js with Drizzle ORM and the Neon Database, call a server-side function like the following to delete a record:

'use server';

export async function deleteGameSelectionServerAction(selectionId: GameSelectionType['id']) {
  return db.delete(gameSelectionsTable).where(eq(gameSelectionsTable.id, selectionId));
}

In the response, the _types object contains the functions getTypeParser and setTypeParser, and I wonder if that is the issue.

{
  command: 'DELETE',
  rowCount: 1,
  rows: [],
  fields: [],
  rowAsArray: false,
  viaNeonFetch: true,
  _parsers: [],
  _types: {
    _types: {
      getTypeParser: [Function: getTypeParser],
      setTypeParser: [Function: setTypeParser],
      arrayParser: [Object],
      builtins: [Object]
    },
    text: {},
    binary: {}
  }
}

Neon and drizzle setup:

import { neon } from '@neondatabase/serverless';
import { drizzle } from 'drizzle-orm/neon-http';
import 'server-only';

const sql = neon(process.env.POSTGRES_URL);

export const db = drizzle(sql, {
  schema: {
    // ...
  },
});

Temporary Workaround

Adding .returning() to the query resolves the issue, but this should not be necessary for the operation to work:

'use server';

export async function deleteGameSelectionServerAction(selectionId: GameSelectionType['id']) {
  return db.delete(gameSelectionsTable).where(eq(gameSelectionsTable.id, selectionId)).returning();
}

This workaround returns a different structure that does not include the problematic functions.

Environment

"@neondatabase/serverless": "^0.10.4",
"next": "^14.2.17",
"drizzle-orm": "0.38.3",
"drizzle-zod": "0.6.1",
"drizzle-kit": "0.30.1",

Node.js: v21.7.2
Browser: Chrome Version 131.0.6778.205 (Official Build) (arm64)

Additional Information:

It seems that the issue may also arise in cases involving a NeonDbError, but I don't have clear steps to reproduce that specific case.

[jawj]

Looks like this is more of a question about drizzle-orm and Next.js than the serverless driver. I'm not an expert in either of those, but if the problem simply arises from trying to pass functions between client and server, wouldn't one of these solve it?

Promise<void> return:

export async function deleteGameSelectionServerAction(selectionId: GameSelectionType['id']) {
  await db.delete(gameSelectionsTable).where(eq(gameSelectionsTable.id, selectionId));
}

rowCount return:

export async function deleteGameSelectionServerAction(selectionId: GameSelectionType['id']) {
  const result = await db.delete(gameSelectionsTable).where(eq(gameSelectionsTable.id, selectionId));
  return result.rowCount;
}

[codeBelt]

Thanks for the suggestions! These would likely solve the serialization issue, but I’d prefer to handle any potential errors that might be returned. Both examples you provided ignore errors. I will present this issue to the Drizzle team.