Add new HOC for instrumenting components manually #266
+104
−0
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
Our project uses Pickers quite extensively, from https://github.com/react-native-picker/picker.
However, using these pickers has one limitation - unlike Touchables, etc. they are not instrumented with Heap for autocapture.
This means that we need to try and do it ourselves, either with custom events or another method. This is less than ideal, and is prone to errors.
This PR instead adds a new HOC that can be used to wrap the picker and wire it up with autocapture, like so:
Previously, I had proposed a hard-coded solution (#265), but I found that almost immediately lacking. This instead covers far more cases.
Once it has been instrumented, whenever the picker opens (
onFocus
) we get a touch event auto captured in Heap. This then allows us to define our events directly in Heap with ease!While working on this, we also had need to instrument some native components that, while not
Touchables
exactly, haveonPress
as a prop and behave in a similar way. To get this, we took a similar approach of using the HOC. This PR adds those HOCs toindex.d.ts
to ensure they can be used.I cloned a lot of the work in
withHeapFocusableAutocapture
from prior work - please let me know if it is correct.I also tried my best to define the HOCs in TypeScript, but I may have missed something there too.
No, these are only additions.
Test Plan
I applied these changes to my local project with
patch-package
and verified that:No, I did not see any test cases for the other HOCs, so I have not here. Please let me know what to cover and I will give it a try.
Yes, I tested manually in my project.
Checklist