Error Handling for Custom Dynamic Fields in Registration Form (Authn MFE)

Hello,

I am currently working on customizing the registration page on the Open edX platform (olive release) to include dynamic fields (extended profile fields) added through a custom Django app. While the backend integration works fine, I’m encountering issues with the error handling of these dynamic fields in the React frontend (Authn MFE)

The default fields (like email and username) correctly show validation errors, but for the custom dynamic fields, rather than showing specific validation errors, the system displays a generic error message:

An Unexpected Error Occurred. Please Click The Button Below To Refresh The Page

Checking the error in console:

Objects are not valid as a React child (found: object with keys {required}). If you meant to render a collection of children, use an array instead.

This suggests a problem with how React in the Authn MFE is handling the error objects sent from the backend.

Does Open edX’s Authn MFE have built-in support for handling custom dynamic field errors, or do I need to modify the MFE code to handle these errors?

hi @harout7 ,
may be you trying to render Objects in error , if you are using django form validation and sending dict intead of error message

Yes that’s what is happening I have used form validation in django forms which has dictionary structure and when the error message sent to react it couldn’t render it, any idea how to fix it ?

@harout7 ,
try like this
from django.core.exceptions import ValidationError
and raise error like this instead of making dict
raise ValidationError(‘Email must be from the example.com domain.’)