ueberdosis / tiptap

The headless rich text editor framework for web artisans.
https://tiptap.dev
MIT License
26.36k stars 2.22k forks source link

[Bug]: When a piece of text is configured with both a line-through and an underline, pressing enter between the texts will not be wrapped #5120

Closed jserTang closed 3 months ago

jserTang commented 3 months ago

Which packages did you experience the bug in?

core, react, underline, text, text-style, text-align, highlight, table, color, image, link, bullet-list, list-item, placeholder

What Tiptap version are you using?

2.2.4

What’s the bug you are facing?

In Android phone, when a piece of text is configured with both a line-through and an underline, pressing enter between the texts will not be wrapped.

There are no errors in the browser console.

This works fine on the pc side of the browser.

Device: Android Chrome

What browser are you using?

Chrome

Code example

No response

What did you expect to happen?

When you press Enter on your phone's soft keyboard, it should be split into two lines of text.

Anything to add? (optional)

issues

        "@tiptap/core": "2.2.4",
        "@tiptap/extension-color": "2.2.4",
        "@tiptap/extension-highlight": "2.2.4",
        "@tiptap/extension-image": "2.2.4",
        "@tiptap/extension-link": "2.2.4",
        "@tiptap/extension-bullet-list": "2.2.4",
        "@tiptap/extension-ordered-list": "2.2.4",
        "@tiptap/extension-list-item": "2.2.4",
        "@tiptap/extension-paragraph": "2.2.4",
        "@tiptap/extension-placeholder": "2.2.4",
        "@tiptap/extension-text": "2.2.4",
        "@tiptap/extension-heading": "2.2.4",
        "@tiptap/extension-text-align": "2.2.4",
        "@tiptap/extension-text-style": "2.2.4",
        "@tiptap/extension-underline": "2.2.4",
        "@tiptap/extension-youtube": "2.2.4",
        "@tiptap/extension-table": "2.2.4",
        "@tiptap/extension-table-row": "2.2.4",
        "@tiptap/extension-table-header": "2.2.4",
        "@tiptap/extension-table-cell": "2.2.4",
        "@tiptap/pm": "2.0.3",
        "@tiptap/react": "2.2.4",
        "@tiptap/starter-kit": "2.2.4",

Did you update your dependencies?

Are you sponsoring us?

jserTang commented 3 months ago

I seem to have located the problem because I have set the css style 'display: inline-flex' on the s tag and the text will not be allowed to wrap when there are any other tags inside the s tag (e.g. the u tag). If the s tag is just plain text, that's fine. This looks like a browser bug. Oddly enough, this is only happens on Android.