fullstorydev/fullstory-babel-plugin-annotate-react

Skip annotation for specific components

omrivardi opened this issue · 10 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

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 Thank you, did you got to take a look?

@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 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

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!

Any progress on this?

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.

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 mobile-support@fullstory.com. If you're running into an issue with a React web app you can reach out to support@fullstory.com and we'll be happy to help out.

Cheers!

@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]],
    },
],