dd6f39c2b3
Summary:
This wires up tracking directly to the ANT component library for the following components:
1. `Button`
2. `Collapse.Panel`
3. `Tabs`
Other less commonly used elements can be connected in the future if needed.
I played a bit with different patterns, but in testing the patch-package patching give the most reliable results. Alternatives considered:
1. Expect users to explicitly wrap there components, e.g. `<Tracked><Button>Hi</Button></Tracked>`
1. Didn't implement this because it would be very common to forget, and at the moment you want to make some analysis you'll discover there is no interesting data available. I think for tracking we want to have opt-out rather than opt-in
2. The additional wrapping can cause some subtile layout issues due to static field inspection / forwarded refs (e.g. Ant often has an assumption that relevant children types are _directly_ nested under their parent element. For examle `<Tooltip><Tracked><Button>` does not work as expected
2. Expose our own `Button` / `Collapse` / `Tabs` that applies `Tracked` to an underlying Ant component.
1. also suffers from 1.b.
2. It is gonna be quite confusing for other devs that some elements would need to be imported from `flipper-plugin`, ant some from `antd`, and that this is likely to change over time. We could lint against it, but it will be still suboptimal
Reviewed By: jknoxville
Differential Revision: D25196321
fbshipit-source-id: b559356498c3191a283062a88daacb354b0f79f4
27 lines
797 B
Diff
27 lines
797 B
Diff
diff --git a/node_modules/antd/es/button/button.js b/node_modules/antd/es/button/button.js
|
|
index 8496110..35cce19 100644
|
|
--- a/node_modules/antd/es/button/button.js
|
|
+++ b/node_modules/antd/es/button/button.js
|
|
@@ -186,6 +186,8 @@ var InternalButton = function InternalButton(props, ref) {
|
|
fixTwoCNChar();
|
|
}, [buttonRef]);
|
|
|
|
+ var scope = React.useContext(global.FlipperTrackingScopeContext);
|
|
+
|
|
var handleClick = function handleClick(e) {
|
|
var onClick = props.onClick;
|
|
|
|
@@ -194,7 +196,11 @@ var InternalButton = function InternalButton(props, ref) {
|
|
}
|
|
|
|
if (onClick) {
|
|
- onClick(e);
|
|
+ global.flipperTrackInteraction(
|
|
+ 'Button', 'onClick', scope, props.title || props.children || props.icon,
|
|
+ onClick,
|
|
+ e
|
|
+ );
|
|
}
|
|
};
|
|
|