next.js
5ff57ead - [dev-overlay] Fix error dialog resizing logic (#77830)

Commit
267 days ago
[dev-overlay] Fix error dialog resizing logic (#77830) This PR improves our height resizing strategy. Animating the height on page load or when the dialog opens is not ideal and it would be better if the dialog would just fade in and assume it's intrinsic height without motion. This is what happens before this PR when you open errors, and it can be distracting to experience such amount of motion at once: https://github.com/user-attachments/assets/eb03cc23-395e-4ff4-9ed2-ace1694ad917 The reason this happens is because some of the dialog contents load in async—for example the errors are actually suspended so that the message can be viewed without waiting for the stack frames to load: https://github.com/vercel/next.js/blob/1751db082d8c791e05ac1481a5036c8fb381d831/packages/next/src/client/components/react-dev-overlay/ui/container/errors.tsx#L202-L208 --- After this PR, we still measure the `height` of the dialog and animate it in response to user input, but only use the value when the height has stabilised. You can see what happens by observing the blue height value: https://github.com/user-attachments/assets/cf4c1e0f-5e2e-49ed-b94a-1df9822f20cc And another video from the fixture app: https://github.com/user-attachments/assets/a285253f-f320-4638-b19e-b7a27a434ee6 --- Closes NDX-983
Author
Parents
Loading