Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Getting upload file arrayBuffer server side in validation function fails with "Attempted to call a temporary Client Reference" #10038

Open
sacha-c opened this issue Dec 18, 2024 · 0 comments
Labels
status: needs-triage Possible bug which hasn't been reproduced yet

Comments

@sacha-c
Copy link

sacha-c commented Dec 18, 2024

Describe the Bug

I have an upload collection that I validate with a sibling checkbox field. The checkbox field has a validation method which checks the options.siblingData.file when it is populated and runs some file validations with the underlying File object.

This used to work in V2, but in V3 when trying to migrate my logic I end up with the error Error: Attempted to call a temporary Client Reference from the server but it is on the client.

(Maybe I am abusing an API that is not supposed to be public, if so please suggest an alternative that would allow me to validate a file server-side, loading the Blob in memory. I also explored hooks.beforeOperation but could not give nice validation feedback in the UI to the user using it)

Link to the code that reproduces this issue

sacha-c@b119e4e

Reproduction Steps

Have a collection with an upload configuration & a sibling field with a validation method that attempts to access the arrayBuffer promise (or the stream() or text() methods also)

  upload: {
     // My upload config
     ...
  }
  fields: [
    {
      name: 'test',
      type: 'checkbox',
      validate: async (_, options): Promise<string | true> => {
        if (!('file' in options.siblingData)) {
          // Payload has not loaded the file yet, pass validation
          return true
        }

        try {
          const result = await (options.siblingData.file as File).arrayBuffer()
          console.log('result', result)

          // perform validation with the arrayBuffer, loading it in memory & checking details of the object
          // ...
        } catch (error) {
          console.log('error', error)
        }

        return true
      },
    },
  ],

Logs:

error Error: Attempted to call a temporary Client Reference from the server but it is on the client. It's not possible to invoke a client function from the server, it can only be rendered as a Component or passed to props of a Client Component.
...

Which area(s) are affected? (Select all that apply)

area: core

Environment Info

Payload: 3.8.0 
Node.js: 22.6.0
Next.js: 15.0.3
@sacha-c sacha-c added status: needs-triage Possible bug which hasn't been reproduced yet validate-reproduction labels Dec 18, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
status: needs-triage Possible bug which hasn't been reproduced yet
Projects
None yet
Development

No branches or pull requests

1 participant