RESOLVED FIXED 234376
Web Inspector: Elements tab DOM tree view reduces deeply-nested nodes to one character wide 
https://bugs.webkit.org/show_bug.cgi?id=234376
Summary Web Inspector: Elements tab DOM tree view reduces deeply-nested nodes to one ...
Michael Bailey
Reported 2021-12-15 18:20:02 PST
Created attachment 447306 [details] Testcase Web Inspector's DOM tree prefers wrapping text rather than allowing horizontal scrolling. This is fine on simple pages, but on pages with deeply-nested DOM hierarchies (unfortunately common these days), the available width for nodes shrinks until they are one character wide. By comparison, Firefox's DOM inspector appears to enforce the same maximum width on each DOM node, and still allows horizontal scrolling for the tree as a whole. which is much more legible. STR: 1. On the attached test case, open Web Inspector and inspect the node that says "Inspect me" (using the default undocked Web Inspector width). Expected: The maximum width for each DOM node should be the same, regardless of depth, and the DOM tree view should scroll horizontally to accommodate deep hierarchies. Actual: As the DOM tree gets deeper, the maximum width for nodes at each level of depth gets narrower until they are one character wide.
Attachments
Testcase (3.68 KB, text/html)
2021-12-15 18:20 PST, Michael Bailey 		no flags
Details
Safari screenshot on a complex web app (809.16 KB, image/png)
2021-12-15 18:22 PST, Michael Bailey 		no flags
Details
Firefox screenshot on a complex web app (997.58 KB, image/png)
2021-12-15 18:22 PST, Michael Bailey 		no flags
Details
Screenshot: Before (499.36 KB, image/png)
2024-10-25 14:26 PDT, Razvan Caliman 		no flags
Details
Screenshot: After (537.49 KB, image/png)
2024-10-25 14:26 PDT, Razvan Caliman 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Michael Bailey
Comment 1 2021-12-15 18:22:27 PST
Created attachment 447307 [details] Safari screenshot on a complex web app
Michael Bailey
Comment 2 2021-12-15 18:22:52 PST
Created attachment 447308 [details] Firefox screenshot on a complex web app
Radar WebKit Bug Importer
Comment 3 2021-12-22 18:20:20 PST
<rdar://problem/86833831>
Razvan Caliman
Comment 4 2024-10-25 14:17:21 PDT
Pull request: https://github.com/WebKit/WebKit/pull/35738
Razvan Caliman
Comment 5 2024-10-25 14:26:24 PDT
Created attachment 473051 [details] Screenshot: Before
Razvan Caliman
Comment 6 2024-10-25 14:26:39 PDT
Created attachment 473052 [details] Screenshot: After
EWS
Comment 7 2024-11-05 09:42:36 PST
Committed 286163@main (c0cef41981cc): <https://commits.webkit.org/286163@main> Reviewed commits have been landed. Closing PR #35738 and removing active labels.
EWS
Comment 8 2024-11-21 06:59:53 PST
Committed 283286.515@safari-7620-branch (2f45443a540c): <https://commits.webkit.org/283286.515@safari-7620-branch> Reviewed commits have been landed. Closing PR #2318 and removing active labels.
Michael Bailey
Comment 9 2024-11-24 13:34:30 PST
Much more usable in STP 208. Thanks!
Note You need to log in before you can comment on or make changes to this bug.