"Uncaught TypeError: X is not a function" in Menu.tsx

[bhufmann]

Do you want to request a feature or report a bug? Bug. Not sure if it's a bug. It might be in my environment. I'm looking for help to resolve issue.

What is the current behavior? I implementing a context menu using react-contexify v6.0.0 and I get the following exception and my component is not rendered:

react-dom.development.js:26923 Uncaught TypeError: X is not a function
    at S (Menu.tsx:3:3)
    at it (Menu.tsx:3:3)
    at renderWithHooks (react-dom.development.js:16305:1)
    at mountIndeterminateComponent (react-dom.development.js:20074:1)
    at beginWork (react-dom.development.js:21587:1)
    at beginWork$1 (react-dom.development.js:27426:1)
    at performUnitOfWork (react-dom.development.js:26560:1)
    at workLoopSync (react-dom.development.js:26466:1)
    at renderRootSync (react-dom.development.js:26434:1)
    at recoverFromConcurrentError (react-dom.development.js:25850:1)

The Chrome dev tools show the error on the following line of Menu.tsx:3:3

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have dependencies other than React. Paste the link to your CodeSandbox (https://codesandbox.io/s/new) example below: I don't have simple example to reproduce. I'm in development of a full-stack application with a lot changes to use the context menu.

What is the expected behavior? No exception and component is rendered

Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React? I'm using react v18.2.0. I'm running Linux (Ubuntu 18.04). It happens with recent Chrome browser. I tried using react-contexify v5.0.0 and I don't see that error. However, I see flashing menu when it's being closed which is supposed to be fixed in v6.0.0.

[hollowaybt]

Confirmed I am hitting the same issue described above with 6.0.0 following the example in the "gist". Dropped the version of react-contexify to 5.0.1-1 and seems to be working now without any code changes.

If it helps here are the packages I'm using in case there is some weird interaction (list generated after dropping to rev 5.0.1-1).

├── @apollo/client@3.7.8 ├── @babel/core@7.20.12 ├── @babel/plugin-transform-classes@7.20.7 ├── @babel/preset-env@7.20.2 ├── @babel/preset-react@7.18.6 ├── @projectstorm/react-diagrams@7.0.1 ├── @types/react-dom@18.0.11 ├── @types/styled-components@5.1.26 ├── @typescript-eslint/eslint-plugin@5.52.0 ├── @typescript-eslint/parser@5.52.0 ├── babel-loader@9.1.2 ├── bootstrap@5.2.3 ├── css-loader@6.7.3 ├── eslint-config-standard-with-typescript@34.0.0 ├── eslint-plugin-import@2.27.5 ├── eslint-plugin-n@15.6.1 ├── eslint-plugin-promise@6.1.1 ├── eslint-plugin-react@7.32.2 ├── eslint@8.34.0 ├── graphql@16.6.0 ├── react-bootstrap@2.7.2 ├── react-contexify@5.0.1-1 ├── react-dom@18.2.0 ├── react-tooltip@5.8.1 ├── react@18.2.0 ├── style-loader@3.3.1 ├── styled-components@5.3.6 ├── ts-loader@9.4.2 ├── typescript@4.9.5 ├── webpack-cli@5.0.1 └── webpack@5.75.0

[shubham-solytics]

I'm facing same issue with react-contexify v6.0.0. Appears to be some issue with clsx dependency.

[joaopbnogueira]

Forcing react-contexify to use clsx 2.0.0 through overrides solved the issue for me.

@fkhadra since upgrading to 2.0.0 should be fine according to the release notes, is this something that you'd be willing to accept?