tiptap: TypeError: Cannot set property Editor of # which has only a getter

What’s the bug you are facing?

I’ve just updated tiptap to ^2.0.0-beta.212 and my build is failing with error

🕙 09:17 ❯ yarn build
unocss v0.49.4                                                                                                             09:17:14
start UnoCSS for production...                                                                                             09:17:14
√ 510 utilities generated to src/styles/unocss.css                                                                         09:17:14

info  - Loaded env from D:\Discord\Sofi-Site\apps\website\.env.production
warn  - You have enabled experimental feature (appDir) in next.config.js.
warn  - Experimental features are not covered by semver, and may cause unexpected or broken application behavior. Use at your own risk.
info  - Thank you for testing `appDir` please leave your feedback at https://nextjs.link/app-feedback

info  - Creating an optimized production build
info  - Compiled successfully
info  - Skipping linting
info  - Checking validity of types
info  - Collecting page data ...TypeError: Cannot set property Editor of #<Object> which has only a getter
    at Object.<anonymous> (D:\Discord\Sofi-Site\node_modules\@tiptap\react\dist\index.cjs:437:49)
    at Module._compile (node:internal/modules/cjs/loader:1218:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1272:10)
    at Module.load (node:internal/modules/cjs/loader:1081:32)
    at Module._load (node:internal/modules/cjs/loader:922:12)
    at Module.require (node:internal/modules/cjs/loader:1105:19)
    at require (node:internal/modules/cjs/helpers:103:18)
    at Object.<anonymous> (D:\Discord\Sofi-Site\node_modules\@mantine\tiptap\cjs\Content\Content.js:7:13)
    at Module._compile (node:internal/modules/cjs/loader:1218:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1272:10)

> Build error occurred
Error: Failed to collect page data for /profile/[userId]
    at D:\Discord\Sofi-Site\node_modules\next\dist\build\utils.js:963:15
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
  type: 'Error'
}
info  - Collecting page data .

Which browser was this experienced in? Are any special extensions installed?

At build time

How can we reproduce the bug on our side?

running yarn build in below link should show the error but instead, it’s showing #3689

Can you provide a CodeSandbox?

https://codesandbox.io/p/sandbox/vibrant-shtern-xo60cz?file=%2Fpages%2Findex.tsx&selection=[{"endColumn"%3A6%2C"endLineNumber"%3A8%2C"startColumn"%3A6%2C"startLineNumber"%3A8}]

What did you expect to happen?

It should pass

Anything to add? (optional)

I’m guessing it’s an issue with the new build setup

Did you update your dependencies?

  • Yes, I’ve updated my dependencies to use the latest version of all packages.

Are you sponsoring us?

  • Yes, I’m a sponsor. 💖

About this issue

  • Original URL
  • State: closed
  • Created a year ago
  • Reactions: 9
  • Comments: 20 (9 by maintainers)

Most upvoted comments

I see. Sorry for that. I just opened a PR that should be merged by tomorrow which should revert this back to the old state. If the code base is stable again we’ll discuss the following changes:

  • Pinning Tiptap dependencies by specific versions (for example @tiptap/react@2.0.0-beta.214 only accepting @tiptap/extension-bubble-menu@2.0.0-beta.214) and vice versa
  • Getting Tiptap closer to a stable release number so we can follow the Semver approach again. This way we can work on larger, breaking changes on a separate alpha/beta release than our hotfixes/minor changes which we can do directly on the main semver versions

same issue with 2.0.0-beta.211

last working version is 2.0.0-beta.209

I just released 2.0.0-beta.214 which uses our old build process with a few minor changes and the new PM package. Would be nice to see if this fixes the issues introduced by the esbuild builds.

I think a revert / rollback would be a good strategy since this release is simply not working and might just blew pipeline (it was the case on the site of one of my client and I hade to remove the dependency just to be sure it doesn’t go up to beta 212)

It seems like this is connected to the CJS bundle. I’ll see that we fix it today in time for the weekend.

From what I’ve seen is that this issue comes from esbuild not handling multiple exports coming from the Editor.ts of @tiptap/react and the Editor.ts of @tiptap/core which is also exported from the entry file.

I’ll set some focus on this issue for today to see if we can get around this problem without doing a hard rollback back to the pre-@tiptap/pm stage because that would bring a lot of confusion with it and I’d save it as a last resort action.

Closing this issue as it’s now fixed in the latest version.

Note that beta-213 does not fix this issue. And due to the way dependencies are handled, it’s not possible to specify a previous version in package.json…

Same problem here in Next.js and also with jest

Just a quick question - what setup are you running? I think most new project setups use the new esmodules and not the CJS module. Were your projects generated by an older @vue/cli version?

I’m using nextjs which is using webpack5 and even with type: module, webpack adds a package json inside of .next folder with type: commonjs and resolves cjs files

Thanks, I’ll spin up my own setup then and test around. I’ll report back when I find something!

We are using nuxt2 with vue2. There is webpack4 used behind the scene.