Serverless function issue in Hubspot Multi Step UI Extension Form

[AGavali]

Hello everyone, I have created a HubSpot multi step form UI extension using HubSpot CLI,

here is my Requirement: We are working on a multi-step form UI Extension embedded within a custom object (p_retirement_plans).
The requirement is to save form data step-by-step as the user progresses through each section.

What we've tried so far:
Initially, we used hubspot.records.update() directly to save form data, but it didn’t produce the expected results.
Then, we implemented a serverless function (saveRetirementPlan) to handle saving, inside serverless.json i have rendered this function correctly, and trying to invocate in my first form (Retirement plan details)
Issue:
The error occurs right after submitting the first step (Retirement Plan Details).
When the user clicks “Next,” the serverless function is triggered, but it fails with the error, means I'm not able to invocate the serverless function even everything goes well, getting this below issue:
[runServerlessFunction] 'name' field must be a non-empty string
This happens even though we're not explicitly passing a 'name' field and all required parameters are sent correctly.
Further we Attempt (Bidirectional Property Refresh):
We also implemented the bidirectional property refresh method (as per HubSpot’s GitHub example) to ensure updated property values after saving.
However, the issue persists, and we now get:
[runServerlessFunction] Failed to execute serverless function 'saveRetirementPlan': Unknown error (n/a)
This error occurs :
after submitting the first portion of the form.
All fields are properly filled and interacted with, yet the error still appears.

I've attached a Loom video walking through the issue step-by-step:
(https://www.loom.com/share/4f4ad2b3892540e9ad67899002426f5f?sid=849104d7-4214-4864-ae71-f48565d4e39b)

here I simply wants to invocate the serverless function properly inside my multi Step form, so I can save the form field data in HubSpot CRM, so please let me know where I'm doing mistake or please provide me proper approach for this?

[ndwilliams3 · Accepted solution]

looks like the syntax on your hubspot.serverless() calls are incorrect.  the name is a separate string argument and not part of the payload object as it was with the old runServerless() function

 const response = await hubspot.serverless({
    name: 'savePrimaryPlanHolder', 
    parameters: formData,
 });

correct

 const response = await hubspot.serverless('savePrimaryPlanHolder',{
    parameters: formData,
 });

[MichaelMa]

Two items to be sure:

Name

Do you have a property with an internal name of "name"?

I see in your Loom that you have an internal field named "plan_name" which has a label of "Plan Name" which shows up in the code. However, when Hubspot complains about missing field data, they give the field internal name. So when it's complaining about missing "name" field, it does NOT mean "plan_name". 

POST method

From what I saw, you're using the POST method in your serverless. Are you trying to create a NEW record or UPDATE an existing record?

POST is to create a new record and combined with the missing "name" field, that's probably why it's complaining (requires that field to create a new record).

PATCH is used to update an existing record. Basic PATCH requires the object id in the URL and batch PATCH has a different payload format that includes the object id.
https://developers.hubspot.com/docs/reference/api/crm/objects/objects#patch-%2Fcrm%2Fv3%2Fobjects%2F...

You should also go to your API log to see what payload is being sent to verify.