Issue - CSP violation when using evaluateValidator with dynamically compiled validators

[SriHarshaNagulakonda]

I'm trying to validate a form using a dynamic JSON schema that comes from an API, so I can't precompile and bundle the schema validator at build time.

I followed the approach mentioned in the RJSF docs on dynamically pre-compiling validators. Here's what I did:

• I wrote a Node.js Lambda that calls compileSchemaValidatorsCode to generate the validator code on demand.
• In the frontend, I used evaluateValidator(id, code, nonce) to execute the returned code and then passing the returned ValidatorFunction to createPrecompiledValidator

/**
 * Evaluate precompiled validator in browser using script tag
 * @param id Identifier to avoid evaluating the same code multiple times
 * @param code Code generated server side using `compileSchemaValidatorsCode`
 * @param nonce nonce attribute to be added to script tag (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce#using_nonce_to_allowlist_a_script_element)
 */
export function evaluateValidator(id: string, code: string, nonce: string): Promise<ValidatorFunctions> {

However, this throws a CSP violation error:

Content-Security-Policy: The page's settings blocked an inline script (script-src-elem) from being executed because it violates the following directive: "script-src 'self'"

Note: we do not allow unsafe-inline, and the policy is strict,

Question

Is there any recommended or CSP-safe way to evaluate or use dynamically compiled validators in the browser without violating CSP?

I already noticed the optional nonce parameter, but even when I supply a valid nonce, the inline script still gets blocked—possibly because script-src-elem doesn’t honor nonce in some cases?

Would love to hear if others have hit this issue or have alternative suggestions?