Description
In the rich-text Description editor, opening the image/link embed popover and entering an invalid URL crashes the whole editor with the app error boundary:
Something went wrong
Invalid slot "errorMessage". Valid slot names are "description".
The user is dropped out of the description edit entirely.
Steps to reproduce
- Open any entity → Edit Description.
- In the toolbar, click the image / embed button → the popover opens (Link / Upload tabs).
- On the Link tab, type an invalid URL (e.g.
ttt).
- 💥 The editor unmounts and shows "Something went wrong — Invalid slot 'errorMessage'. Valid slot names are 'description'."
Expected
The field shows an inline "Invalid URL" validation message and the editor keeps working (this is the behaviour on the current production release).
Actual
React-aria throws an invalid-slot error, the error boundary catches it, and the editor is replaced by the "Something went wrong" page.
Root cause
openmetadata-ui/.../components/BlockEditor/Extensions/image/EmbedLinkElement/EmbedLinkElement.tsx renders the URL validation error as a standalone HintText next to the Input:
<Input isInvalid={fieldState.invalid} ... />
{fieldState.error && (
<HintText isInvalid>{fieldState.error.message}</HintText> // <-- crashes
)}
HintText isInvalid resolves to react-aria slot="errorMessage", but it sits inside a TextField/Input context that only registers the description slot → react-aria throws Invalid slot "errorMessage". Valid slot names are "description".
When it was introduced
Introduced on main by #29964 (commit 2cd612fe9ff, 2026-07-13, "refactor(context-center): wrap header components with HeaderShell") — it added EmbedLinkElement.tsx in its current Input + standalone-HintText form. It is the only commit in that file's history.
Current production works because the deployed UI release predates #29964. This regression is on main and will ship in the next release unless fixed.
Suggested fix
Surface the validation error through the field's own error mechanism (the correct slot) rather than a sibling <HintText> — e.g. pass the error via the Input/TextField error prop, or render the message outside the TextField slot context so it isn't captured as slot="errorMessage".
Environment
- Area: UI — BlockEditor / description embed-link popover
- Frontend only (reproduces regardless of backend; observed pointing at prod backend)
- Browser: Chrome
Description
In the rich-text Description editor, opening the image/link embed popover and entering an invalid URL crashes the whole editor with the app error boundary:
The user is dropped out of the description edit entirely.
Steps to reproduce
ttt).Expected
The field shows an inline "Invalid URL" validation message and the editor keeps working (this is the behaviour on the current production release).
Actual
React-aria throws an invalid-slot error, the error boundary catches it, and the editor is replaced by the "Something went wrong" page.
Root cause
openmetadata-ui/.../components/BlockEditor/Extensions/image/EmbedLinkElement/EmbedLinkElement.tsxrenders the URL validation error as a standaloneHintTextnext to theInput:HintText isInvalidresolves to react-ariaslot="errorMessage", but it sits inside aTextField/Inputcontext that only registers thedescriptionslot → react-aria throwsInvalid slot "errorMessage". Valid slot names are "description".When it was introduced
Introduced on
mainby #29964 (commit2cd612fe9ff, 2026-07-13, "refactor(context-center): wrap header components with HeaderShell") — it addedEmbedLinkElement.tsxin its currentInput+ standalone-HintTextform. It is the only commit in that file's history.Current production works because the deployed UI release predates #29964. This regression is on
mainand will ship in the next release unless fixed.Suggested fix
Surface the validation error through the field's own error mechanism (the correct slot) rather than a sibling
<HintText>— e.g. pass the error via theInput/TextFielderror prop, or render the message outside theTextFieldslot context so it isn't captured asslot="errorMessage".Environment