react-tooltip: [BUG] Client-side error (".jsx is not a function") in production (minified) NextJS app

Describe the bug

We are using NextJS. We have used react-tooltip v4 with no problem. We have wrapped it with the mounting effect to avoid SSR errors. When we update to v5, we get an application (client-side) error in production that reads a.jsx is not a function. The library functions fine in development.

Version of Package v5.9.1

To Reproduce deploy a production build of a NextJS app using a tooltip of this version—navigate to the page. Note that this is a run-time application error, not a build error.

Expected behavior It should not crash the application

Screenshots image

Desktop (please complete the following information if possible or delete this section):

  • MacOS
  • Firefox
  • 110.0.1 (64-bit)
  • React 18 / Next 13

Additional context We are also using a turbo-repo, though I don’t expect that’s the issue

About this issue

  • Original URL
  • State: closed
  • Created a year ago
  • Reactions: 15
  • Comments: 37 (17 by maintainers)

Commits related to this issue

Most upvoted comments

I’ll take a look as soon as possible at what we changed for beta 4, thanks for letting us know

ps: I’ll probably have time to handle this more carefully next week

I have the same issue. If I set swcMinify: false in next.config.js, the error goes away.

Changing from “react-tooltip”: “^5.7.4”, to “react-tooltip”: “5.8.3”, also resolves it.

After some researches, it seems to be caused by the SWC minifier, enabled by default on next 13 onwards

The SWC compiler had quite a lot of issues that looks a lot like the one you pointed out. See for example https://github.com/vercel/next.js/issues/40601. I’ve tried react-tooltip@5.10.1-beta-7 on the provided repro https://github.com/thomasmost/react-tooltip-repro and the issue reappeared. I managed to solve it by setting swcMinify to false in next.config.js. Using minified or unminified versions of react-tooltip did not changed anything. Eg: both works as long as swcMinify is false. Also, both minified and unminified versions of 5.10.1-beta.4 works.

Since other bundlers work without any problem, I have the feeling that this is a bug of swcMinify, that Terser (used when swcMinify: false) does not have. Knowing the complexity of minifiers, I would not be surprised at all if it were a bug of swc, not really related to this package.

Same here downgrade to 5.8.3 fixed the pb

+1 for this. Our production is also gone now 😪 Screen Shot 2023-03-08 at 11 09 10 am

@pohy @everyone please try this one: https://github.com/ReactTooltip/react-tooltip/pull/984#issuecomment-1488476993 (the next release candidate) and let us know.

I tested this PR using Next.js 13 + experimental APP folder and SWC enabled and worked.

The latest version (5.10.4) still has this issue for us. We are using NextJS 13 with babel. Downgrading to 5.8.3, as suggested above, helped.

Hi guys, we are still working on this, please check open PRs and let us know wich works 100% for you!

Thanks

Working in my deployed app as well!

@danielbarion Working in my sample repo! Gonna try it in my main project as well

Well thanks a lot for the help I’m going to test and monitor it, since I depend a lot on the library Anyway, if it happens again, I’ll come here to tell you with more information to debug

@pohy @everyone please try this one: #984 (comment) (the next release candidate) and let us know.

I tested this PR using Next.js 13 + experimental APP folder and SWC enabled and worked.

I can confirm I’m running "next": "13.2.4", and after installing "react-tooltip": "^5.10.2-beta.4", and running npm run build and npm run start I’m no longer getting the above issues.

This beta version is broken too I using next 13.2.4, SWC The error only occurs in a production build I’m not using the app directory

When I hover over the element that triggers the tooltip, this happens image

guys, just a heads up, please check this comment: #984 (comment)

5.10.2-beta.1 fixes this issue for me on NextJS 13.1.6 (using SWC, not using experimental app folder), in both dev and production builds

I can confirm that react-tooltip@5.10.1-beta.4 corrects the issue for me. Will there be a patch version released with this?

@danielbarion https://github.com/ReactTooltip/react-tooltip/issues/981#issuecomment-1464054004

not sure what was the exact change, but maybe this helps tracking it down