Adding a hex viewer/memory-typed array viewer to DevTools
Reported by
the.sp...@gmail.com,
Jul 15 2017
|
||||
Issue descriptionA proposal to provide a way to inspect big blocks of memory from the Source Panel in DevTools. Similar to the color picker, a pop-up control could be opened when clicking an icon next to an object recognised as any of the supported types (arrays and typed arrays for now). The control can be based on the extension I'm working on, with additional features like byte-based type conversion, edition of values, save to disk, etc. The source code of the extension so far can be found here https://github.com/spite/HexViewerExtension The README explains the difference between the two branches, I'd recommend using the "typedArray" branch. Attached are snapshots of how it might look: first one is before clicking in the lens icon next to the typed array in the Watch panel to the right. The second shows the pop up opened.
,
Jul 15 2017
,
Jul 18 2017
Note that the.spite@ has implemented the typed array viewer and (I think) is working on hooking it into DevTools already; so before doing a lot of work, please sync up with him. Thanks!
,
Jul 19 2017
Thank you for the report. It would be nice for a HEX-viewer to be a resusable component throughout DevTools. I believe allada@ has some ideas on using this in the Network panel's Response pane, and eostroukhov@ has ideas on using a viewer in Application panel. It might make sense to have this in a transient object popover, as your screenshot, or as its own panel. the.spite@, are those screenshots mocks, or do you have working code for them?
,
Jul 19 2017
@luoe just mocks, unfortunately :) I'm going through the DevTools FrontEnd project code to see how it could work.
,
Jul 19 2017
Note that the.spite@ has working code in https://github.com/spite/HexViewerExtension , just not integrated into DevTools. Please collaborate! P.S. Personally I would like the viewer to be more persistent than a hover-over in DevTools; it's annoying when the mouse accidentally exits a hover-over and it disappears with no user action.
,
Jul 19 2017
Exactly: having a panel like the Animations/Coverage/Network Conditions/etc. would be great since it could be used across DevTools, and it could hold state longer than a pop-up, and even have multiple viewers, probably in tabs. I thought a pop-up would be more feasible to get it started, compared to adding a complete feature, but just as a minimum viable implementation. I'd love any pointers on how to help implementing this.
,
Jul 20 2017
the.spite@, we're always glad to have people diving into the frontend code! Implementing something on the frontend side can be confusing, as we have docs in multiple places. I've put together a brief primer to help you get started and see what I think the main steps / implementation overview might look: https://docs.google.com/a/chromium.org/document/d/1PO2Jjryd8UYEfAi4YMy0JmFZ_l_GtwIhOMoMzHdLBYU/edit?usp=sharing Please feel free to add comments/questions on the doc or to email me with your thoughts.
,
Dec 8 2017
Start with the extension for this one. |
||||
►
Sign in to add a comment |
||||
Comment 1 by kbr@chromium.org
, Jul 15 2017Components: Platform>DevTools>JavaScript Platform>DevTools>UX
Labels: -Type-Bug -Pri-3 -OS-Mac OS-All Pri-2 Type-Feature