Summary:
UINode has never been a good name, we have 3 versions of a node.
ClientNode Previously UINode (the raw data from the client)
NestedNode (for the visualiser)
TreeNode (extends ClientNode and adds stuff specific to the tree like indentation and expanded states)
Arguablely we dont need nested node but that is another story
Reviewed By: elboman
Differential Revision: D47547529
fbshipit-source-id: 9a3b119d1230ea7b6734e7a3270c28287b04faf1
Summary: This file was getting overwelhming, and this seemed like a reasonable way to split it
Reviewed By: elboman
Differential Revision: D47547532
fbshipit-source-id: ab2bfa22daabbed13ec1445da0cf8ba88bda12d7
Summary: This will allow us to build a nice table easily.
Reviewed By: lblasa
Differential Revision: D47520029
fbshipit-source-id: 3cdd776533b66688329171eb29b892e0b9153540
Summary:
See title. The issue occurs because this tabs component derives a key by essentially serializing the children. Since its possible for different elements in the UIDebugger to have different number of tabs, due to framework events not always being present this was never anticipated.
Solution is to just let the callee supply a storage key which does not depend on the exact number of tabs
Reviewed By: lblasa
Differential Revision: D47520033
fbshipit-source-id: 67e57db5110fde52451d30496c25a25b0eb4a6f7
Summary:
Added selection source concept to onSelect callback. This allows us to only autoscroll the tree when selection source is the visualiser. We had feedback that the horizontal autoscrolling whilst using the tree was unhelpful.
A side benefit of selection source is better tracking of how people use kb, tree vs visualiser to select things
Changelog: UIDebugger only autoscroll horizontally when selecting via the visualiser
Reviewed By: lblasa
Differential Revision: D47334078
fbshipit-source-id: d7eadddb8d3d0fd428d5c294b2dccc2f1efa5a95
Summary: Feedback from michel, It is always empty for android so dont show it
Reviewed By: elboman
Differential Revision: D46152985
fbshipit-source-id: 6c4f1d499ddb8916fdae6015cd57e158a0c1f182
Summary:
As events get bigger, this change includes the following:
- Dedicated event inspector
- Stacktrace viewer for events with stacktrace attribution
- Stacktrace viewer is displayed within a new BottomPanel. BottomPanel can display any React component and can be reused in the future in different use cases.
Reviewed By: LukeDefeo
Differential Revision: D44628768
fbshipit-source-id: 71a9ef87e71c9a17f58c2544a1aa356eed14ed27
Summary: Leverage the properties prop of `TimelineDataDescription`. Whenever an event is selected, the event payload is shown as the event properties.
Reviewed By: antonk52
Differential Revision: D44497058
fbshipit-source-id: 09782d583957a0df8c3efd3f5a62af6b321a26e3
Summary: Because Tabs now depend on the selected node (i.e. some nodes have events, some don't) they need to use a key.
Reviewed By: antonk52
Differential Revision: D44624658
fbshipit-source-id: 693983f6a82c090adae3a2e009873d903626ab75
Summary:
The current event label used the event type. The type in itself can have this shape:
`ck:willMountComponent`
The event name is just 'willMountComponent'.
So, extract that piece of data instead.
Reviewed By: aigoncharov
Differential Revision: D43983728
fbshipit-source-id: e232b59cfe3eb0710e56fc9ba7f94b644b07ee74
Summary:
Add a frameworks events tab. This is currently using the `TimelineDataDescription` component which may ultimately be replaced by something more sophisticated.
In the meanwhile, this does the job of chronologically displaying events with a label.
Reviewed By: mweststrate
Differential Revision: D43948891
fbshipit-source-id: 31ebf8a1d0e126856c3aa5291a1a06d7f2547233
Summary:
For the visualiser we use the same trick as with the hover state. We subscribe to selection changes and only render if the prev or new state concerns us.
For the tree we change from object identity to the node id + and indent guide are added to the memoisation equal check.
Depending on teh change this tree memoisation can vary in effectiveness. If you go from nothing selecting to selecting the top element nothing is memoised since react needs to render every element to draw the indent guide. If you have somethign selected and select a nearby element the memoisation works well.
There are ways to improve this more down the road
changelog: UIDebugger improve performance of selecting nodes
Reviewed By: lblasa
Differential Revision: D43305979
fbshipit-source-id: 5d90e806ed7b6a8401e9968be398d4a67ed0c294
Summary:
This change addresses some obvious issues which made the ui-debugger unusable with dark mode on.
There may more things that need changing, but at the very least this should be a good place to start.
Reviewed By: fabiomassimo
Differential Revision: D43083218
fbshipit-source-id: 8e4338b79178d3a0f05f9bcaffa2fc6f35eb0e21
Summary:
Before this change, attributes and attribute metadata were intermingled and sent as one unit via subtree update event.
This represented a few issues:
- Repetitiveness. For each declared and dynamic attribute, metadata was included on each value unit.
- Metadata can vary in size and thus can have a negative impact on payload size.
- The attribute name which is part of metadata is a string which always overhead on processing.
- Metadata instantiation is not cheap thus this also incurs in processing overhead i.e. even instantiating a single string can have an impact.
The proposal is to separate metadata of attributes from the actual node reported attributes. This solves the problems mentioned above.
Reviewed By: LukeDefeo
Differential Revision: D40674156
fbshipit-source-id: 0788551849fbce53065f819ba503e7e4afc03cc0
Summary:
Replace draft inspectors with read-only components.
This is a first step into having a richer UI. At the moment, these are read-only components but will likely be extended in the future as to allow editing of values.
Reviewed By: LukeDefeo
Differential Revision: D40345016
fbshipit-source-id: a6aef5861474b4aa8353c00ef257ab17b4cff00e
Summary:
^
This laids the foundation for the inspector. It just reorganises a few bits.
Reviewed By: LukeDefeo
Differential Revision: D40319611
fbshipit-source-id: 8cf9b151c631faa1f26a7a6dfaa86b01abc42fe5
