Summary:
Adds a test runner for jest test and adds three simple test cases:
- render the app
- start a server
- client connecting to the app
Test can be run using `yarn test`.
To make the test runner work, some changes needed to be made:
- remove the export of `init()` from `'flipper'`, because it was a cyclic dependency
- updating Button.js to the new ref-API
Reviewed By: jknoxville
Differential Revision: D10027078
fbshipit-source-id: 49107b0dd4dec666b92ecd841422fe7e6b3a7756
Summary: Fixes a flow issue in the type definition of a filter. The color can be optional.
Reviewed By: passy
Differential Revision: D9850602
fbshipit-source-id: 1d74d0462baef58ad1a93e23152583679f51c177
Summary: Allows to set the selected rows of a table using the `highlightedRows` property.
Reviewed By: passy
Differential Revision: D9850597
fbshipit-source-id: 62239192113f43ac257d7328b21b386b584a7cfb
Summary:
Not sure if it's Metro or something else providing these globally,
but it makes Jest unhappy if they're missing.
Reviewed By: danielbuechele
Differential Revision: D9788350
fbshipit-source-id: 5fabad7af146bcb705471d2c7e66d79265c81c82
Summary:
Litho renders differently based on whether applicable accessibility services are enabled. In Flipper's accessibility mode this will be forced (with the option to turn it off) so that you don't have to be running an accessibility service to actually see what someone running an accessibility service would.
Here's an example video of what the re-rendering does (this also happens on toggle of accessibility mode, this is just the settings option to force it):
{F137856647}
Reviewed By: jknoxville
Differential Revision: D9667222
fbshipit-source-id: 292353d89f07734f1e525f795b1d7daf4130e203
Summary: Looks like some flow-disables were no longer necessary.
Reviewed By: jknoxville
Differential Revision: D9700398
fbshipit-source-id: 5514c16294624c1bed1d3818f9e271b07e320803
Summary:
Basic tooltips available. Use is:
<Tooltip
title="This is what will show up inside the tooltip"
options={{ // can include any or none of these (if not included default will be used)
position, // 'above', 'below', 'toRight', or 'toLeft'
showTail, // whether or not tooltip should have tail
delay, // how long to wait on hover before showing tooltip
// supported css properties
backgroundColor,
color,
maxWidth,
width,
borderRadius,
padding,
lineHeight,
}}>
<ElementTooltipWillShowUpFor/>
</Tooltip>
Reviewed By: danielbuechele
Differential Revision: D9596287
fbshipit-source-id: 233b1ad01b96264bbc1f62f3798e3d69d1ab4bae
Summary:
Removes the fix introduced in D9570518 and upgrading to `react-window@1.1.2` which fixes the problem in the library.
Also finetuning debounce times.
Reviewed By: passy
Differential Revision: D9582591
fbshipit-source-id: 92b008d29f96ce0f11f5cfb5d9e92175ae536ee2
Summary:
When starting with an empty table and adding rows, the scrollOffset of the table might end up with a negative value, which causes rows not to be rendered.
See https://github.com/bvaughn/react-window/issues/49 for more details.
This only calls `scrollToItem` when the table is actually scrollable to prevent a negative scrollOffset.
Reviewed By: passy
Differential Revision: D9570518
fbshipit-source-id: 5b08990a353a6d41d0f1bc5c1481d5a5e471bd94
Summary:
Table was missing support for some properties, that were supported previously, which caused some regressions. Support for the following properties was added:
- `multiHighlight: boolean = false`
- `autoHeight: boolean = false`
- `highlightableRows: boolean = true`
- `onRowHighlighted: Function`
Reviewed By: jknoxville
Differential Revision: D9549384
fbshipit-source-id: 1db2e7e8c6ad483d3d9d3a5814c76c564e9ba7f4
Summary: When table rows are chaning, we need to recaluculate all row heights. This was already done when filtering/searching, but there are other occurrences where we need to recalculate the heights (like clearing the table).
Reviewed By: passy
Differential Revision: D9540881
fbshipit-source-id: ef6e94c0330294d8196f946799a436aa5e9ce5c5
Summary: Fixes some warnings that were caused by the switch to react-emotion.
Reviewed By: jknoxville
Differential Revision: D9483185
fbshipit-source-id: 8e49469772efd37f18342252653648618e644d55
Summary:
My benchmarks have shown react-emotion to be faster than the current implementation of `styled`. For this reason, I am converting all styling to [emotion](https://emotion.sh).
Benchmark results:
{F136839093}
The syntax is very similar between the two libraries. The main difference is that emotion only allows a single function for the whole style attribute, whereas the old implementation had functions for every style-attirbute.
Before:
```
{
color: props => props.color,
fontSize: props => props.size,
}
```
After:
```
props => ({
color: props.color,
fontSize: props.size,
})
```
Reviewed By: jknoxville
Differential Revision: D9479893
fbshipit-source-id: 2c39e4618f7e52ceacb67bbec8ae26114025723f
Summary: Switches elements from custom virtualization to react-window, so the custom implementation is not needed anymore and therefore can be removed.
Reviewed By: jknoxville
Differential Revision: D9447723
fbshipit-source-id: 7abcc077f87fe634a0e9517908db03398848bce7
Summary:
When changing the props of a table often, this might results in a lot of unnecessary rerenders. This could be mostly seen in the analytics plugin, which is sending a lot of messages in a short time.
The update of the table component is now debounced to only re-render every 150ms. This also affects searching and filtering and makes typing in the search input smoother.
Reviewed By: passy
Differential Revision: D9447722
fbshipit-source-id: 00e092e4e047e9c40e5a1ec2789644858acc18dd
Summary:
Tables were using a custom virtualization, which wasn't as performant as other solutions out there. In this diff, the table component is reworked for performance.
- removes `Table` component, because it was never used standalone, `ManagedTable` is what all plugins used
- uses `react-window` for `ManagedTable`
- reworks table highlighting and arrow-navigation to work with the new virtualization
- moves actual filtering out of `ManagedTable` into `Searchable` component for a better separation of concerns.
Reviewed By: jknoxville
Differential Revision: D9447721
fbshipit-source-id: 15eb2eb55eed9f49a0cb1ccfb2d748b3672fa898
Summary: Sidebar extensions are automatically added to main inspector sidebar but kept from accessibility side menu.
Reviewed By: xiphirx
Differential Revision: D9438644
fbshipit-source-id: 47a9cc630117e15be3368d78f2396f02796c998d
Summary: Adds on hover descriptions for some of the more esoteric properties in the accessibility sidebar panel such as accessibility-focused and all the talkback derived properties. Also change talkback-focusable and talkback-ignored to both be talkback-focusable.
Differential Revision: D9381676
fbshipit-source-id: 55ce854da24241a7c89b0c122c4c3ebd77438dbb
Summary: The sidebar is now shown, even if no device is connected. This prevents the jumping layout when Flipper launches, but still has not connected to devices.
Reviewed By: passy
Differential Revision: D9263892
fbshipit-source-id: d5b96a8619393ee4002863a83d9024f00c6cb396
Summary: Puts an accessibility icon next to any elements in the ax tree that may be focused on when talkback is running to show that they are "accessibility-focusable". When any sidebar values are changed, the icon will show up/disappear accordingly.
Reviewed By: danielbuechele
Differential Revision: D9171781
fbshipit-source-id: f3b42624988aaef22040ac3325d745a12f0622db
Summary: Allow user to open the context menu on an element in the ax tree and request accessibility focus to that element. If the element is focusable (and talkback or another accessibility service is running), accessibility focus will change to that element, if not, it will not change anything.
Differential Revision: D9162382
fbshipit-source-id: 5dda9b87a2cc6eba4130e3feee978b5fa38ac9f1
Summary: Adding a flowtype library definition for electron 3 and fixing related type errors
Reviewed By: passy
Differential Revision: D9124758
fbshipit-source-id: e09cb5b05ba952e7f95f68f9043edc586f81ae83
Summary: Clean up javascript. Add a check to remove ax mode toggle if using ios. Add safety check for extraInfo where it hasn't been added yet.
Reviewed By: danielbuechele
Differential Revision: D9070574
fbshipit-source-id: 49ac781c01ea47239d6c24089976497371973726
Summary: Screen captures now have unique names, so they don't get overwritten. By default they are saved to the desktop, but the path can be overwritten by setting `screenCapturePath` in `~/.sonar/config.js`
Reviewed By: jknoxville
Differential Revision: D9120822
fbshipit-source-id: ab6880eac475da3839f08c6e644c16bdc8693647
Summary:
Improves the look of analyzed Hprof data for the Memory Tools plugin. Adds an expandable/collapsable tree using ElementsInspector and groups large objects/leaked objects.
https://pxl.cl/fxNs
Reviewed By: danielbuechele
Differential Revision: D8721141
fbshipit-source-id: f78fe32bd2ca1f11ce39b9e696f48a56dc5c9bff
Summary: Highlights the element corresponding to the view talkback is focused on in green in the ax tree (and updates live as talkback moves).
Reviewed By: blavalla
Differential Revision: D9021542
fbshipit-source-id: c3bf6f5625aacb0cd054032b33a50541b88b2eaf
Summary: Adds an optional 'depressed' param to Button. If set to true, displays the Button as if it was depressed. Used to add a set of togglable buttons in which all or none can be selected.
Reviewed By: jknoxville
Differential Revision: D8903854
fbshipit-source-id: ff39bed91514e420b49cb75fe57e490fa641b810
Summary: Shows basic relationship between the AX and nonAX tree litho nodes. When a litho component is selected from the nonAX tree, it's corresponding hostView or lithoView (root of the component tree) is highlighted in the AX tree giving priority to the hostView if it exists. If a hostView is selected in the AX tree, it's corresponding component is selected in the non-AX tree. If a lithoView is selected from the AX tree, it's corresponding lithoView is highlighted in the non-AX tree. This means that each hostView has a one-to-one highlighting between the two trees but lithoViews will have many nodes in the main tree that map to one node in the AX tree (which is accurate to litho components rendering but we may need to change in the future if it is not clear).
Reviewed By: jknoxville
Differential Revision: D8972205
fbshipit-source-id: d136f5b594d0ac1b66a82b35dc7b085186829fc4
Summary: When expanding one tree, the other tree also expands. This expanding jumps over fragments (which are not in the accessibility tree) so that the trees can stay in sync even when there are extra wrappers in the main tree. Need to figure out functionality for litho components (these simply don't expand together right now since the relationship between the trees at these nodes are less obvious).
Differential Revision: D8943229
fbshipit-source-id: 289c3511a6495508b45a62da13ae4c50209e6118
Summary:
All the new errors were missing annotation errors. I fixed as many as I could
by adding annotations. For the rest I added a $FlowFixMe suppression type.
Reviewed By: nmote
Differential Revision: D8756267
fbshipit-source-id: a69b6e21525b9b12e582ff18dcb1eeea584abb2a
Summary: Added duplicate view tree (will be replaced with accessibility node tree eventually). Can toggle ax mode on and off and interact with each tree individually to view/change properties.
Reviewed By: danielbuechele
Differential Revision: D8717557
fbshipit-source-id: 1109ccafd49b6958ee7a70c2e8851ed8351516ae
Summary: This adds the ability to extend the layout inspector's sidebar via SidebarExtensions
Reviewed By: sjkirby
Differential Revision: D8677332
fbshipit-source-id: 1880d5d2185306290a278e8a48e965ad94b98cc0
Summary:
Refactors the plugin architecture of Sonar:
- Before plugin rendering had it's own implementation of the react lifecycle. This means the `render`-function was not called by react, but rather by the application it self. In this diff, the render method is now called from react, which enables better debugging and allows react to do optimizations.
- Business logic for querying emulators is moved away from the view components into its own dispatcher
- All plugin handling is moved from `App.js` to `PluginContainer`.
- The sidebar only shows one selected device. This allows us to add the screenshot feature as part of the Sonar main app and not a plugin.
- This also fixes the inconsistency between the devices button and the sidebar
Reviewed By: jknoxville
Differential Revision: D8186933
fbshipit-source-id: 46404443025bcf18d6eeba0679e098d5440822d5
