mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-05-24 06:35:10 +00:00
988d532467
## Summary Cap the Job Details "Error message" block at `max-h-96` (24rem / 384px) with an internal scroll, wrap long unbreakable tokens (filenames, JSON), and preserve newlines so the failed-job popover no longer grows unbounded. ## Changes - **What**: Added `max-h-96 overflow-y-auto whitespace-pre-wrap wrap-break-word` to the error message container in `JobDetailsPopover.vue`, plus a `FailedWithLongError` Storybook story covering the overflow case. ## Review Focus - 24rem cap was set per Alex's spec in the [Slack thread](https://comfy-organization.slack.com/archives/C0A4XMHANP3/p1778506109115989). - `wrap-break-word` (Tailwind 4 canonical of `break-words`) is needed because long underscore-joined filenames don't break naturally; `whitespace-pre-wrap` preserves any newlines in the raw error. - Not in scope: the popover z-index clipping issue Alex flagged later in the same thread — that's a separate follow-up. Fixes FE-660 ## Screenshots **Before** — error block grows unbounded with the panel:  **After** — error block capped at 384px and internally scrollable:  Reproduce locally via Storybook: `pnpm storybook` → Queue → JobDetailsPopover → **FailedWithLongError**. ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-12173-fix-queue-contain-JobDetailsPopover-error-message-overflow-35e6d73d3650812d9873e5d163cad0c6) by [Unito](https://www.unito.io) --------- Co-authored-by: Benjamin Lu <benjaminlu1107@gmail.com>
