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.

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

WYSIWYG editor example (tiptap third party plugin integration): lists not working #342

Closed
RSchmitzHH opened this issue Apr 13, 2024 · 3 comments
Labels
bug Something isn't working

Comments

@RSchmitzHH
Copy link

RSchmitzHH commented Apr 13, 2024

Hi there!

I really love that you integrated tiptap's WYSIWYG editor! However, in your example in the docs, the lists (incl. ordered lists, indent) seem not to work so far. Tested with Chrome and Safari.

Cheers,
Rüdiger

@RSchmitzHH RSchmitzHH changed the title WYSIWYG editor example (tiptap third party plugin integration): lists & block quote not working WYSIWYG editor example (tiptap third party plugin integration): lists not working Apr 18, 2024
@RSchmitzHH
Copy link
Author

RSchmitzHH commented Apr 18, 2024

Have a running version with Vue3 and tiptap, will share it later here.

@olegpix
Copy link
Collaborator

olegpix commented May 3, 2024

Hi there!

I really love that you integrated tiptap's WYSIWYG editor! However, in your example in the docs, the lists (incl. ordered lists, indent) seem not to work so far. Tested with Chrome and Safari.

Cheers, Rüdiger

Hi!
Thanks for the notice. You're right, the issue is really exists. The problem could be solved by mapping different versions of prosemirror-model to the one.
In our case the following code helped:

<script type="importmap">
    {
      "imports": {
        "https://esm.sh/v135/prosemirror-model@1.19.3/es2022/prosemirror-model.mjs": "https://esm.sh/v135/prosemirror-model@1.20.0/es2022/prosemirror-model.mjs",
        "https://esm.sh/v135/prosemirror-model@1.19.4/es2022/prosemirror-model.mjs": "https://esm.sh/v135/prosemirror-model@1.20.0/es2022/prosemirror-model.mjs"
      }
    }
  </script>

The issue appears because of different versions of the prosemirror-model in some imports here

import { Editor } from 'https://esm.sh/@tiptap/core';
  import Placeholder from 'https://esm.sh/@tiptap/extension-placeholder';
  import StarterKit from 'https://esm.sh/@tiptap/starter-kit';
  import Paragraph from 'https://esm.sh/@tiptap/extension-paragraph';
  import Bold from 'https://esm.sh/@tiptap/extension-bold';
  import Underline from 'https://esm.sh/@tiptap/extension-underline';
  import Link from 'https://esm.sh/@tiptap/extension-link';
  import BulletList from 'https://esm.sh/@tiptap/extension-bullet-list';
  import OrderedList from 'https://esm.sh/@tiptap/extension-ordered-list';
  import ListItem from 'https://esm.sh/@tiptap/extension-list-item';
  import Blockquote from 'https://esm.sh/@tiptap/extension-blockquote';

We will fix this in the next update in our code as well.

@jahaganiev jahaganiev added the bug Something isn't working label May 24, 2024
@jahaganiev
Copy link
Member

Hey @RSchmitzHH - the issue has been fixed in 2.3.0 update.

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

No branches or pull requests

3 participants