XSS when rendering uiSchema validation error message

[davidli16]

Prerequisites

• I have searched the existing issues
• I understand that providing a SSCCE example is tremendously useful to the maintainers.
• I have read the documentation
• Ideally, I'm providing a sample JSFiddle, Codesandbox.io or preferably a shared playground link demonstrating the issue.

What theme are you using?

core

Version

5.x

Current Behavior

HTML tags inside JSON schema property names are output as HTML when rendered in error messages.

Expected Behavior

HTML tags are disallowed or escaped when rendering JSON property names in error messages.

Steps To Reproduce

1. Define a JSON schema

{
    "type": "object",
    "properties": {
        "xss<iframe srcdoc={'<script>alert(document.domain)</script>'}>": {
            "type": "string",
            "title": "Comment<a>link</a>"
        }
    },
}

2. Define a UI schema

{
  "xss": {
    "ui:widget": "textarea"
  },
  "ui:order": [
    "test"
  ]
}

3. The root schema is included in the error message and rendered as HTML.

Environment

No response

Anything else?

Solution: Pass in disableParsingRawHTML to the <Markdown> component to prevent HTML from being rendered in the error message.

react-jsonschema-form/packages/core/src/components/fields/ObjectField.tsx

Line 267 in 7f54d45

{translateString(TranslatableString.InvalidObjectField, [name || 'root', (err as Error).message])}

Playground

[heath-freenome]

@davidli16 Thanks for the issue and the fix. One small update to the PR and we will merge and close this issue.