After update to React v19 <sp-dialog> has no height if opened immediately after rendering

Photoshop
, ,
1

So it’s working perfectly with React v18, but if I upgrade to v19 and render <sp-dialog>, it has no dimensions. I add open attribute only when everything is already rendered, so it should have content to calculate dimensions from.

So in v18 this works:

dialogElement.setAttribute("open", "open")

In v19 I have to add a tiny timeout for it to work:

setTimeout(() => {
    dialogElement.setAttribute("open", "open")
}, 10)

Here’s full snippet:

import { createRoot } from "react-dom/client"

export default (Component) => {
    const dialogElement: HTMLElement = document.createElement("sp-dialog")

    const root = createRoot(dialogElement)
    root.render(Component({ dialog: dialogElement }))
    document.body.appendChild(dialogElement)

    dialogElement.addEventListener("close", () => {
        dialogElement.remove()
        root.unmount()
    })

    dialogElement.setAttribute("open", "open")
}

Any advice? I would really love to avoid yet another forced timeout :disappointed_face:

2

Now I’m thinking v19 might actually be not supported by Adobe/UXP, because even when trying to render normal dialog I get

Offset is deprecated. Please use horizontal-offset/vertical-offset instead.

Can’t find much about the error :confused: And I don’t use any offset anywhere in my plugin