Fix long string overlay in debugger Variables panel (#7112)#9745
Fix long string overlay in debugger Variables panel (#7112)#9745khanak0509 wants to merge 3 commits intoflutter:masterfrom
Conversation
elliette
left a comment
elliette
left a comment
There was a problem hiding this comment.
Thanks! One suggestion for code reuse otherwise LGTM
packages/devtools_app/lib/src/shared/console/widgets/display_provider.dart
Outdated
Show resolved
Hide resolved
elliette
left a comment
elliette
left a comment
There was a problem hiding this comment.
Thanks! A few more changes but looks good!
| child: Text.rich( | ||
| TextSpan( | ||
| child: OverflowingText( | ||
| tooltipMessage: widget.variable.text, |
There was a problem hiding this comment.
I think we can remove the tooltip message here since this didn't originally have a tooltip
| // style based on variable type. | ||
| TextSpan(text: value, style: theme.subtleFixedFontStyle), | ||
| TextSpan( | ||
| text: value.replaceAll('\n', '\\n'), |
There was a problem hiding this comment.
Why was .replaceAll('\n', '\\n') added?
There was a problem hiding this comment.
now I have removed this, but I added it because if any string contains \n, it should not break and should remain on a single line, so I replaced \n with \n. But yes, this is not needed because most URLs don't contain \n. But for robustness, is it really not needed?
| return Text.rich( | ||
| TextSpan( | ||
| return OverflowingText( | ||
| tooltipMessage: value, |
There was a problem hiding this comment.
Please remove tooltip since it wasn't originally there
2 participants
this PR fixes issue #7112
In the debugger Variables panel, when a variable's value is a long string (e.g. a URL), it was wrapping to the next line and visually overlaying the next item's controls. The TreeView uses a fixed row height of 20px via itemExtent, but
Text.richwidgets insideDisplayProviderandDapDisplayProviderhad no single-line constraint.now this issue is fixed by adding
maxLines: 1,softWrap: false,overflow: TextOverflow.ellipsisto all relevantText.richwidgets.Literal newlines are replaced with
\\nfor visibility and values are wrapped in DevToolsTooltip so the full value is accessible on hover.A widget test was added in
test/screens/debugger/debugger_screen_dap_variables_test.dartthat pumps a DAP variable node with a 1000-character value and asserts single-line truncation properties and the tooltip carrying the full value.before this fix Long URL wraps to next line, overlaying next item's controls
after this fix Long URL truncated with ... on a single line, hover shows full value
screenshot for reference
Pre-launch Checklist
General checklist
///).Issues checklist
contributions-welcomeorgood-first-issuelabel.contributions-welcomeorgood-first-issuelabel. I understand this means my PR might take longer to be reviewed.Tests checklist
AI-tooling checklist
Feature-change checklist
release-notes-not-requiredlabel or left a comment requesting the label be added.packages/devtools_app/release_notes/NEXT_RELEASE_NOTES.md.If you need help, consider asking for help on Discord.