Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[BUG] mutationObserver.ts:61 Uncaught TypeError: __privateGet(...).defaultMutationOptions is not a function #6408

Closed
dzcpy opened this issue Oct 15, 2024 · 9 comments
Closed

[BUG] mutationObserver.ts:61 Uncaught TypeError: __privateGet(...).defaultMutationOptions is not a function #6408

dzcpy opened this issue Oct 15, 2024 · 9 comments
Labels
bug Something isn't working

Comments

@dzcpy
Copy link
Contributor

dzcpy commented Oct 15, 2024

Describe the bug

Hi,
Today I deleted the pnpm's pnpm-lock.yml and reinstalled the modules. However Refine stops working, showing the following errors:

hook.js:591 Warning: [antd: Menu] `children` is deprecated. Please use `items` instead. Error Component Stack:
    at menu.js:39:26
    at index.js:12:19
    at div (<anonymous>)
    at aside (<anonymous>)
    at Sider.js:41:18
    at ThemedSiderV2 (sider.tsx:41:69)
    at Sider (<anonymous>)
    at div (<anonymous>)
    at layout.js:59:13
    at Layout (<anonymous>)
    at ThemedLayoutContextProvider (index.tsx:15:9)
    at ThemedLayoutV2 (index.tsx:10:74)
    at Authenticated (index.tsx:95:3)
    at RenderedRoute (hooks.tsx:658:26)
    at Routes (components.tsx:504:3)
    at UnsavedWarnContextProvider (index.tsx:8:3)
    at RefineContextProvider (index.tsx:83:3)
    at UndoableQueueContextProvider (index.tsx:68:3)
    at AuditLogContextProvider (index.tsx:9:8)
    at AccessControlContextProvider (index.tsx:20:8)
    at I18nContextProvider (index.tsx:11:3)
    at ResourceContextProvider (index.tsx:14:19)
    at LegacyRouterContextProvider (index.tsx:19:3)
    at RouterContextProvider (index.tsx:12:8)
    at LiveContextProvider (index.tsx:8:3)
    at DataContextProvider (index.tsx:17:3)
    at AuthBindingsContextProvider (index.tsx:85:8)
    at LegacyAuthContextProvider (index.tsx:17:8)
    at NotificationContextProvider (index.tsx:12:8)
    at QueryClientProvider (QueryClientProvider.tsx:30:3)
    at Refine (index.tsx:40:3)
    at GoogleOAuthProvider (index.esm.js:36:32)
    at LocaleProvider (index.js:11:5)
    at MotionWrapper (MotionWrapper.js:8:5)
    at ProviderChildren (index.js:105:5)
    at ConfigProvider (index.js:396:25)
    at Router (components.tsx:413:13)
    at BrowserRouter (index.tsx:783:3)
    at App (app.tsx:49:45)
overrideMethod @ hook.js:591
hook.js:591 Warning: findDOMNode is deprecated and will be removed in the next major release. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-find-node Error Component Stack:
    at SingleObserver (index.js:10:24)
    at ResizeObserver3 (index.js:12:24)
    at index.js:33:34
    at Tooltip2 (Tooltip.js:11:32)
    at index.js:30:16
    at MenuItem2 (MenuItem.js:15:5)
    at CanAccess (index.tsx:61:13)
    at index.js:261:24
    at SubMenu2 (SubMenu.js:13:5)
    at CanAccess (index.tsx:61:13)
    at div (<anonymous>)
    at InheritableContextProvider (MenuContext.js:19:23)
    at Menu.js:47:27
    at menu.js:39:26
    at index.js:12:19
    at div (<anonymous>)
    at aside (<anonymous>)
    at Sider.js:41:18
    at ThemedSiderV2 (sider.tsx:41:69)
    at Sider (<anonymous>)
    at div (<anonymous>)
    at layout.js:59:13
    at Layout (<anonymous>)
    at ThemedLayoutContextProvider (index.tsx:15:9)
    at ThemedLayoutV2 (index.tsx:10:74)
    at Authenticated (index.tsx:95:3)
    at RenderedRoute (hooks.tsx:658:26)
    at Routes (components.tsx:504:3)
    at UnsavedWarnContextProvider (index.tsx:8:3)
    at RefineContextProvider (index.tsx:83:3)
    at UndoableQueueContextProvider (index.tsx:68:3)
    at AuditLogContextProvider (index.tsx:9:8)
    at AccessControlContextProvider (index.tsx:20:8)
    at I18nContextProvider (index.tsx:11:3)
    at ResourceContextProvider (index.tsx:14:19)
    at LegacyRouterContextProvider (index.tsx:19:3)
    at RouterContextProvider (index.tsx:12:8)
    at LiveContextProvider (index.tsx:8:3)
    at DataContextProvider (index.tsx:17:3)
    at AuthBindingsContextProvider (index.tsx:85:8)
    at LegacyAuthContextProvider (index.tsx:17:8)
    at NotificationContextProvider (index.tsx:12:8)
    at QueryClientProvider (QueryClientProvider.tsx:30:3)
    at Refine (index.tsx:40:3)
    at GoogleOAuthProvider (index.esm.js:36:32)
    at LocaleProvider (index.js:11:5)
    at MotionWrapper (MotionWrapper.js:8:5)
    at ProviderChildren (index.js:105:5)
    at ConfigProvider (index.js:396:25)
    at Router (components.tsx:413:13)
    at BrowserRouter (index.tsx:783:3)
    at App (app.tsx:49:45)
overrideMethod @ hook.js:591
hook.js:591 Warning: Instance created by `useForm` is not connected to any Form element. Forget to pass `form` prop?
overrideMethod @ hook.js:591
30mutationObserver.ts:61 Uncaught TypeError: __privateGet(...).defaultMutationOptions is not a function
    at _a10.setOptions (mutationObserver.ts:61:33)
    at new _a10 (mutationObserver.ts:45:10)
    at useMutation.ts:28:7
    at mountState (react-dom.development.js:16167:20)
    at Object.useState (react-dom.development.js:16880:16)
    at Object.useState (react.development.js:1622:21)
    at useMutation (useMutation.ts:26:28)
    at useLog (index.ts:92:15)
    at useDelete (useDelete.ts:164:19)
    at useDeleteButton (index.tsx:41:44)
15hook.js:591 The above error occurred in the <DeleteButton> component:

    at DeleteButton (http://localhost:4000/node_modules/.vite/deps/@refinedev_antd.js?v=002fc8b6:27802:26)
    at div
    at Item3 (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:62313:5)
    at div
    at http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:62349:16
    at td
    at Cell2 (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:93110:5)
    at tr
    at BodyRow (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:93468:5)
    at ImmutableComponent2 (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:92914:7)
    at tbody
    at Body (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:93584:5)
    at ImmutableComponent2 (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:92914:7)
    at table
    at div
    at div
    at div
    at DomWrapper4 (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:2714:5)
    at SingleObserver (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:2728:24)
    at ResizeObserver3 (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:2805:24)
    at Provider2 (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:92808:22)
    at Table (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:94594:32)
    at ImmutableComponent2 (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:92886:38)
    at div
    at div
    at Spin (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:68892:16)
    at div
    at InternalTable (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:101535:16)
    at Table2 (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:101869:36)
    at div
    at div
    at div
    at DomWrapper4 (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:2714:5)
    at SingleObserver (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:2728:24)
    at ResizeObserver3 (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:2805:24)
    at PageHeader2 (http://localhost:4000/node_modules/.vite/deps/@refinedev_antd.js?v=002fc8b6:26615:34)
    at PageHeader (http://localhost:4000/node_modules/.vite/deps/@refinedev_antd.js?v=002fc8b6:27986:26)
    at div
    at List (http://localhost:4000/node_modules/.vite/deps/@refinedev_antd.js?v=002fc8b6:27852:27)
    at AccessoryProductList (http://localhost:4000/src/pages/accessory-product/list.tsx:35:44)
    at RenderedRoute (http://localhost:4000/node_modules/.vite/deps/chunk-CN3UI2YZ.js?v=9376b192:4069:5)
    at RenderedRoute (http://localhost:4000/node_modules/.vite/deps/chunk-CN3UI2YZ.js?v=9376b192:4069:5)
    at Outlet (http://localhost:4000/node_modules/.vite/deps/chunk-CN3UI2YZ.js?v=9376b192:4444:26)
    at div
    at div
    at main
    at http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:67009:16
    at Content
    at div
    at http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:67028:16
    at Layout
    at div
    at http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:67028:16
    at Layout
    at ThemedLayoutContextProvider (http://localhost:4000/node_modules/.vite/deps/@refinedev_antd.js?v=002fc8b6:27664:26)
    at ThemedLayoutV2 (http://localhost:4000/node_modules/.vite/deps/@refinedev_antd.js?v=002fc8b6:27774:26)
    at Authenticated (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:6084:31)
    at RenderedRoute (http://localhost:4000/node_modules/.vite/deps/chunk-CN3UI2YZ.js?v=9376b192:4069:5)
    at Routes (http://localhost:4000/node_modules/.vite/deps/chunk-CN3UI2YZ.js?v=9376b192:4508:5)
    at UnsavedWarnContextProvider (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:4565:25)
    at RefineContextProvider (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:4458:29)
    at UndoableQueueContextProvider (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:5390:25)
    at AuditLogContextProvider (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:5762:23)
    at AccessControlContextProvider (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:5670:20)
    at I18nContextProvider (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:5411:25)
    at ResourceContextProvider (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:5301:26)
    at LegacyRouterContextProvider (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:5664:25)
    at RouterContextProvider (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:5310:25)
    at LiveContextProvider (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:5268:29)
    at DataContextProvider (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:5231:25)
    at AuthBindingsContextProvider (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:4169:25)
    at LegacyAuthContextProvider (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:4136:25)
    at NotificationContextProvider (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:5399:21)
    at QueryClientProvider (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:3807:3)
    at Refine (http://localhost:4000/node_modules/.vite/deps/chunk-CIXOZQBT.js?v=9376b192:6051:35)
    at GoogleOAuthProvider (http://localhost:4000/node_modules/.vite/deps/@react-oauth_google.js?v=e3a1b638:42:32)
    at LocaleProvider (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:5106:13)
    at MotionWrapper (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:7622:5)
    at ProviderChildren (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:7727:5)
    at ConfigProvider (http://localhost:4000/node_modules/.vite/deps/chunk-TO7ZTMCR.js?v=9376b192:8007:27)
    at Router (http://localhost:4000/node_modules/.vite/deps/chunk-CN3UI2YZ.js?v=9376b192:4451:15)
    at BrowserRouter (http://localhost:4000/node_modules/.vite/deps/chunk-CN3UI2YZ.js?v=9376b192:5196:5)
    at App (http://localhost:4000/src/app.tsx:57:328)

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.
overrideMethod @ hook.js:591
react-dom.development.js:12056 Uncaught TypeError: __privateGet(...).defaultMutationOptions is not a function
    at _a10.setOptions (mutationObserver.ts:61:33)
    at new _a10 (mutationObserver.ts:45:10)
    at useMutation.ts:28:7
    at mountState (react-dom.development.js:16167:20)
    at Object.useState (react-dom.development.js:16880:16)
    at Object.useState (react.development.js:1622:21)
    at useMutation (useMutation.ts:26:28)
    at useLog (index.ts:92:15)
    at useDelete (useDelete.ts:164:19)

Looks like it's a react query dependency issue. I upgraded all modules to the most current version and they still don't work. What could be the fix and what version of react query does refine require?

Steps To Reproduce

  1. Go to any listing page, which has a delete button
  2. The error shows.

Expected behavior

Not to throw an error.

Packages

"@refinedev/antd": "^5.37.5",
"@refinedev/core": "^4.48.0",
"@refinedev/react-router-v6": "^4.5.6",
 "antd": "^5.15.1",
 "@tanstack/react-query": "^5.59.13"

Additional Context

No response
@dzcpy dzcpy added the bug Something isn't working label Oct 15, 2024
@BatuhanW
Copy link
Member

BatuhanW commented Oct 15, 2024 •
edited
Loading

Hey @dzcpy try removing node_modules folder and do the install again.

@BatuhanW BatuhanW closed this as not planned Won't fix, can't repro, duplicate, stale Oct 15, 2024
@dzcpy
Copy link
Contributor Author

dzcpy commented Oct 15, 2024

@dzcpy try removing node_modules folder and do the install again.

Just tried that and it's still not working

@dzcpy
Copy link
Contributor Author

dzcpy commented Oct 15, 2024 •
edited
Loading

May I know the max version of @tanstack/react-query refine supports? Maybe I'll need to pin the module to this version.
Also, when do you think refine will upgrade @tanstack/react-query to v5? v4 is a bit outdated and it's already a year+ old

@BatuhanW
Copy link
Member

You don't need to explicitly install react-query package.

@BatuhanW
Copy link
Member

May I know the max version of @tanstack/react-query refine supports? Maybe I'll need to pin the module to this version. Also, when do you think refine will upgrade @tanstack/react-query to v5? v4 is a bit outdated and it's already a year+ old

We have an issue to upgrade to v5 but it's not active for now. There are some breaking changes with Refine.

@BatuhanW
Copy link
Member

Here is the issue #5370

@aliemir
Copy link
Member

aliemir commented Oct 15, 2024

Hey @dzcpy, you can check out the package.json of @refinedev/core here https://github.com/refinedev/refine/blob/master/packages/core/package.json to see the required peer version 🙏 An upgrade to v5 definitely will come but since it will require a major update in @refinedev/core, we want to make it worth a major 😅

@dzcpy
Copy link
Contributor Author

dzcpy commented Oct 16, 2024

Thanks for the response, for anyone else who also has experinced this, explicitly installing v4 version of react query solved the problem

@datner
Copy link

datner commented Oct 22, 2024

@aliemir As the github co-founder and "inventor" of semver said a couple years ago; major version numbers are not sacred

It's just painful legacy, rip the band-aid! You have all the minors in the world (I mean the yy, in xx.yy.zz) to add features 🙏🏻

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@dzcpy @aliemir @BatuhanW @datner