fullstory-babel-plugin-annotate-react icon indicating copy to clipboard operation
fullstory-babel-plugin-annotate-react copied to clipboard

Skip annotation for specific components

Open omrivardi opened this issue 3 years ago • 9 comments

Hi, I have an issue integrating fullstory in my react app. This looks similar to #13 which I commented on.

I am using ThemeProvider component from react-jss. It's looks like it isn't happy with the new annotations. image

Is it possible to skip the annotations for this and other components? Perhaps as part of the babel plugin options?

Thanks

omrivardi avatar Mar 14 '21 15:03 omrivardi

Hi @omrivardi Thank you so much for your feedback and creating a new issue. We will look into this issue and see what we need to do to support this use case. I will mark this as an enhancement so we can investigate skipping annotations and/or workaround for this error

sabrina-li avatar Mar 23 '21 21:03 sabrina-li

@sabrina-li Thank you, did you got to take a look?

omrivardi avatar Apr 20 '21 12:04 omrivardi

@omrivardi Thank you for following up with us! In order to understand what exactly is going on here, I've been trying to recreate the error that you are seeing when using ThemeProvider and the plugin.

I used create-react-app to create the boilerplates, added theming and prop-types, then created one <DemoBox> component to be rendered in app, within a <ThemeProvider>

The repro app is on the sabrina/theming-sample branch, in the samples folder here However I haven't been able to recreate the error in this toy project.

Would you be willing to take a look at the sample app linked above, and see if anything pops out that are obviously different than what you have in your project? Also it'd be immensely helpful if you have a sample app that consistently reproduces the error that maybe you can share with us so we can take a closer look to understand the issue.

sabrina-li avatar Apr 22 '21 21:04 sabrina-li

@sabrina-li Thank you 😄

I am sorry for misguiding you in my previous comment. I was using @material-ui/core/styles

I modified your example to reproduce the error I am seeing here.

This should reproduce the following error: image

omrivardi avatar Apr 26 '21 07:04 omrivardi

Hi @omrivardi Thank you so much for the sample code!

I'm able to reproduce the warning above. And I did a little digging, looks like this warning is due to the material-ui package adding a specialProperty in it's exactProp.ts file. The special check throws the warning when it detects the data- props. The warning is showing only once during development.

We would like continue investigate further to see how we can improve and stop triggering this check with material ui. Thanks again for bring this to our attention and creating the replicable sample!

sabrina-li avatar May 12 '21 16:05 sabrina-li

Any progress on this?

nateq314 avatar Sep 20 '21 20:09 nateq314

Hi, I'm interested in this as well. Having issues with victory-native. My app crashes when loading a chart. Removing the babel react-annoate plugin solves it.

I dug a bit and it looks that VictoryPie has a property named dataComponent, which probably gets overwritten by fullstory and causes this issue.

manzurola avatar Dec 22 '21 12:12 manzurola

Hi @nateq314 and @manzurola, thanks for checking in. I'm RC with the FullStory support engineering team. We're not really set up to provide support via GitHub issues. If you're having trouble with a React Native mobile app, reach out to [email protected]. If you're running into an issue with a React web app you can reach out to [email protected] and we'll be happy to help out.

Cheers!

rcmaples avatar Dec 22 '21 14:12 rcmaples

@nateq314 and anyone who needs a fix, you can exclude this module and relevant files via babel. As such:

overrides: [
    {
      include: './node_modules/victory-native',
      plugins: [['@fullstory/annotate-react', false]],
    },
],

manzurola avatar Dec 23 '21 10:12 manzurola

Please use the Ignore Components feature to avoid attribute conflicts.

RyanCommits avatar Jul 25 '24 19:07 RyanCommits