You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The div that shows AJAX requests has a max-width that is just a bit too narrow to show all information when the URL is long. I think it's just not taking into account the width of the ellipsis that gets displayed when URLs are long enough to be clipped.
Example:
How to reproduce
Just make some AJAX requests in your dev environment with a long URL and look in the toolbar.
Possible Solution
Make the max-width a bit larger. I find that changing from 480px to 520px is enough.
Sorry I don't know how to do a PR but I believe the relevant CSS is here:
If I remember it correctly, text truncation with CSS inside table cells is sometimes complex to make it work. Maybe we're missing some CSS styles to better define the width of the table and that's why the URL column is not properly truncated to make the Time column appear entirely.
I'm not against increasing the width a bit here, but if this is only "a patch solution", next time it will fail with other URLs. That's why I think we need to find a generic solution if possible. Thanks.
I understand what you're saying, but long URLs are truncated, so no matter how much longer they get, the table can't get any wider.
However, if you prefer a completely future-proof solution, I would suggest removing the max-width property altogether so that the container will always be as large as the table is. Or set the max-width to something large but reasonable like 100vw, or something like that.
I just encountered this as well on one of my projects (and unfortunately only found this issue while opening #46507)
This does not look related to the text ellipsis itself as removing it keeps the same width.
The URL table column is already limited in width so this should not increase further.
Symfony version(s) affected
6.0.6
Description
Hi, this is a pretty simple request:
The div that shows AJAX requests has a max-width that is just a bit too narrow to show all information when the URL is long. I think it's just not taking into account the width of the ellipsis that gets displayed when URLs are long enough to be clipped.
Example:
How to reproduce
Just make some AJAX requests in your dev environment with a long URL and look in the toolbar.
Possible Solution
Make the max-width a bit larger. I find that changing from 480px to 520px is enough.
Sorry I don't know how to do a PR but I believe the relevant CSS is here:
https://github.com/symfony/web-profiler-bundle/blob/1497b1d22c2807a77563439f8ec489407a989d59/Resources/views/Profiler/toolbar.css.twig#L336
What this looks like when I edit in Chrome dev tools:
Additional Context
No response
The text was updated successfully, but these errors were encountered: